タグアーカイブ プラグイン開発

WordPress 7.1正式版が8月19日リリース。レスポンシブスタイルと疑似状態の全容

WordPress 7.1正式版が8月19日リリース。レスポンシブスタイルと疑似状態の全容

WordPress 7.1の正式版が2026年8月19日にリリースされる。WordCamp US最終日と重なるタイミングで、すでにRC1とRC2が公開され、機能セットは確定済みだ。先月にはセキュリティリリース2件も出ており、影響を受けるサイトは自動更新が強制された。

今回のアップデートで注目が大きいのは、レスポンシブブロックスタイルと疑似状態スタイルのコア導入だ。テーマ開発者はモバイルとタブレットの表示をtheme.jsonだけで制御できるようになる。プラグイン開発者もリストテーブルの構造変更に注意が必要だ。正式版まで残り数日、互換性確認のポイントを解説する。

WordPress 7.1は8月19日リリース、RC2まで公開済み

WordPress 7.1は8月19日リリース、RC2まで公開済み

正式版はWordCamp US最終日に到着

WordPress 7.1は8月19日にリリース予定だ。ちょうど8月16日から19日にかけて米国フェニックスで開催されるWordCamp USの最終日と重なる。年次フラッグシップイベントの最終日に正式版が出るのは珍しいスケジュールで、現地参加者はその瞬間をライブで目撃できる。

先週までにRC1とRC2が立て続けに公開された。RC(Release Candidate / リリース候補版)とは、正式版の一歩手前の段階だ。ここまで来ると新機能の追加は終了し、バグ修正だけが行われる。Field Guideも公開済みで、全機能の開発者向け詳細がまとまっている。

セキュリティリリース2件、強制自動更新も発動

先月はセキュリティリリースが2件公開された。7月17日に出たWordPress 7.0.2は、重大な脆弱性1件と高深刻度の脆弱性1件に対処したものだ。深刻度が高かったため、影響を受けるバージョンのサイトには強制自動更新が適用された。続いて8月6日には7.0.3が公開され、十数件の追加修正が入っている。

管理しているサイトが両方の自動更新を何らかの理由で逃していた場合、先にそちらの更新を済ませることが最優先になる。7.1のテストはその後でかまわない。

レスポンシブスタイルがコアに登場

レスポンシブスタイルがコアに登場
デスクトップビュー(デフォルト)
パディング幅 3rem(約48px)
theme.json のデフォルト値がそのまま適用される
タブレットビュー(@tablet)
パディング幅 2rem(約32px)
782px 以下の画面で適用される
モバイルビュー(@mobile)
パディング幅 1rem(約16px)
480px 以下の画面で適用される

上記の図は、theme.jsonでデスクトップ・タブレット・モバイルのパディングを切り替える様子を視覚化したものだ。実際には端末の画面幅に応じて、この3つの状態が自動的に切り替わる。

theme.jsonでモバイルとタブレットのスタイルを定義

春先から開発が進められていたレスポンシブスタイルが、WordPress 7.1で正式にコアに導入された。ブロックのスタイルをタブレットとモバイルのビューポートごとに定義できる。Global Styles(グローバルスタイル)ではブロックタイプ単位で、個別のブロック単位でも設定可能だ。theme.jsonでは@mobile@tabletというキーの中にネストして記述する。

ここで押さえておきたいのは、@desktopキーが存在しない点だ。ブロックのデフォルトスタイルがそのままデスクトップスタイルになる。モバイルやタブレットで上書きしなかったプロパティは、すべてのビューポートでデフォルト値が適用される。

さらにテーマ側でブレークポイントを設定できる。theme.jsonのトップレベルにsettings.viewportプロパティを追加する仕組みだ。デフォルトはモバイルが480px、タブレットが782px。値はpx、em、remの非負の長さのみ許可され、CSS関数やパーセント、単位なしの値は無視される。タブレット値がモバイル値と同じか小さい場合は、モバイルのみが使われる。

標準ブロックサポートを使っているブロックは、タイポグラフィ、カラー、背景、ボーダー、寸法、スペーシング、レイアウトが自動的に対応する。逆に独自のスタイルコントロールを持つブロックは対象外だ。自作ブロックがある場合、この線引きで対応有無を確認してほしい。

疑似状態スタイルでホバーやフォーカスを制御

ボタンの疑似状態スタイル(4状態)
通常状態 ボタン
ホバー状態 ボタン
フォーカス状態 ボタン
アクティブ状態 ボタン
通常  ホバー  フォーカス枠  アクティブ

ホバーやフォーカスは実際の操作で状態が変わるため、上記は4つの状態を並べて示したものだ。実際の編集画面では「Hover」タブを選んでスタイルを設定する。

かねてから要望の多かった疑似状態スタイルも7.1で実装された。:hover:focus:focus-visible:activeをtheme.jsonとエディタで定義できる。現時点ではButtonブロックとNavigation Linkブロックに限定されている。

さらに初期段階のカスタムステート機能も入った。現状はtheme.jsonのみで、管理画面のUIはまだない。Navigation Linkブロックが現在のメニュー項目をスタイルするために-currentプロパティを使う仕組みだ。カスタムステートは-接頭辞を使い、ブロックのblock.jsonにあるselectors.statesプロパティで宣言したクラス名をターゲットにCSSを生成する。現時点では限定的だが、今後の拡張に向けた重要な布石だ。

新しいデザインツール3点

新しいデザインツール3点

テーマ開発者が長年待っていた変更を含む、デザインツールの追加が3つある。グラデーションと背景画像を同時に使えるようになるのは特に大きい。

背景グラデーションと背景画像を併用可能に

新しいbackground.gradientは既存のcolor.gradientとは別のサポートとして追加された。違いはCSSの出力先にある。従来のサポートはbackgroundショートハンドを通じて描画されるため、background-imageを含むすべてのbackground関連プロパティをリセットしてしまっていた。ブロックにグラデーションか画像のどちらか一方しか使えなかった理由だ。

新しいサポートはbackground-imageロングハンドで描画される。スタイルエンジンが1つの宣言内にグラデーションと画像をカンマ区切りで出力できるようになった。7.1ではGroup、Accordion、Pullquote、Post Content、Quoteがコアで対応する。値はstyle.background.gradientに保存される。

最小幅とテキストシャドウ

dimensions.minWidthは既存のminHeightと同じパターンで、CSSのmin-widthとして適用される。テーマがdimensionSizesプリセットを提供していれば、それを活用できる。1点注意があり、この設定はデフォルトではブロックインスペクターに表示されない。ブロック側で__experimentalDefaultControlsを通じてopt-inした場合のみ表示される。Global Stylesではデフォルトで表示される。

テキストシャドウもGlobal Stylesでサポートされた。これまでは個別ブロックやCSSでしか指定できなかったが、theme.jsonからサイト全体またはブロックタイプ単位で制御できる。

SVG Icon APIが正式公開

