このページには広告が含まれています
WordPress

WordPress奮戦記

この記事は約10分で読めます。

WordPressでブログを運用する中で、あれこれ試したメモを記録していきます。
内容によっては、独立した記事にすることがあります。

2026年3月23日

ローカルテスト環境の導入

これまで、各種コードのテストを本番環境で行っていた。かつてエンジニアだったこともあり、我ながら「本番環境でテストとかありえねえよなあ」と思っていた。それでも本番環境でテストをしていたのは以下のような理由による。

  • レンタルサーバーにもう1個WordPressをインストールしてテスト環境を構築すると、そっちのセキュリティ管理もしなきゃならなくなるから大変そう。
  • ローカル環境ならセキュリティ面は考慮しなくてもよさそうだが、WindowsでWordPressがインストールされたWebサーバーの運用なんて無理だよね……

浅はかにも、「Windows環境でWordPressを動かすことなんてできっこない」と思い込んで、テスト環境を用意することを諦めていたのだ。

結論から言うと、「WindowsでWordPressがインストールされたWebサーバーを運用する方法」はあった。それもほとんど手間を掛けずに可能だった。

今回自分が導入したのはこれ。
メールアドレスの入力が必要だが、それだけでダウンロードできる。

Local

環境を移行するプラグインを使って本番環境の内容をそっくりそのままコピーし、いくつか設定を変更してローカルのテスト環境を整えた。
これで、WordPressのカスタマイズをいろいろ試しやすくなった。

2026年3月22日

コードブロックに行番号を付加

  • 先日、コードブロックにコピーボタンを追加するコードを作成
  • その後投稿した記事に、295行もあるコードが含まれていた
  • これはさすがに……と思い、コードブロックの高さを制限
  • Cocoonの行番号表示機能では、制限された範囲内でしか行番号が表示されないことが判明
  • コードブロックに行番号を付加する機能も作ろう、と思い立つ
  • コピーボタンを追加するコードに行番号を付加する機能を追加しようとする
  • どうやってもレイアウト崩れ等の現象が発生
  • 諦めかける
  • 独立した機能として行番号付加機能を作ればいいのでは?と思いつく
  • コードブロックに行番号を付加する機能「のみ」の生成をAIに指示
  • “ほぼ”思ったとおりの動作をするように
  • 「行番号が途中までしかカウントされていない(ように見える)」現象が発生
  • AIの力を借りていろいろ試してみるが改善されない
  • 真の原因が、行番号のカウントではなく、行番号とコードで行の高さが違うことで生じた表示のズレであることが判明
    • コードの後ろ側になるほど「ズレ」が蓄積されるため、「途中でカウントが止まってしまっている」ように見えていた(行番号の方が高さがわずかに低かった)
    • カウント自体は正しく行われていた
    • 出力されたHTMLにも問題がなかったため、AIでは原因を突き止められなかった
  • AIに対策を指示
  • 無事に解決
  • さらに微調整を繰り返す
  • フォントサイズなどが変わっても完全に内容に追従する行番号付加機能が完成

コピーボタン追加コードと合わせて、こちらのコードもそのうち公開する予定。

今回の件で、「複雑な機能を追加するときは機能を細分化し、1つずつコードを生成し組み込むこと」「(前回の広告の時もそうだが)”見た目”に関する問題はAIでは解決しにくいので、人間がよく”見て”チェックすることも大事であること」を学んだ。

リビジョン削除プラグインからの脱却

WordPressで記事を保存すると増えていくリビジョン。
多人数で運営しているブログならともかく、管理者が一人で運営している個人ブログでは正直そこまで必要のない機能である。一方で、データベースサイズを肥大化させ、パフォーマンスを悪化させる可能性がある機能でもある。
なので、生成されるリビジョン数を制限し、自動で削除してくれるプラグインを導入していたが、「これもコードに置き換えられないかな……」と思ってAIに相談した。AIからの返答では「できます」とのことだったので「じゃあお願い」と頼むとコードが生成された。
そのコードを組み込んでみたところ、確かにリビジョンが削除されているようで、投稿画面から「リビジョン」表示が消えた。

こちらのコードもそのうち公開する予定。

2026年3月20日

広告の表示調整・決定版

以前、広告の表示を、AIの助力を得つつ調整したことを記録した。
ただ、かなり苦労して追い込んだ割に、思い通りの表示になっていたわけではなかった。

そこで、ブラウザの検証ツールを使いつつ、何とかならないか眺めていたところ、思わぬ原因が発覚。AIに頼らずともどうにかなりそうだったので手書きでCSSを書き換えてみたら、Chrome・Edgeともに「こう表示されて欲しい」と思っていたとおりの表示になった。

