【TT2】ショートコードでテンプレートを呼び出す方法

公開日:2022(令和4)年9月11日/最終更新日:

WordPress Create Shortcodes | Personal WP Customization Notes (PWCN)

【景品表示法に基づく表記】ページ内のコンテンツには、商品プロモーションが含まれています



ブロックテーマであるTT2(Twenty Twenty-Two)では、テーマテンプレートをブロックを使って自分好みにできるようになっています(これがブロックテーマたる所以です)。

しかしながら、ブロックには制約があり、カスタムHTMLブロック以外ではHTMLの直接記述はできず、PHPを使ったテンプレートコンテンツの挿入はできませんから、クラシックテーマのようにテンプレートファイルを直接編集して何とかするという方法が使えません。

そこで考えたのが、子テーマに追加したテンプレートファイルをショートコードで呼び出す方法。

これなら、テンプレートファイルにHTMLでもPHPでも何でも出力できて便利です。

セキュリティ云々という話になってくるかと思いますので、導入するかは自己判断でお願いします。
ちなみにこちらで配布している子テーマにはこの機能を追加しています。必要ない場合は後述する削除方法で機能削除してください

テーマファイルに書いたテンプレートをショートコードで呼び出す方法

テンプレート用のファイルを作る

パソコン上でテキストエディタを開き、空のまま、ファイル名を「parts」、拡張子を「php」で保存し、「parts.php」を作成してください。

FTPクライアントツールなどを使って、作成した「parts.php」を子テーマのフォルダ内へアップロードします。

テンプレートを読み込んでショートコード出力させる

以下のコードを子テーマのfunctions.phpへ追加します。

function pwcn_template_parts_sc_init() {
        ob_start();
        get_template_part('parts');
        return ob_get_clean();

}
add_shortcode('parts', 'pwcn_template_parts_sc_init');

そして投稿テンプレートや、投稿本文内へ以下のショートコードを挿入します。

[parts]

試しに、テーマファイルエディタを開き、「parts.php」を開いて、以下を入力し、投稿などへショートコードを入れてみてください。

<p>parts.phpへ入力した内容です</p>

ショートコードを入れた場所に「parts.phpへ入力した内容です」と表示されれば実装完了です。

複数のテンプレートを作って挿入したい場合は、以下のようにカスタマイズしてください。

  • 「parts.php」とは別の名前のファイルを子テーマ内へアップロード
  • functions.phpへ追加するコードの以下の部分を変更
    関数名を変更(2か所)、partsの部分を変更(2か所)
  • partsの部分を変更したものを挿入したショートコードを投稿などへ挿入

なお、PHP以外のコンテンツをショートコードにして出力するのでしたら、以下のプラグインを使うと便利だと思いますので、試してみてください。

定型文や広告などをショートコードにして挿入できるプラグイン「Shortcoder」

配布している子テーマからこの機能を削除するには

私が提供しているTT2の子テーマには、3つのパーツ出力機能を設けています。

コードセキュリティなどを気にされる方は、include-childフォルダにあるfunctions.phpを開き、以下のコードを削除すれば無効にできます。

/***** add-content内のテンプレートファイルの内容をショートコードで出力 *****/
/*** add-content/parts01の内容を出力 ***/
function pwcn_template_parts01_sc_init() {
        ob_start();
        get_template_part('add-content/parts01');
        return ob_get_clean();

}
add_shortcode('parts01', 'pwcn_template_parts01_sc_init');

/*** add-content/parts02の内容を出力 ***/
function pwcn_template_parts02_sc_init() {
        ob_start();
        get_template_part('add-content/parts02');
        return ob_get_clean();

}
add_shortcode('parts02', 'pwcn_template_parts02_sc_init');

/*** add-content/parts03の内容を出力 ***/
function pwcn_template_parts03_sc_init() {
        ob_start();
        get_template_part('add-content/parts03');
        return ob_get_clean();

}
add_shortcode('parts03', 'pwcn_template_parts03_sc_init');

後述、こういう機能の実装は、自身でクラシックテーマのカスタマイズや作成をしてきたからこそ、簡単にこうすればいいんじゃない?ってアイディアが湧きます。

長くWordPressのカスタマイズをしてきた知識がブロックテーマでも生かすことができて、ちょっぴりうれしいです。

, , , ,



Lolipop ServerMoshimo Ad x-serverMoshimo Ad

WordPress Create Shortcodes | Personal WP Customization Notes (PWCN)
カスタムフィールドに保存した値を投稿本文内へショートコードで呼び出すコード