アイコン名の衝突を防ぐ名前空間の仕組み
名前空間なしの場合(衝突する)
core / star my-plugin / star 同じ名前で衝突
名前空間を付けた場合(安全)
core/star my-plugin/star それぞれ別のアイコンとして識別

アイコン名の衝突を防ぐため、コレクション名が名前空間の接頭辞になる。プラグイン独自のアイコンを登録しても、コアのアイコンと混同される心配がない。

WordPress 7.0でエディタとIconブロック向けにSVGアイコンのセットが同梱された。7.1ではこれが正式な公開APIになり、プラグインやテーマから登録できるようになった。wp_register_icon_collection()でコレクションを登録し、wp_register_icon()でアイコンを追加する。PHPの任意の場所でwp_get_icon()を使えば、サイズやクラス、ラベルを指定してアイコンを表示できる。

計画時に意識したい制限が2つある。登録したSVGはwp_ksesによって保守的な許可リストでサニタイズされる。許可されるのは<svg><path><polygon>のみ。許可リストの拡大作業は進行中だ。fillは図形部分にのみ許可され、外側の<svg>には付けられない。またwp_get_icon()単体で呼び出すとSVG自身のfill(黒)で描画される。周囲のテキスト色に合わせたい場合は、渡したクラスに対して自前でCSSを指定するのが推奨される。

エディタのiframe化とプラグインへの影響

エディタのiframe化とプラグインへの影響

投稿エディタは常時iframe表示へ

テンプレートエディタがiframe化されたのはWordPress 5.8からだ。それ以来、投稿エディタも段階的に移行してきたが、7.1で最終段階に入った。テーマの種類や登録ブロックのAPIバージョン、コンテンツ内のブロックのAPIバージョンに関係なく、投稿エディタは常にiframeで表示される。レガシーメタボックスを登録しているサイトも同様だ。

7.0では投稿ごとに挿入されたブロックに基づいて判断されていた。つまりコンテンツによってiframedモードと非iframedモードが切り替わり得た。この条件付き動作がなくなり、挙動が単純化された。

大半のブロックは変更なしで動作する。問題が起きる場合、ほとんどは1つの根本原因にたどり着く。iframeは管理者ページとは別のdocumentとwindowを持つ。エディタスクリプトが実行される管理者ページからグローバルのdocumentやwindowにアクセスしてキャンバスを操作しようとすると、間違ったドキュメントを見ていることになる。対処としては、キャンバス内の要素からownerDocumentdefaultViewでドキュメントを取得するか、useRefEffectでキャンバス要素にリスナーをアタッチ・クリーンアップするのが一般的だ。

リストテーブルの行ヘッダーが移動

カスタムCSSやJavaScriptを書いているプラグインにとって、静かに何かを壊す可能性が高いのがリストテーブルの変更だ。投稿一覧テーブルで、プライマリのth scope="row"がチェックボックス列からタイトル列に移動した。チェックボックスセルはtdになり、タイトルセルがthとして投稿タイトルを含むaria-labelを持つ。レスポンシブ表示で折りたたまれるセルはflexレイアウトを使うようになった。

これはアクセシビリティの大きな改善だ。スクリーンリーダーは各行を、場合によっては存在しないチェックボックスではなく投稿名で認識できるようになる。ただしこのマークアップは2010年以降ほぼ安定していたため、多くの拡張が暗黙的に依存している。th.check-columnを選択するCSSやJavaScript、td内の行アクションや投稿タイトルを期待するコードがある場合は確認が必要だ。

この記事のポイント

  • WordPress 7.1は8月19日リリース予定、RC2まで公開済みで機能セットは確定
  • セキュリティリリース7.0.2と7.0.3が先月公開され、強制自動更新も適用された
  • レスポンシブスタイルがコアに入り、モバイルとタブレットのスタイルをtheme.jsonで定義可能に
  • 疑似状態スタイルでホバー、フォーカス、アクティブをテーマから制御できる
  • SVG Icon APIが公開され、プラグインが名前空間付きでアイコンを登録可能に
  • 投稿エディタは常時iframe化され、リストテーブルの行ヘッダー移動も要確認
WordPressのdo_action()を見直す イベントをオブジェクト化し、フックをクラス名にする最新の開発パターン

WordPressのdo_action()を見直す イベントをオブジェクト化し、フックをクラス名にする最新の開発パターン

WordPressの開発でdo_action()を一度も使ったことがない人はまずいないだろう。カスタムフックを定義して他のプラグインやテーマから振る舞いを拡張する手法は、バージョン1.2で導入されて以来変わらず愛用されている。

しかし長年の使い込みの中で、いくつかの「小さな摩擦」が無視されてきたのも事実だ。引数の順序を覚えきれない、フック名が大域空間で衝突する、戻り値の返し忘れでフィルターが壊れる、といった問題は大規模なコードベースになるほど開発者の時間を食う。

この記事では、do_action()に1つのオブジェクトを渡し、そのクラス名をフック名として使うことで、これらの問題を一掃するパターンを解説する。独自のライブラリもフレームワークも不要で、PHPの標準機能だけで実装できる。2026年8月にDeveloper WordPress Newsで公開された洞察をもとに、実装例と仕組みを詳しく見ていこう。

do_action()で起きていた4つの摩擦

do_action()で起きていた4つの摩擦

従来のdo_action()は「フック名」と「任意の数の引数」を受け取るシンプルなAPIだ。会員登録をトリガーとするプラグインであれば、次のようにフックを発火させるのが一般的な書き方になる。

do_action( 'myplugin_member_registered', $userId, $plan );

これを受け取る側のコードは以下のようになる。

add_action( 'myplugin_member_registered', static function ( $userId, $plan ) {
    // ... 何らかの処理
}, 10, 2 );

動作自体に問題はない。だが、よく見ると運用上のストレスがいくつも潜んでいる。Developer WordPress Newsの記事が指摘する摩擦点は大きく次の4つだ。

  • 引数が位置に依存する $userId$planの順序を覚えておかなければならず、間違えた場合のエラーは追跡しにくい。
  • フック名がグローバルな名前空間 'myplugin_member_registered'という文字列が他のプラグインと衝突しないよう、prefixをつけて管理する必要がある。
  • 型情報が一切ない $planは文字列かもしれないしIDかもしれない。コードエディタの補完も静的解析も効かず、ドキュメントを読まなければ正体がわからない。
  • フィルターの戻り値忘れ apply_filters()を使うと、どのリスナーも必ず値を返さなければならない。うっかりreturnを書き忘れると、後続のフィルターがすべて破綻する。

これらはフックの仕組みそのものの問題ではなく、ペイロード(運ぶデータ)の渡し方に起因する。そして、このペイロード設計を見直すだけで、すべてがきれいに解決する。

従来のフック呼び出し(Before)
do_action( ‘myplugin_member_registered’, $userId, $plan );
※フック名は文字列でグローバルスコープ、引数は位置で決まるため順序を覚えておかなければならない
オブジェクトを使った新しいパターン(After)
do_action( MemberRegistered::class, $event );
※完全修飾クラス名がフック名になり、オブジェクト1つですべての情報を運ぶ。型が自動的に決まる

