2020-10-26/2023-05-23

固定ページの内容を他のページで利用する方法

固定ページの内容を他のページで利用する方法

WordPressで固定ページの内容を他のページで表示する方法を紹介します。

テンプレート触る人用に「コードでの表示方法」

テンプレートは触らない人ように「プラグインでの表示方法」

のどちらの方法を説明します。

テンプレートを触る開発者の人からすると「そんな物使うことあるか」と思うかもしれません。

使う理由は一つで「管理画面から編集ができる」というところですね。

管理画面から編集することができれば、コードが読めない人でも画像の差し替えなど簡単に行うことができます。

それでは「プラグインでの表示方法」はどのように使用するのが便利なのでしょうか。

それは、複数のページで同じ内容を表示させたい場合に便利です。

もし、複数カ所に表示させている同じ内容に変更があった場合、それぞれを修正させなくてはいけません。

固定ページの内容を表示していれば、固定ページの内容のみ表示するだけで修正が可能です。

それではそれぞれの方法を見ていきましょう。

コードでの表示方法

テンプレート内に差し込んで使用することができます。

$page = get_post( $post_ID );
echo apply_filters( 'the_content', $page->post_content );

$post_IDには取得した固定ページのIDを入力します。

get_post関数によって$pageで取得したい固定ページのWP_POSTオブジェクトを扱うことができます。

get_post関数の引数で返り値を配列に変更したりサニタイズを行うことができます。

下の行は取得したページの内容をthe_contentフィルターを通して出力しています。

比較的簡単に使用できることがわかると思います。

プラグインでの表示

使用するプラグインは「Insert Pages」というプラグインです。

公式のプラグインなので、「管理画面」⇒「プラグイン」から「Insert Peges」と検索すれば表示されます。インストール、有効化してください。

設定

「管理画面」⇒「設定」⇒「Isert Pages」と進みます。

ちょうど真ん中の項目「Insert method」を変更します。デフォルトでは上の選択になっていると思います。

下の「Use Normal Method」に変更してください。

insert-pages - setting

設定は以上で完了です。

Gutenbergでの利用方法

ブロックエディタでの利用方法です。

エディタ画面でブロックの追加から「Insert Pege」を選択します。

insert-pages - gutenberg1

「Choose a page insert」と表示されると思います。

ここに固定ページの内容が表示されます。

表示する固定ページを右側から選択します。

insert-pages - gutenberg2

Insert Page・・・

固定ページのURLを張り付けるか固定ページのスラッグ(パーマリンク)を入力します。スラッグは完璧である必要はなく断片でも検索してくれます。

候補のページタイトルが表示されますので、取得したい固定ページを選択してください。

Display・・・

「title」・・・タイトルを表示します。

「Link」・・・指定した固定ページへのリンクを表示します。表示はタイトルです。

「exerpt with title」・・・タイトルと抜粋を取得します。固定ページへのリンクもついています。

「excerpt only(no title)」・・・「exerpt with title」の内容から抜粋のみ出力します。

「content」・・・固定ページの本文を出力します。今回使用するもの

「Post thumnail」・・・サムネイル画像を表示することができます。

「all」・・・固定ページがそのまま表示されます。

「use a custom template」・・・独自のテンプレートファイルで出力します。上級者向けです。

Custom CSS Class・・・

独自のCSSクラスを付与することができます。

Custom Element ID・・・

独自のIDを指定することができます。

Custom QueryString・・・

クエリストリング設定することができます。

検証していませんが、URLクエリによってページの出力内容を変更するページの場合に、URLクエリを指定することで意図した表示行うことができると思われます。

Inline・・・

ブロック要素(<div>)ではなくインライン要素(<span>)として出力することができます。

Reveral Private Page・・・

表示するページが会員限定など閲覧することが限定されたページの場合チェックを付けておきます。

固定ページを選択し、「content」を選択した場合、以下のように「Choose a page insert」が固定ページの内容に変わります。

insert-pages - gutenberg3

旧エディタでの利用方法

旧エディタでの利用方法です。

カーソルを合わせると「Insert Page」と表示されるボタンを探します。

insert-pages - normaleditor

クリックするとポップアップが表示されます。

insert-pages - normaaleditor3

ページの一覧から表示したいページを選択するか

「Slug or ID」にページのスラッグまたはページのIDを入力しましょう。

Displayは先の「Gutenburg」で説明した項目と同様です。

「Update」ボタンを押すとショートコードが出力されます。

insert-pages - normaleditor2

さいごに

コードでの出力もプラグインでの出力も簡単だと思います。

そこまで複雑な手順はありません。

うまく活用してサイト運営を楽にしてみてください。

2020 KumaTechLab.