今回の件で、「AIが便利なのは確かだが、頼り過ぎてはいけないこと」「AIは全ての状況を把握できているわけではないので、人間が俯瞰的に状況を捉えてやる必要があること」を学んだ。

完全に自分のブログに特化したカスタマイズなので、CSSそのものは他人には無価値だと思うが、このときいろいろ苦労したこと、最終的な問題点に気付いた経緯、などは他の人の参考になることがあるかも知れないので、いずれ記事にする予定。

2026年3月18日

マルチサイト機能を試す

WordPressにマルチサイトという機能があると知って試してみた。
今回参考にした記事はこちら。

WordPressのマルチサイトとは?メリット・デメリットや具体的な作成方法を解説|ワプ活
WordPressのマルチサイトについて徹底解説します。マルチサイトとは、1つのWordPressで複数のサイトを作成・運用すること。ワードプレスをマルチサイト化すれば、複数のWebサイトをそれぞれ自由に運用しつつ、一括での管理もおこなうこ...

今はこのブログだけだが、将来的に何らかの理由でブログを分ける可能性を考えると、マルチサイト機能を使えるようにしておいた方が便利そうだな、と感じた。

そこで、説明通りに設定ファイルを編集してマルチサイト機能を有効にしてみたのだが……

重要なプラグインのいくつかがマルチサイトに対応していなかったので、今回は導入を見送った。まあ、プラグインの性質上対応していないだろうなあ、と思っていたので、この結果は想定の範囲内。

いずれもっと知識を付けて、再チャレンジしてみたい。

プラグインをコードに置き換える

インストールしているプラグインが適正とされる量(~20個未満)を超えてしまったので、少しでも減らせないかな、と思い、比較的動作が単純そうなプラグインを4つ選んでコードに置き換えてみた。

置き換えたプラグインを削除したことで、プラグイン総数は20個を下回り、とりあえず目標数値は達成できた。ただ、同様の機能をコードに置き換えているだけなので、パフォーマンス面ではあまり影響ないか、下手したら悪化している可能性もある。

とは言え、自分がいつでも編集できるコードに置き換えたことで、何かあったときに対処しやすくなったのは確か。レイアウトが気に入らない、とか、この機能を付け足したい、などの不満点が今後出てきたとしても、コードを編集すれば対応できるのは大きい。

サイトマップ生成プラグインからの脱却

まずはサイトマップ生成プラグイン。これはその名の通りサイトマップを生成するためのプラグインだが、「この程度のことならプラグインを使わなくてもコードで代用できるんじゃね?」と思った。

そこで、いつも通りAIに相談してコードを生成してもらい、こちらの思惑通りに動くことを確認したところでプラグインを削除。
さようなら、WP Sitemap Pageプラグイン……

今回生成されたコードはいずれ公開する予定。

WP Sitemap Page
Add a sitemap on any of your page using the simple shortcode . Improve the SEO and navigation of your website.

コードブロックにコピーボタンを付け足すプラグインからの脱却

サイトマップ生成プラグインの脱プラグインが上手く行ったので、次に目を付けたのがこれ。
コードブロックの右上にコピーボタンを追加し、ワンクリック・ワンタップで簡単に内容をコピーできるようにするプラグインである。

Sticky Copy Button for Code Blocks
Adds a floating "Copy" button to every code block, with extensive styling options, optional line numbers, max-height con...

「これもいちいちプラグイン使わなくても行けそうだよなあ……」と思ったので、AIに相談してコードを生成してもらう。これも思ったとおりの動作をすることが確認できたので、Sticky Copy Button for Code Blockも削除。今までありがとうね。

今回生成されたコードはいずれ公開する予定。
行番号を付加するコードも作ったので、それと合わせて公開する。

カテゴリーリスト・アーカイブリストプラグインからの脱却

ここまで来たらもう行けるところまで行こう、と、カテゴリーリストとアーカイブリストの脱プラグインも画策。
それぞれに対してJS Categories List WidgetとJS Archive Listを導入していたのは過去の記録でも書いたとおりだが、こちらも「コードで行けそうだな」と思って試してみたところ、プラグインを使っていたときよりも自分の理想に近い形になってしまったので、こちらのプラグイン2つもサクッと削除。

今回生成されたコードはいずれ公開する予定。
3月22日追記。個別記事を作成し、コードを公開しました。

2026年3月12日

AdSense審査通過に伴うCMP導入

Complianz – GDPR/CCPA Cookie Consent
Configure your Cookie Banner, Cookie Consent and Cookie Policy with our Wizard and Cookies Scan.