上の比較でわかるとおり、do_action()に渡す情報をオブジェクトにまとめるだけで多くの摩擦が消える。フック名の衝突リスクがなくなり、コードエディタの補完も効く。

イベントオブジェクトとクラス名フック 1行で変わる設計

イベントオブジェクトとクラス名フック 1行で変わる設計

解決策の核心は驚くほど単純だ。Developer WordPress Newsの記事の著者が試みたのは、「引数をバラバラに渡すのではなく、起こった出来事を表すオブジェクトを1つだけ渡す」というやり方である。

具体的には、次のように書く。

do_action( $event::class, $event );

$event::classが何が起きたかを示すフック名になり、$eventがその詳細を運ぶ。フック名にはそのクラスの完全修飾名が使われるため、名前空間が自動的に適用され、他のプラグインと衝突することはまずない。

フック名を::classで決めるか、あるいは固定の文字列にするかは選択できる。クラス名を使えば、IDEでクラスをリネームするとフックも追従する。文字列(例:'myplugin/member-registered')を指定すれば、後からクラスを移動させてもフック名は変わらない。移行の危険を減らしたいなら固定文字列のほうが安全だが、どちらにせよペイロードは整ったオブジェクトになる。

また、このテクニックはapply_filters()を使わなくてもフィルター的な振る舞いを実現できる。オブジェクトのプロパティを書き換え可能にしておけば、リスナーが自由に値を変更し、ディスパッチャ側が後から読み取れるからだ。戻り値の管理に頭を悩ませる必要がなくなる。

具体例 会員登録のDispatcherとListener

具体例 会員登録のDispatcherとListener

ここでは会員登録を題材に、イベントオブジェクトを使ったフックの流れを具体的に見ていこう。名前空間MyPlugin\Membersの下に、登録イベントを表すクラスと、それを発行するクラス、そして受け取る側のコードを用意する。

イベントクラスの定義

namespace MyPlugin\Members;

final class MemberRegistered
{
    public function __construct(
        public readonly int    $userId,
        public readonly string $plan,
        public          bool   $sendWelcomeEmail = true,
    ) {}
}

$userId$planreadonlyとして宣言され、リスナーは読み取り専用で使用する。一方、$sendWelcomeEmailは書き換え可能にしておき、ウェルカムメールを送るかどうかの判断をリスナーに委ねる。

Dispatcher(発行側)

namespace MyPlugin\Members;

final class MemberRegistrar
{
    public function register( int $userId, string $plan ): void
    {
        // アカウント作成処理...

        $event = new MemberRegistered( userId: $userId, plan: $plan );

        do_action( $event::class, $event );

        if ( $event->sendWelcomeEmail ) {
            // ウェルカムメールをキューに追加
        }
    }
}

ポイントは、do_action()の後で$event->sendWelcomeEmailを評価しているところだ。この値は後続のリスナーが変更したかもしれない。オブジェクトは参照で渡されるため、ディスパッチャはリスナーによる変更をそのまま拾える。ここにapply_filters()は必要ない。

ObserverとMutatorの2パターン

受け側はおおまかに2種類に分かれる。1つはイベントを観測するだけのObserverで、値を読み取るが変更はしない。もう1つはプロパティを書き換えるMutatorだ。

// Observer ログ出力のみ
add_action( MemberRegistered::class, static function ( MemberRegistered $event ): void {
    error_log( sprintf(
        'Member #%d registered on the %s plan.',
        $event->userId,
        $event->plan
    ) );
} );

// Mutator 無料プランの場合はウェルカムメールを無効化
add_action( MemberRegistered::class, function ( MemberRegistered $event ): void {
    if ( 'free' === $event->plan ) {
        $event->sendWelcomeEmail = false;
    }
} );

Mutatorのコールバックを見ると、型ヒントによって$eventのプロパティが自動補完されることがわかる。$userId$planの順序を気にする必要はなく、add_action()の第4引数で引数の数を指定する手間もない。これがオブジェクト化の地味ながら大きな恩恵だ。

Observerの動作
イベント ログ記録
イベントオブジェクトを読むだけで、値を変更しない。
Mutatorの動作
イベント プロパティ変更 Dispatcherが後で読み取り
$sendWelcomeEmailfalseにすることで、メール送信の挙動を変更する。
イベントオブジェクト  Observer  Mutator  Dispatcherの後工程

このように、1つのオブジェクトを受け渡すだけで、従来のアクションとフィルターの両方の役割を統一的に扱える。コードの見通しは飛躍的に良くなるはずだ。

オブジェクト化がもたらすメリットのまとめ

オブジェクト化がもたらすメリットのまとめ

これまでの例から、イベントオブジェクトパターンを採用することで得られる具体的な利点を整理する。

  • 型安全なリスナー すべてのコールバックがイベントクラスで型を宣言するため、エディタの補完と静的解析がフルに働く。
  • 名前衝突からの解放 フック名は完全修飾クラス名(または明示的な文字列)で管理されるため、prefixを手動で付ける必要がなくなる。
  • フィルターのような書き換えをアクションで実現 オブジェクトのプロパティをミュータブルにしておけば、apply_filters()を使わずとも値の変更が可能。戻り値の返し忘れによるバグも消える。
  • 自己文書化 各イベントクラスが独立したファイルになるため、どの拡張ポイントが存在するかがディレクトリを見るだけで把握できる。

これらの改善は、特別なライブラリを導入しなくても、今日から自社のプラグインに適用できる。既存のdo_action()add_action()をそのまま使いつつ、ペイロードをオブジェクトに切り替えるだけだ。

WordPressのルーツとPSR-14の関係

WordPressのルーツとPSR-14の関係

このパターンを「新しいアイデア」と感じるかもしれないが、実はWordPressが2004年のバージョン1.2で搭載したプラグインAPIの時点で、根幹の設計は既に存在していた。

PHPの世界でPSR-14(Event Dispatcher)として標準化された「イベント、リスナー、ディスパッチャ」の概念は、do_action()add_action()の組み合わせでほぼ表現できる。つまり、WordPressはとっくにイベント駆動の基盤を持っていたことになる。

PSR-14が定める厳密な契約(伝播制御、リスナープロバイダー、ディスパッチャの交換など)はWordPressには組み込まれていない。だが、「イベントをオブジェクトで表現し、そのクラス名でフックする」という発想は、PSR-14のイベントモデルと驚くほど調和する。結果として、WordPressのネイティブな関数の上に、よりモダンで安全なイベント設計を載せられるわけだ。

Developer WordPress Newsの記事の著者も、PSR-14を完全実装する試みの中で、大半の価値がこの小さな習慣に詰まっていることに気づいたと述べている。段階的な移行が可能で、いきなり大掛かりなフレームワークに乗り換える必要はない。

このパターンの限界と発展の方向性

