Toolset Views:ページ用テンプレートの作成(基本編)

Toolsetで作成したカスタムフィールドやその他のパーツ類は、記事本文に挿入してフロントエンドに表示することもできますが、投稿タイプによってはそれらの配置が常に同じ場所のものもあるでしょう。そのような場合には、特定の投稿タイプ用のテンプレートを作っておくと便利です。

このページでは、Viewsプラグインのコンテンツテンプレート機能を使ってカスタムフィールドを表示させるためのテンプレートを作成し、記事に適用させる手順を見ていきます。

ページ用テンプレートの作り方

解説にあたっては、こちらで作成した以下のカスタム投稿タイプ・フィールド・タクソノミを使っています。

  • カスタム投稿タイプ:「料理」
  • カスタムフィールド:「料理のサブタイトル」「料理の写真」
  • カスタムタクソノミ:料理国籍

また、解説画像中の文章はWikipediaの文を利用させていただきました。
作成時の環境は、WordPress 4.9.8 (Twenty Seventeen テーマ)です。

それでは、解説用の例を使った実際の手順を画像で見てみましょう。

previous arrow
next arrow
Full screenExit full screen
Slider

ページ用のテンプレートを記事に適用すると、もともと記事本文の入力内容を表示していたエリアが、作成したテンプレートの内容で上書きされます。一度テンプレートを作ってしまえば、あとは、本文に集中できるのでぜひ活用してみてください。

初心者向けの活用方法としては、ブログなどで記事の文末に、「最後までご覧いただきありがとうございました。」の一文とか、SNSのシェアボタン、AdSense広告を常に表示させたい時に、あらかじめテンプレートを作って配置しておくと便利でしょう。もちろん、テンプレート内には他のプラグインのショートコードも配置可能です。

ヘッダーやフッター、サイドバーエリアも含めたテンプレートを作成する方法もありますが、やや上級者向けの内容なので、ここでは解説しません。

上記のテンプレート用のエディタでは、以下のようにHTMLタグでショートコードを囲み、cssやスタイルを使ってレイアウトを制御することができます。

[wpv-post-title]
 ↑タイトルを出力しH2タグで囲んだ例

なお、テンプレートを表示させた時だけに適用するcssやjavascriptは、テンプレート用エディタの下にある「CSS editor」と「JS editor」に入力しましょう。

Toolsetの使い方・全目次