このブログを立ち上げて1週間ほどしたところで申請したGoogle AdSenseはあえなく撃沈。
一度申請を取り消して、もうしばらくしてから申請し直してみたら、今度は通過。

早速Advanced AdsにAdSenseに関する設定をしたところ、CMP(Consent Management Platform、同意管理プラットフォーム)が必要と表示されたので、例によってAIに相談しつつ導入。
これまたいろいろな躓きがあったが、そのたびにAIの助力を得てなんとか乗り越えた。

2026年3月11日

広告表示とその見た目の調整

Advanced Ads – Ad Manager & AdSense
すべての広告タイプに対応する唯一の完全なツールキット。AdSense、Amazon、その他のアフィリエイトネットワークで収益を増やしましょう。ピンポイントのターゲティングと最高のサポートをご利用ください。

ブログに広告を表示するにあたり、Advanced Adsというアプリを導入してみた。
スライド表示はカッコ良くていいのだが、ランダムな表示ができない。
かと言って、通常のランダム表示では、広告ごとの表示確率が低すぎて広告主に申し訳ない。
なので3枚並べて表示するようにしたが、そのままでは見た目が良くない。
そこで、例によってAIに相談してCSSを生成してもらい、思い通りの見た目を得られた。
ChromeとEdgeで表示が異なる、など、予想外の状況が起きて苦労した。

※この件に関する詳細は、後日独立した記事にする予定。
決定版ができたので、そちらで記事にする。

2026年3月10日

カテゴリーリストとアーカイブリストを改良

JS Categories List Widget
A simple Gutenberg block and JS widget (can be called from posts) for displaying categories in a list with some effects.
JS Archive List
A JS widget (can be used in posts) for displaying an archive list with some effects.

記事を探す際の利便性を高める目的でサイドバーにカテゴリーリストとアーカイブリストを表示してみたが、どうにも見映えや使い勝手が悪い。プラグインも導入してみたが、見た目が気に入らない。
なので、なんとかカスタマイズできないか悪戦苦闘しているうちに、「AIに相談する」という選択肢を思いついた。
早速AIに相談してみたところ、多少の紆余曲折はあったものの目的を達成。
どんな見た目になっているかは、実際にサイドバーでそれぞれのリストを見て欲しい。

※この件に関する詳細は、後日独立した記事にする予定。
プラグインを使わない形で解決してしまったので、そちらの記事にまとめる。

記事の公開日や更新日を文中に埋め込めるコードを追加

アフィリエイト記事を書くに当たってプライバシーポリシーページなどを作成したが、「このページの内容は○月○日のものです」ということをわかりやすく示しておきたい、と考えた。
ページ上部にも公開日や更新日は表示されるが、文字が小さいし、どちらが更新日なのかぱっと目で分かりづらい。
なので、記事の中に公開日や更新日を埋め込む方法はないかな、と探してみたところ、以下のページに行き当たった。

”本日の記事投稿時点”のテキストに更新日を追加表示させるやり方 | ブロックエディター活用術【SWELLベース】
インラインテキストで記事更新日を自動表示させるやり方をご紹介します。

内容はまさしく自分が求めていたものそのもの。
早速ページに書いてあるとおりにしてみたところ、思ったとおりの動作をしてくれた。
今となっては当初導入予定だったプライバシーポリシーページ以外にも、あちこちで活躍してくれている。

2026年3月1日

アフィリエイト記事を書いてみた

新しいブログに移ったし、せっかくなのでアフィリエイト記事を書いてみた。
ただ、WordPress標準のリンク機能ではいまいち使い勝手が悪い。なので、何かいいものはないかと探してみたところ、Pochippというプラグインを見つけた。

ポチップ | 商品のアフィリエイトリンクを手軽に管理!ブロックエディター対応の最新WordPressプラグイン
商品のアフィリエイトリンクを手軽に管理!ブロックエディター対応の最新WordPressプラグイン

Amazon、楽天市場、Yahoo!ショッピングなど、主要なeコマースサイトに対応しており、それぞれへのボタンを簡単に作成できる。何より犬の足跡?のアイコンが可愛くて気に入った(犬好きなので)。
今後もアフィリエイト記事を書いていこうと思うが、その際にこのプラグインは大きな助けになりそうだ。

2026年2月7日

WordPress始動

はてなブログから移転したWordPressがついに動き出した。
初期設定でいろいろ躓いたが、とりあえず動くようになって良かった。

3月7日追記。この時の顛末を記事にまとめました。
WordPressの初期設定で、初心者の自分が七転八倒・四苦八苦しつつもなんとか乗り越えた、その顛末記です。

コメント

タイトルとURLをコピーしました