このパターンの限界と発展の方向性

ここまでのテクニックで、自作プラグインのカスタムフックの多くは十分に改善できる。ただし、次のような高度な要件に直面したときは、より本格的なイベントシステムの導入を検討してもいい。

  • 伝播の停止 あるリスナーが「以降のリスナーは実行するな」と指示する仕組み。これはremove_action()と優先度では再現しきれない場面がある。
  • 複雑なリスナー管理 数十個のリスナーを手作業で登録するのではなく、1つのサブスクライバークラスにまとめて登録したいケース。
  • テストのための差し替え ディスパッチャ自体を丸ごと入れ替えて、イベントの発生をテストダブルで差し替えたい状況。

これらの必要性を感じ始めた時が、PSR-14準拠のディスパッチャを導入する潮時といえる。しかし、そこに至るまでは、do_action()にオブジェクトを渡す」習慣だけで、保守性も開発体験も大きく前進させられる

今日からすぐに実践できる小さな設計変更が、コードベースの品質を長期にわたって支える土台になる。次のカスタムフックを書くときに、このパターンをぜひ試してみてほしい。

この記事のポイント

  • do_action()にバラバラの引数ではなく1つのイベントオブジェクトを渡すと、引数の順序問題や型の不明瞭さが解消される。
  • フック名にクラスの完全修飾名を使うことで、名前空間が自然に確保され、衝突リスクが劇的に下がる。
  • オブジェクトの書き換え可能プロパティを利用すれば、apply_filters()を使わずにフィルター的な挙動を安全に実装できる。
  • オブザーバーとミューテーターの2種類のリスナーを型安全に記述でき、コードエディタの補完がフルに働く。
  • PSR-14のような本格的なイベントシステムを導入しなくても、小さな習慣を変えるだけで開発体験が大幅に改善する。
WordPress 7.0でAIプラグインを作る!Abilities APIとAI Client連携の実際

WordPress 7.0でAIプラグインを作る!Abilities APIとAI Client連携の実際

WordPress 7.0から導入された3つのAI関連コンポーネント、Abilities API、AI Client、そしてMCP Adapterがプラグイン開発の風景を大きく変えようとしている。これらを組み合わせると、AIが画像を解析し、自動で記事を生成するプラグインを驚くほど少ないコードで実装できる。

本記事では、実際に「Photo to Post」というプラグインの構築を通して、各APIの役割と連携方法を具体的に解説する。WordPressの管理画面から画像URLを入力するだけで、AIがビジョンで内容を理解し、下書き投稿を自動生成する流れを追いながら、新しい開発スタイルの全体像をつかんでほしい。

情報源はWordPress Developer Blogのチュートリアル「Build your first AI-Powered WordPress plugin」(2026年7月30日公開)だ。ここで示されるコードと設計思想は、今後のWordPressエコシステムにおけるAI統合の方向性を色濃く反映している。

新しいAI開発基盤の3要素

新しいAI開発基盤の3要素

WordPress 6.9以降で整備されたAbilities API、7.0で正式に取り込まれたAI Client、そしてMCP Adapterは、それぞれ独立して使えるが、組み合わせることで真価を発揮する。まずはこの3つの役割を押さえておく。

Abilities API

Abilities APIは、プラグインが提供する機能を「能力」として登録し、REST APIやAIエージェントなどが統一された方法で発見・実行できる仕組みだ。入力スキーマ、出力スキーマ、パーミッションコールバック、そして実処理を行うコールバックを定義する。これにより、従来のようにエンドポイントを個別に実装する手間が省け、一度登録した能力が管理画面・REST・MCP経由でそのまま利用可能になる。

WordPress AI Client

AI Clientは、プロバイダー(OpenAI、Anthropic、Googleなど)に依存しないPHPライブラリだ。プラグインコードはwp_ai_client_prompt()というフルーエントなビルダーでプロンプトを組み立て、テキスト生成やファイル送信を依頼するだけでよい。プロバイダーの切り替えは管理画面のConnectors API(後述)でAPIキーを設定するだけで済み、コードを一切変更する必要がない。

MCP Adapter

MCP(Model Context Protocol)は、AIエージェント(デスクトップアプリやVS Code拡張など)が外部ツールを呼び出すための標準プロトコルだ。MCP Adapterプラグインをサイトにインストールすると、登録したAbilityがMCPツールとして自動公開される。ClaudeやChatGPTなどのAIクライアントにWordPressの機能を認識させ、「この画像から投稿を作成して」と自然言語で指示するだけで、プラグインの能力が裏側で呼び出される。

REST経由
能力 describe-image
curlでエンドポイントを叩けばJSON応答が返る
管理画面経由
能力 create-post-from-photo
DataFormで生成されたフォームから実行
MCP経由(AIエージェント)
能力 create-post-from-photo
Claudeなどがツールとして呼び出す
REST  管理画面  MCP
同じ能力が3つの入口からシームレスに使える

上の図はAbilities APIの最大のメリットを示している。一度登録すれば、UI、REST、AIエージェントのどこからでも同一の能力を実行できる。エンドポイントごとに別の処理を書く必要はない。

プラグイン「Photo to Post」の仕組み

プラグイン「Photo to Post」の仕組み

チュートリアルで構築する「Photo to Post」は、画像URLを入力するとAIが画像の内容を解析し、その説明文をもとにブログ投稿用のタイトルと本文を生成、さらにその画像をアイキャッチに設定した下書き投稿を作成するプラグインだ。

内部では、3つのAbilityが連携している。ここで重要なのは、最後の能力が他の能力を呼び出す「能力の合成(composition)」を実践している点だ。

STEP 1 画像URLを入力、describe-imageが画像を解析し説明文を生成(AI Vision)
STEP 2 説明文を元にgenerate-post-from-descriptionが投稿内容をAIで生成(テキスト生成)
STEP 3 create-post-from-photoが上記2つを内部で呼び出し、投稿を作成してアイキャッチを設定

この合成パターンは、WordPressのフィルターフックやアクションフックで築かれた「小さな機能を組み合わせて大きな機能を作る」という哲学のAI時代バージョンといえる。

実装の流れを追う

実装の流れを追う

ここからはチュートリアルの主要な実装ステップを、要点を絞って解説する。すべてのコードはスタータープラグインをベースにしており、TODOコメントを置き換える形で進められる。AIプロバイダーとしてはOpenAI、Anthropic、Google Geminiなどが利用可能だ。

AIプロバイダーとの接続

WordPress 7.0では、設定メニューに「コネクター」画面が追加された。Connectors APIによって、各プラグインはAPIキーの保存場所を一元管理できる。従来はプラグインごとに設定ページでキーを管理する必要があったが、これで1箇所に集約される。

OpenAI、Anthropic、Googleの公式プロバイダープラグインをインストールし、コネクター画面でAPIキーを登録すれば、あとはAI Clientが自動的にそのプロバイダーを使う。ビジョンモデルを使う場合は、Anthropicのように画像をBase64で送る必要があるが、AI Clientが吸収するためコード上の差異はほとんど生じない。

