WordPressカスタマイズ完全ガイド｜80の実例まとめ– WORDPRESS CUSTOMIZE –

WordPress本体のカスタマイズを、やりたいこと別に80記事まとめました。テーマに依存しない汎用的な内容が中心です。

コードを書く前に、そのカスタマイズがどこに書くべきものかを決めておくと後が楽になります。見た目だけなら追加CSS、機能追加ならfunctions.phpかコードスニペット、繰り返し使うならプラグイン化、という順で検討してください。

上から順に読む必要はありません。目次から目的の章に飛んでください。

ブロックエディターの拡張

標準のブロックだけでは足りない場面は多いですが、CSSと少しのJSでかなりのことができます。プラグインを増やす前に、まずこの章の方法で足りないか確認してみてください。

スクロールに合わせてブロックをふわっと表示させます。CSSとJSだけで実装でき、プラグインは不要です。

ギャラリーブロックの画像サイズがバラバラになる問題を、CSSで揃えます。

ギャラリーブロックをカルーセル付スライダー表示にする方法。Swiper。

アコーディオンで長い説明文を折りたたむ方法。

リストをアコーディオン表示する方法。

クラシックエディタでも使えるカラムを作成する方法。

カラムブロックのブレイクポイントを変更する方法。

CSSを使ってカラムブロックの表示を並び替えをする方法。

パララックス（視差効果）の作り方。

エフェクト用の画像2枚だけでループアニメーションを作成する方法。

タップすると画像が変化するカスタマイズ。

1行だけ全幅で背景色を変更する方法。

再利用ブロックをショートコードで利用する方法。

メディアクエリを使わずにレスポンシブレイアウトにする方法。

サムネイル付きスライダーを作成する方法。Swiper.js。

ボタンを押すとモーダルで内容を表示します。ページ遷移させずに補足情報を出せます。

シンプルなドロップダウン（プルダウン）メニューの作り方。

マトリックス図からのリンクの作り方。

テーブル内の数字を計算して合計を表示する方法。

カスタムフィールド・カスタム投稿

記事に独自の情報を持たせたいときはカスタムフィールドを使います。ACFとSCFのどちらを選ぶか、移行が必要かは記事内で解説しています。

Smart Custom FieldsからACFへ、既存データを保ったまま移行する手順です。

カスタムフィールドの値をcsvファイルからまとめて編集する方法。

管理画面にカスタムフィールドの一覧･編集機能を作成する方法。

カスタムフィールド値を自動保存するカスタマイズ。

参照した記事にショートコードでカスタムフィールドの値を割り当てる方法。

投稿記事を階層化する方法。

管理画面でカスタムタクソノミーの絞り込み表示機能を追加する。

カテゴリーやタグをCSVから一括登録します。数十件を手作業で登録する必要がなくなります。

カスタムタクソノミーの名前（スラッグ）を変更する方法。SQLの文字置換。

有料記事・会員制・決済

記事の一部を有料化する方法はいくつかあります。手数料と実装の手間、そして読者の離脱率が変わるので、規模に応じて選び分けてください。

note風に記事の途中から有料にする方法です。プラグインと外部サービスの選択肢を比較しています。

Stripeを使って有料コンテンツを販売します。手数料と実装の手間はcodocと比較してください。

note風の会員制サイトをWP-Membersで作ります。

目次・ナビゲーション・回遊

回遊率は滞在時間だけでなくコンバージョンにも影響します。目次まわりは特に費用対効果が高い領域です。

目次下にウィジェットを追加するカスタマイズ。

スマホ追従目次ボタンのカスタマイズ。

目次の文字を削る方法。

ブログカードをアンカーリンクに変換するカスタマイズ。

クラシックエディタで記事の中に他の記事を参照する方法。ショートコードTIPS集。

投稿ページ（新着記事）の表示で一部のカテゴリーを除外する方法。

カテゴリーごとにグローバルメニューとフッターの内容を切り替えます。1サイト内で複数の顔を持たせたいときに。

pre_get_posts フィルタで記事一覧表示を変更する方法。

フォーム・コメント・問い合わせ

問い合わせ導線は数を増やすより、1つを確実に届くようにするほうが効果があります。

フォームから記事投稿する。Contact Form 7。

コメント欄の見た目と挙動を実務向けに調整します。

埋め込み不要！Googleフォームをカスタマイズして見た目を良くする方法。

URLパラメータをお問い合わせフォームに反映する方法。

reCAPTCHAのロゴ画像を公式のやり方で非表示にするカスタマイズ。

コードだけでSMTPを設定する方法。PHPMailer。

人気記事・関連記事・外部連携

人気記事の計測はサーバー負荷とのトレードオフです。GA4のデータを使う方法なら負荷をかけずに実装できます。

GA4のデータを使って人気記事を出します。DBに集計テーブルを持たないのでサーバー負荷がかかりません。

情報をRSS化して別サイトでも動的に参照する方法。

他サイトの新着記事を取得するカスタマイズ。

WP REST APIとGASを使った投稿・更新方法。

GitHub Actionsで集めたデータを参照&表示する方法。

多言語サイトのhreflangタグを動的に出力する方法。

管理画面のカスタマイズ

管理画面は自分と編集者しか見ませんが、運用の効率に直結します。地味ですが積み重なると効きます。

管理画面にメモを表示するカスタマイズ。

WordPressの管理バー（ツールバー）を下に表示するカスタマイズ。

管理バー（ツールバー）にブックマークを作成する。

エディタにページIDのクラスを動的に追加するスクリプト。

編集記事下にCSSとJSの入力欄を追加する方法。

style.cssを管理画面のエディタに反映させ、Ctrl+Sで保存できるようにします。バックアップも取れます。

固定記事で使われているテンプレートを洗い出す方法。

本文で使われているショートコードを洗い出す方法。

複数の著者（ユーザー）を記事一覧に登録する方法。

サイト運用・移行・マルチサイト

サイトの引っ越しやマルチサイト化は、失敗すると復旧に時間がかかります。作業前に必ずバックアップを取ってください。

外部ストレージへのバックアップとサイト移転の手順です。作業前に必ず読んでください。

2つのサイトのデータベースを結合する方法。

サブドメイン型マルチサイトの構築手順です。1つのWordPressで複数サイトを運用できます。

画像だけ元サイトから参照する方法。All-in-One WP Migration。

コマンドでローカルとリモートのデータを同期する方法。

公開中の記事を止めずに、裏でリライトして差し替えます。

本体やテーマの自動更新と、そのたびに届く通知メールを止めます。案件サイトで意図しない更新を防ぎたいときに。

更新に失敗して管理画面に入れなくなったとき、FTPから本体を入れ替えて復旧します。

表示まわりのその他カスタマイズ

スプレッドシートの指定範囲だけをiframeで埋め込みます。表の更新がそのままサイトに反映されます。

好きなWebフォントを使用する方法。

記事の終わりにバナーを表示するカスタマイズ。

フッターに固定バナーを表示する。

ショートコードを条件分岐する方法。

Amazonライクなレビューサイトの星の表記カスタマイズ。

本文に特定のURLがある場合に文言を表示するカスタマイズ。PR表記。

自作の絞り込み検索の作成方法。

REST APIで自前のプラグイン更新サーバーを作る仕組み。

Arkheテーマのアクション・フィルターフック119個の一覧です。

WooCommerceのカスタマイズまとめ。

Redirectionを使ったリダイレクト設定まとめ。