【WordPress】カスタム投稿タイプ-追加から表示までの一連の流れ-

Pocket

投稿とは別に、テキストのURLリンクやテキストPDFリンクさせる「ニュース」という投稿タイプを作成し、トップページに一覧を表示させる、という設置をしたので、まとめてみました。


【流れのポイント】
1、カスタム投稿タイプを作成する
  ・functions.phpにカスタム投稿タイプを追加するタグを入力

2、プラグイン「Custome Field Suite」インストール
  フィールドグループの設定
  ・プラグインインストール
  ・フィールドグループ入力

3、1で作成したカスタム投稿タイプで新規追加

4、表示したいページのテンプレートに表示させるためのループタグ入力

タグ1



1. カスタム投稿タイプを作成する(functions.phpに書き込み)

「News」というカスタム投稿タイプを作成するとします。
最初にfunctions.phpに以下タグを入力します。

‘labels’の‘name’は管理画面上で表示する投稿タイプ名です。 
‘singular_name’はカスタム投稿の識別名です。後ほど2のカスタムフィールドで使用します。

‘menu_position’は管理画面上での配置場所で、5は「投稿」の下になります。

この入力後ダッシュボード画面を開くと「投稿」の下に作成したカスタム投稿タイプが表示されているはずです。

2.プラグイン「Custome Field Suite」インストールしてフィールドグループを設定

WordPressには標準で「カスタムフィールド」機能がありますが、「Custome Field Suite」というプラグインをインストールとより使い勝手が良くなります。

インストール → 有効化すると、ダッシュボードメニューの「設定」の下辺りに「フィールドグループ」というメニューが追加されます。

「フィールドグループ」→「新規追加」するとカスタムフィールドのテンプレート登録画面が開きます。

今回はPDFのニュース書面のニュース、もしくは、テキストのニュースを表示させたいので、下記のように入力しました。

タイトルは「pdfデータ」としました。ここはダッシュボードに表示されるだけで公開ページ表示には一切関係ないため自分がわかりやすい内容でOKです。

①のラベルは投稿や固定ページの編集画面に表示されるカスタム投稿タイプの名前になるため、何を入力するのかがわかりやすい名前をつけます。

②の名前はカスタムフィールドを表示させる命令をテンプレートファイルに書き込むときに使う、カスタムフィールドの識別名になります。
日本語は使えず、半角英数字かアンダースコア「_」の入力が必須です。今回は「pdf_data」としました。

③はカスタムフィールドの種類を指定します。今回はPDFをアップロードしてそのファイルにリンクさせるので、「ファイルアップロード」を選択しました。

選択肢はたくさんあります。
詳しくはWordPressプラグイン 「Custom Field Suite」使い方まとめを参考にしていただくといいと思います。

④のFileType以降は③のフィールドの種類の選択によって表示が異なります。

③で「ファイルのアップロード」を選択した場合は上記内容になります。
アップロードさせたいファイルを指定できます。今回はAnyとしました。

⑤の返り値は、公開ページでファイルのパス(URL)を使いたい場合は「ファイルURL」、その他メディアライブラリに登録した「タイトル」「キャプション」「代替テキスト」「説明」などの付属情報も使いたい場合は「添付ファイルID」を選択します。

フィールドには複数条件を追加できます。

PDFファイルへのリンクとテキストのみを表示させたいため、「新規フィールドを追加」でもう一つフィールドを追加しました。

テキストのみの場合は②の名前を「pdf_no」として、③のカスタムフィールドの種類を「単一行テキスト」としました。⑤の概要は入力欄の上に表示する説明文になります。

「フィールド」の下の「配置ルール」は、どのページでこのカスタムフィールドを入力できるようにするか割り当てる場所です。

投稿タイプの入力スペースをクリックすると、選択肢が表示されます。

今回は新しく作成したカスタム投稿タイプで使うため、1.のfunctions.phpでsingular_nameに指定した識別名「news」を選択しました。

3、カスタム投稿タイプで新規追加

1.で作成した新しいカスタム投稿タイプの「ニュース」で新規追加すると、
2のフィールドグループ「PDFデータ」で設定したPDFをアップロードする欄とリンク先を入力する欄が表示されました。

ニュースタイトルを入力し、リンクさせたいPDFファイルをアップロードして、「公開」をクリックします。

4、表示したいページのテンプレートに表示させるためのループタグ入力

最後、表示させたいページのテンプレートファイルにタグを入力します。
今回はトップページのテンプレートに入力しました。

ニュースを3件表示させて、PDFデータの登録があればPDFへのリンクを表示、リンク先にURL入力があればURLへのリンクを表示、どちらも入力がなければタイトルテキストだけ表示させる、というような内容です。

この記事が気に入ったら
いいね ! しよう

Twitter で

この記事へのコメント

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です