能力の登録

Abilities APIにおける能力の登録は、wp_register_ability()関数にラベル、説明、入出力スキーマ、パーミッション、コールバックを渡すだけだ。ここで定義したスキーマが、RESTやMCP経由で能力を呼び出す際の「説明書」になる。

チュートリアルでは、describe-image(画像URL → テキスト説明)、generate-post-from-description(説明文 → 投稿タイトルと本文)、create-post-from-photo(画像URL → 下書き投稿)の3つを登録する。

従来のプラグイン開発(Before)
RESTエンドポイントをregister_rest_routeで個別定義
フロントJSでfetchを手書き
MCP対応は別途SDKが必要
Abilitiesベースの開発(After)
能力を1回登録するだけでRESTも管理画面もMCPも自動対応
入出力スキーマが自己文書化
能力どうしの合成で複雑な処理もシンプルに

能力を登録したら、wp_abilities_api_initアクションにフックし、RESTで表示するためにメタ情報にshow_in_rest => trueを指定する。これだけでアプリケーションパスワードを使ったcurlで能力の一覧を取得できる。

AI Clientによる画像解析とテキスト生成

最初の能力describe-imageのコールバックでは、wp_ai_client_prompt()でプロンプトを構築し、with_text()with_file()で画像のデータURIを渡してgenerate_text()を呼ぶ。戻り値はWP_Errorの可能性があるため、必ずチェックする。

画像はwp_remote_get()で取得しBase64エンコードしたデータURIにして送る。これにより、URLでの画像指定を受け付けないプロバイダーでも動作する。

2つ目の能力generate-post-from-descriptionでは、AIに「画像説明文から魅力的なブログ投稿を生成し、JSONで返す」よう指示する。プロンプトには「markdownコードフェンスで囲まない」と明示するが、AIは非決定論的なため、念のためpreg_replace()でフェンスを除外し、JSON文字列の中からオブジェクトを抽出する防御的なパース処理を入れている。

能力の合成

3つ目の能力create-post-from-photoがこのプラグインの心臓部だ。ここでwp_get_ability()を使って自分自身以外の能力を取得し、execute()で実行する。最初にdescribe-imageを実行して画像説明を取得し、次にその説明を使ってgenerate-post-from-descriptionを実行、最後に得られたタイトルと本文からwp_insert_post()で下書きを作成する。

このように、能力を「LEGOブロック」のように組み合わせられることがAbilities APIの真骨頂だ。各能力は単独でテスト可能であり、後から新しい能力を追加して組み合わせることも容易である。

管理画面の拡張

スタータープラグインに付属するDataFormベースの設定画面を、実際の能力と連携させる。JavaScript側からは@wordpress/abilitiesパッケージのgetAbility()executeAbility()を使い、先ほどPHPで登録したcreate-post-from-photo能力を呼び出す。

スクリプトをモジュールとして読み込み、readyプロミスでAPIが利用可能になるのを待ってから実行する。これで管理画面から画像URLを入力し「投稿を生成」ボタンを押すだけで、一連のAI処理が走り、下書きが作成される。成功すると編集画面へのリンクが表示される。

MCP対応でAIエージェントにも開放

能力の登録時にメタに'mcp' => array( 'public' => true )を追加し、MCP Adapterプラグインを有効化するだけで、その能力がMCPサーバー経由で外部AIエージェントに公開される。

例えばClaudeデスクトップアプリの設定ファイルにWordPressサイトのURLとアプリケーションパスワードを記述すれば、「この写真から投稿を作成して」と話しかけるだけで、create-post-from-photoが自動的に呼ばれる。REST、管理画面、MCPという3つの入口を同じコードで実現できるのは、Abilities APIの設計の妙だ。

実装から見える将来性

実装から見える将来性

WordPressのコアに組み込まれたこれらAIビルディングブロックは、単なる補助機能ではない。プラグイン開発のパラダイムを「単一の機能提供」から「再利用可能な能力の提供と合成」へとシフトさせる可能性を秘めている。

従来のプラグイン開発
個別のREST実装
フロントとバックエンドの密結合
MCP対応は別途開発
Abilities API+AI Clientの世界
能力を登録すればREST・管理画面・MCPが即座に利用可能
AIプロバイダー非依存の設計
能力の合成で複雑な自動化も容易
従来  これから

さらに、Connectors APIによるAPIキーの一元管理は、複数プラグイン間の設定のばらつきを解消し、サイト管理者の負担を大きく下げる。開発者は「どのAIモデルを使うか」を気にせず、ビジネスロジックに集中できる環境が整いつつある。

注意点として、AI呼び出しには時間がかかるため、デフォルトのHTTPタイムアウトでは処理が中断される可能性がある。チュートリアルではwp_ai_client_default_request_timeoutフィルタでタイムアウトを120秒に延長する対処が示されている。このような実運用の勘所も押さえておきたい。

プラグイン開発者がこうした基盤を活用し始めれば、WordPressエコシステム全体のAIリテラシーが一気に加速する。非エンジニアでも「写真から投稿を作って」と指示するだけでコンテンツ制作が進む未来は、すぐそこまできている。

この記事のポイント

  • WordPress 7.0のAbilities API・AI Client・MCP Adapterにより、AI搭載プラグインを少ないコードで構築できる
  • 能力を1回登録すればREST・管理画面・AIエージェントの3経路で同一機能を提供可能
  • AI Clientはプロバイダー非依存で、Connectors APIがAPIキー管理を集約
  • 能力の合成で「LEGOブロック」のように複雑な自動化を実現
  • 実運用ではタイムアウト延長フィルタなど、実装上の注意点も必要
WordPress開発が劇的に速くなる?次世代ビルドツール「@wordpress/build」の全貌

WordPress開発が劇的に速くなる?次世代ビルドツール「@wordpress/build」の全貌

WordPressのプラグイン開発において、ビルドツールのあり方が大きく変わろうとしている。現在広く使われている @wordpress/scripts の内部エンジンが、より高速でシンプルな @wordpress/build へと移行する計画が進んでいる。この変更は、単なる速度向上にとどまらず、開発者がコードを書く際の手順そのものを効率化するものだ。

2025年10月にプロジェクトが始動し、すでにGutenberg(ブロックエディタ)本体の100以上のパッケージビルドに採用されている。 esbuild(エスビルド)という非常に高速なエンジンを基盤に据えることで、これまでのwebpack(ウェブパック)ベースの環境では数分かかっていた処理が、わずか数秒で完了するようになる。開発の待ち時間がなくなることは、制作現場の生産性に直結する重要な変化だ。

なぜ今、使い慣れたツールを刷新する必要があるのか。それは、WordPress開発における「設定の複雑さ」を解消し、より直感的にコードを書ける環境を整えるためだ。新しいツールが目指すビジョンと、具体的な仕組み、そして今後の開発者がどのように対応すべきかを詳しく解説していく。

WordPressプラグイン開発の新たなスタンダード「@wordpress/build」とは

WordPressプラグイン開発の新たなスタンダード「@wordpress/build」とは

@wordpress/build は、WordPressコアチームが開発を進めている次世代のビルドツールだ。ビルドツールとは、JavaScriptやCSSなどのソースコードを、ブラウザが読み込める形式にまとめたり、最新の書き方を古いブラウザでも動くように変換したりする道具を指す。

webpack時代の複雑さからの脱却

これまで、WordPressの標準ツールである @wordpress/scripts は、内部でwebpackとBabel(バベル)を使用してきた。これらは非常に多機能で柔軟だが、長年の運用を経て設定が複雑化しすぎている側面があった。特に、依存関係の抽出やPHPファイルの生成など、WordPress特有の処理を組み合わせるために、多くのカスタム設定が必要だった。

結果として、Gutenbergプロジェクト自体が @wordpress/scripts を使わず、独自のカスタムツールでビルドを行うというねじれ現象が起きていた。 @wordpress/build は、この複雑さをツール内部に吸収し、開発者が「設定ファイル」をいじる必要をなくすことを目的としている。

esbuild採用による圧倒的なビルド速度

新しいエンジンの核となるのは esbuild だ。これはGo言語で書かれた非常に高速なバンドラー(ファイルをまとめるツール)で、従来のJavaScript製のツールとは比較にならないほどのパフォーマンスを発揮する。例えるなら、手作業で荷物を仕分けていた倉庫に、最新の高速自動仕分けロボットが導入されるようなものだ。

大規模なプロジェクトでも、フルビルドが数秒で終わる。また、ファイルの変更を監視して自動で再ビルドする「ウォッチモード」では、変更した箇所だけを瞬時に処理するため、修正が即座にブラウザへ反映される。この「待ち時間の消失」こそが、 @wordpress/build を導入する最大のメリットといえるだろう。

「設定」から「規約」へ:新しい開発ワークフロー

「設定」から「規約」へ:新しい開発ワークフロー

@wordpress/build の大きな特徴は、「設定より規約(Convention over Configuration)」という考え方を採用している点にある。これは、あらかじめ決められたルールに従ってフォルダやファイルを配置すれば、ツールが自動的に中身を判断して適切に処理してくれる仕組みだ。

フォルダ構成がそのまま設定になる仕組み

従来のように「どのファイルが入り口(エントリポイント)か」をコードで指定する必要はない。プロジェクト内に特定の名前のフォルダを作るだけで、ツールがビルド対象を自動検知する。

  • packages/:JavaScriptのパッケージを配置する場所。各サブフォルダが1つのパッケージとして扱われる。
  • routes/:管理画面のルーティング(ページ構成)を定義する場所。
  • blocks/:ブロックのソースコードを置く場所(現在提案中の機能)。

このルールに従うだけで、ツールは各フォルダ内の package.json を読み取り、必要なJavaScriptやスタイルシートを生成する。開発者は「どこに何を書くか」というルールさえ覚えれば、ビルド設定の迷宮に迷い込むことはなくなる。

package.jsonによるシンプルな管理

個別の設定が必要な場合も、webpack.config.jsのような専用ファイルは使わず、 package.json 内に記述する。例えば、あるパッケージをブラウザで読み込むスクリプトとして登録したい場合は、以下のように記述するだけで済む。

{
  "name": "@my-plugin/utility",
  "wpScript": true
}

これだけで、ツールはこのパッケージを「IIFE(即時実行関数式)」形式でビルドし、WordPressの管理画面で適切に読み込めるように準備してくれる。IIFEとは、他のプログラムと名前がぶつからないようにコードをカプセル化する手法のことだ。専門的な知識が必要だった設定が、1行のフラグ指定に集約されている。

PHP登録作業を自動化する革新的な機能

PHP登録作業を自動化する革新的な機能

WordPress開発者を悩ませる作業の1つに、JavaScriptファイルを読み込むための wp_enqueue_script() などのPHP記述がある。 @wordpress/build は、このPHP側の登録作業も自動化する道筋を示している。

手動のPHP記述が不要になるメリット

これまでは、ビルドされたファイルのパスを確認し、依存するスクリプト(wp-elementやwp-i18nなど)を手動で配列に書き出す必要があった。新しいツールでは、ビルドプロセスの一環として build/build.php というファイルが生成される。プラグインのメインファイルでこれを1行読み込むだけで、すべての登録が完了する。

require_once plugin_dir_path( __FILE__ ) . 'build/build.php';

このファイルには、スクリプト、モジュール、スタイルシートの登録処理がすべて含まれている。開発者がPHP側で「どのファイルを読み込むか」を管理する必要がなくなるため、ファイル名の変更や依存関係の追加に伴うケアレスミスを劇的に減らすことができる。

アセット管理と依存関係の自動解決

JavaScript側で import { __ } from '@wordpress/i18n'; と書けば、ツールは自動的に「このスクリプトはwp-i18nに依存している」と判断し、 .asset.php ファイルを作成する。これは従来も @wordpress/scripts で提供されていた機能だが、 @wordpress/build ではさらに強化されている。

例えば、最新の「スクリプトモジュール(ESM)」と従来のスクリプトの使い分けも、設定一つで切り替え可能だ。さらに、WordPress 6.8で導入された効率的なブロック登録機能(WP_Block_Metadata_Registry)への対応も進められており、最新のコア機能の恩恵を最小限の手間で受けられるようになる。

名前空間と外部依存関係の高度な制御

名前空間と外部依存関係の高度な制御

大規模なプラグインや、複数のプラグインが連携する環境では、「名前空間(Namespace)」の管理が重要になる。 @wordpress/build では、自分のプラグインが提供する機能を他のプラグインからどう参照させるかを、明快に定義できる仕組みが備わっている。

プラグイン間でのスクリプト共有が容易に

例えば、WooCommerceのような他のプラグインが提供するJavaScript機能を利用したい場合、 package.json に外部名前空間として定義する。これにより、コード内で import { Cart } from '@woo/cart'; と書くだけで、実行時には window.woo.cart を参照し、依存関係のリストに自動で追加される。

これは、複数のスクリプトが同じライブラリを二重に読み込んでしまう問題を回避し、サイト全体のパフォーマンス向上に寄与する。開発者は複雑なフックの順序を気にすることなく、モダンなJavaScriptの書き方でプラグイン間の連携を実装できるのだ。

今後のロードマップと開発者が今すべきこと

今後のロードマップと開発者が今すべきこと

@wordpress/build は現在も活発に開発が進んでいる段階だ。すぐにすべてのプロジェクトを移行すべきかというと、そうではない。公式のロードマップでは、段階的な統合が予定されている。

@wordpress/scriptsとの統合プロセス

将来的には、 @wordpress/scripts の中身が @wordpress/build に置き換わる予定だ。つまり、開発者は今まで通り npm run build を実行するだけで、内部的に新しい高速エンジンが動くようになる。この際、標準的な設定を使っている開発者は、コードを一切変更することなく、ビルド速度の向上という恩恵を受けられる見込みだ。

一方で、webpackの設定を細かくカスタマイズしている場合は、将来的に移行ガイドを参照しながら調整が必要になる可能性がある。コアチームは、この移行を可能な限りスムーズに進めるためのAPI設計に注力している。

早期導入のメリットと注意点

現在、複数のパッケージを持つ大規模なプラグインを開発しているエンジニアにとって、 @wordpress/build を試す価値は十分にある。モノレポ(複数のパッケージを1つのリポジトリで管理する手法)構成での開発効率が格段に上がるからだ。

ただし、ブロック登録周りなど、まだ手動での作業が必要な箇所も残っている。現時点では実験的な導入にとどめ、GitHubのGutenbergリポジトリで進行中のディスカッションに参加し、フィードバックを送るのが最も賢明な関わり方といえるだろう。特に「blocks/フォルダをルートに置く規約」についての議論は、今後のプラグイン構造の標準を決める重要なポイントだ。

独自の分析:WordPress開発体験(DX)はどう変わるか

独自の分析:WordPress開発体験(DX)はどう変わるか

今回の @wordpress/build への移行は、WordPressが「独自の進化」から「モダンなWeb標準との融合」へと、さらに一歩踏み出したことを象徴している。 esbuildのような最先端のツールを標準に取り入れることで、WordPress開発特有の「古臭さ」や「設定の煩わしさ」が解消されようとしている。

特に注目すべきは、PHPとJavaScriptの境界線がより曖昧になり、自動化が進む点だ。これまでWordPressエンジニアには、フロントエンドの知識と、それをWordPressに登録するためのPHPの知識の両方が高いレベルで求められてきた。この「登録」という非創造的な作業が自動化されることで、開発者は「ユーザーにどんな機能を提供するか」という本来の目的に集中できるようになる。

また、ビルドが高速化されることは、単に時間の節約になるだけではない。試行錯誤の回数が増え、結果としてコードの品質が向上する。保存した瞬間に画面が変わる「ライブな開発体験」は、開発者のモチベーションを維持する上でも極めて重要だ。 @wordpress/build は、WordPressを「古いブログシステム」から「洗練されたアプリケーションプラットフォーム」へと進化させるための、強力なインフラになるだろう。

この記事のポイント

  • @wordpress/build@wordpress/scripts の次世代エンジンとして開発されている。
  • esbuildの採用により、ビルド速度が分単位から秒単位へと劇的に高速化される。
  • 「設定より規約」を重視し、フォルダ構成に従うだけで自動ビルドが可能になる。
  • PHP側のスクリプト登録処理が自動生成され、手動での記述が不要になる。
  • 将来的には既存のツールに統合されるため、標準的な構成なら変更なしで恩恵を受けられる。
WordPressプラグインの成約率を改善するセルフ監査術——「開発者の視点」を捨てるための6つのステップ

WordPressプラグインの成約率を改善するセルフ監査術——「開発者の視点」を捨てるための6つのステップ

WordPressプラグインビジネスにおいて、製品の品質は高いにもかかわらず、新規販売や成約率が伸び悩むケースは少なくない。多くの開発者がコードの堅牢性や機能の網羅性に注力する一方で、ユーザーが最初に触れる「情報の透明性」や「使い勝手の直感性」が置き去りにされているのが現状だ。

元記事の著者であるMark Zahra氏は、10年以上にわたり数百のプラグインをレビューしてきた経験から、成長が停滞する原因の多くはバグや機能不足ではなく、開発者自身には見えない「認識のズレ」にあると指摘している。開発者は自分の製品を熟知しすぎているため、初見のユーザーがどこで迷い、なぜ購入を躊躇するのかを客観的に判断できなくなる。

本記事では、開発者が自らのプラグインを客観的に評価し、成約率を改善するための「セルフ監査」の手法を解説する。このプロセスを通じて、ユーザーが抱く疑問を先回りして解消し、製品の真の価値を伝えるための具体的なステップを提示する。

開発者が陥る「近視眼」の罠と監査の必要性

開発者が陥る「近視眼」の罠と監査の必要性

ソフトウェア開発の現場では、プルリクエストやコードレビュー、自動テストといった「コードの監査」は日常的に行われている。しかし、製品としての「ユーザー体験」や「メッセージング」の監査が行われることは稀だ。この偏りが、製品の成長を阻害する大きな要因となっている。

「知っていること」がバイアスになる

開発者は、自分が作った画面のどこに何があるか、どのボタンを押せば何が起きるかを完璧に把握している。この「知識」が、初めて製品に触れるユーザーが感じるはずの戸惑いを覆い隠してしまう。著者のZahra氏は、多くの開発者が自社のWordPress.orgのリスティング(プラグインページ)を、全くの他人の目線で読み直したことがないと指摘する。

この認識の乖離(かいり)は「知識の呪い」とも呼ばれる。専門知識があるために、未経験者の状態を想像できなくなる現象だ。プラグインが技術的に優れていても、その価値が10秒以内に伝わらなければ、ユーザーはすぐに別の選択肢へ移ってしまう。

なぜ今、監査が必要なのか

WordPressエコシステムは成熟し、多くのカテゴリーで市場は飽和状態にある。新規販売が鈍化し、更新(リニューアル)だけで食いつないでいるビジネスも多い。このような環境下では、単に「機能を追加する」ことよりも、既存の導線を整理し、コンバージョン(成約)の取りこぼしを減らすことの方が投資対効果(ROI)が高い。

10秒テストと競合分析による「言語化」の再定義

10秒テストと競合分析による「言語化」の再定義

監査の第一歩は、ユーザーが最初に目にする情報を徹底的に磨き上げることだ。検索結果から流入したユーザーが、そのプラグインをインストールすべきかどうかを判断する時間は極めて短い。

ファーストビューの「10秒テスト」

ブラウザのシークレットウィンドウで自社のプラグインページを開き、最初の1文だけを読んでみる。その1文で「何をするプラグインか」「誰のためのものか」「なぜそれが必要なのか」が即座に理解できるだろうか。多くのプラグインは「〇〇は、Xの機能を持つ強力なツールです」といった、スペックの羅列から始まっている。

Zahra氏は、優れた例としてeコマースプラグイン「SureCart」の紹介文を挙げている。彼らは「重くて複雑な古いプラグインに別れを告げよう」と、ユーザーが抱えている「悩み」から文章を始めている。これに対し、最大手のWooCommerceは「オープンソースのプラットフォームである」という定義から始まっている。ブランド力がない後発プラグインが勝つためには、製品の定義よりも「ユーザーの課題解決」を前面に出すべきだ。

競合他社との「残酷な」比較

主要な競合3社のプラグインページを横に並べ、自社との違いを冷徹に分析する。2年前には独自の強みだったメッセージも、今では競合が真似をして一般化している可能性がある。チェックすべきは「自社だけが提供できる価値」が、初見のユーザーに伝わる言葉で書かれているかどうかだ。もし競合と同じことしか言えていないのであれば、それは差別化に失敗していることを意味する。

機能ではなく「結果」を売るメッセージングの構築

機能ではなく「結果」を売るメッセージングの構築

開発者は機能を愛しているが、ユーザーは機能によって得られる「結果(アウトカム)」を求めている。この視点の転換が、メッセージングの監査において最も重要だ。

「だから何?」と問い続ける

プラグインの説明文にあるすべての機能説明に対して、「だから何?(So what?)」と自問自答してみる。例えば「高度なフィルタリング機能」という記述があれば、それによってユーザーは「探している商品を3秒で見つけられるようになり、離脱率が下がる」といった具体的な利益にまで落とし込む必要がある。

ユーザーが購入するのは、ドリルではなく「壁に開いた穴」であるという有名なマーケティングの格言がある。WordPressプラグインにおいても同様で、ユーザーが欲しいのは「無制限の設定項目」ではなく、「設定に時間をかけずに理想のサイトが完成すること」だ。コピーライティングの主役を「機能」から「ユーザーの成功体験」へシフトさせる必要がある。

検索意図に沿ったメタディスクリプション

Googleの検索結果に表示されるメタディスクリプションも監査の対象だ。単なるプラグインの概要説明になっていないか確認する。検索ユーザーが抱える疑問に対する「答え」がそこにあると感じさせ、クリックする動機(インセンティブ)を与える内容になっているかが鍵となる。

ユーザーの意思決定を助ける価格戦略の再考

ユーザーの意思決定を助ける価格戦略の再考

価格設定は、製品の価値を伝える強力なシグナルだ。しかし、多くのWordPressプラグインが「サイト数ベース」の価格設定という慣習に縛られ、ユーザーの意思決定を阻害している。

サイト数ベースの価格設定が抱える問題

多くのプラグインが「1サイト」「5サイト」「無制限」といったプランを用意している。このモデルには2つの欠点がある。1つは、1サイトしか必要ないユーザーにとって、上位プランが「自分には関係ない、余計なコスト」に見えてしまうこと。もう1つは、プラン間の違いが「量」だけであり、価値の「質」が変わらないため、アップセルの動機が弱いことだ。

Zahra氏は、サイト数ではなく「機能」や「ユースケース(利用シーン)」でプランを分けることを推奨している。例えば、基本機能は「Basic」、自動化が必要なら「Pro」、大規模サイト向けなら「Elite」といった形だ。これにより、ユーザーは自分のニーズに最適なプランを自己選択しやすくなり、上位プランへの移行も「より高度な課題を解決するため」という明確な理由が生まれる。

認知負荷を減らす選択肢の提示

選択肢が多すぎると、人間は決定を先延ばしにする。これは「選択のパラドックス」として知られる心理現象だ。例えば、3つの機能ティア(階層)と、それぞれに3種類のサイト数オプションがある3×3のグリッドは、合計9つの選択肢をユーザーに突きつけることになる。

理想的なのは、まず「どの機能が必要か」を選ばせ、その後に「何サイトで使うか」を選択させるステップ分けだ。一度に1つの決断だけを求めることで、購入完了までの心理的摩擦を大幅に軽減できる。30秒以内に「自分に最適なプランはこれだ」と確信を持てない価格表は、それだけで成約率を下げている可能性が高い。

ゼロベースでのインストール体験と摩擦の除去

ゼロベースでのインストール体験と摩擦の除去

プラグインがインストールされた直後の数分間は、ユーザーの期待値が最も高く、同時に離脱のリスクも最も高い「ゴールデンタイム」だ。ここでの体験が、継続利用か削除かを決定づける。

「初めてのユーザー」になりきる

ローカル環境やステージング環境に、まっさらなWordPressを用意し、自分のプラグインを最初からインストールしてみる。その際、開発者としての知識を捨て、忍耐力の乏しい一般的なユーザーとして振る舞うことが重要だ。どこで操作が止まるか、どの説明が理解しにくいか、どの通知が煩わしいかを厳しくチェックする。

Zahra氏が自身のInstagramフィードプラグイン「Spotlight」を監査した際、オンボーディング(導入支援)の途中でソーシャルプルーフ(社会的証明)を表示する画面が、ユーザーにとって不要な摩擦になっていたことに気づいたという。ユーザーは一刻も早く「自分の写真をサイトに表示したい」のであり、その前に実績を見せられることは単なる邪魔でしかなかったのだ。

価値提供までの時間(TTV)を最小化する

TTV(Time To Value)とは、ユーザーが製品の価値を実感するまでにかかる時間のことだ。WordPressプラグインにおいて、この時間をいかに短縮できるかが勝負となる。不要な設定ステップを省き、デフォルト設定で最適に動作するように設計し、複雑な設定が必要な場合はウィザード形式で導く。ユーザーに「考えさせる」瞬間を一つでも減らすことが、監査のゴールである。

外部視点を取り入れる重要性

外部視点を取り入れる重要性

セルフ監査には限界がある。どれだけ客観的になろうとしても、自分が作ったものに対する愛着や先入観を完全に取り払うことはできないからだ。最終的には、製品を全く知らない第三者の視点が必要になる。

「透明な壁」に気づくために

開発者が「当たり前」だと思っていることが、ユーザーにとっては「高い壁」になっていることが多々ある。これは、前述した「知識の呪い」によるものだ。チーム外の知人や、可能であればターゲット層に近いユーザーに、実際にプラグインを使ってもらい、その様子を横で観察する(あるいは録画してもらう)。彼らがどこでクリックを迷い、どの言葉を誤解したかを知ることは、100通のサポートメールを読むよりも価値がある。

外部の専門家による監査サービスを利用するのも一つの手だ。元記事の著者のように、数多くの製品を見てきたプロフェッショナルは、開発者が数ヶ月かけても見つけられなかった「成約を妨げる小さな石」を数分で見つけ出すことができる。500ドル程度の投資で成約率が数パーセント改善すれば、そのコストは数週間で回収できるだろう。

この記事のポイント

  • 10秒テストの実施:プラグインページの冒頭1文で、ユーザーの課題解決が伝わるかを確認する。
  • アウトカム(結果)の提示:機能の羅列ではなく、その機能がユーザーにどのような利益をもたらすかを言語化する。
  • 価格構造の単純化:サイト数ベースから機能・価値ベースのプランへ移行し、ユーザーの意思決定を助ける。
  • TTV(価値実感時間)の短縮:インストール直後の摩擦を徹底的に排除し、最短で製品の価値を体験させる。
  • 外部フィードバックの活用:開発者の近視眼を打破するため、第三者によるテストや専門家の監査を取り入れる。

出典

  • WP Mayor “How to Audit Your Own WordPress Plugin (And What You’ll Probably Miss)”(2026年3月16日)