WordPress

WordPressのカスタム投稿とは?カスタムタクソノミーや開発に必要な知識【全部盛り】

フリーランスエンジニアのもさくです。

今日は、

  • カスタム投稿とは?
  • カスタムタクソノミーとは?
  • カテゴリーとタグの違いは?
  • スラッグとは?

のワードプレスのカスタム投稿に関して必要な知識全部盛りでお届けします!

いや、そんなもんめんどくせーってなる気持ちは、あなたも私も同じですが、ここをすっ飛ばして良いワードプレス構築はできませんので、コピペハリボテワードプレス開発から抜け出て、次のステージに進むために一緒に勉強していきましょう。

この記事を見れば、カスタム投稿周りの開発に必要な知識を全て手に入れられて、実装も最後までできる様になります。

改めてWordPressのカスタム投稿ってなに?

カスタム投稿とは新たに別の「投稿タイプ」を作る機能のことです。

別の投稿タイプ?って思った人は、ワードプレスのことを何も知らない様な危険な状態なので、一緒に復習していきましょう。

そもそも投稿タイプってなんぞや?

投稿タイプとは、

  • お知らせやブログ記事の管理(ニュースとかブログ一覧とか)
  • 記事管理機能を使った色々な応用もできる(絞り込み検索とか)

機能のことです。

デフォルトでWordPressをインストールして管理画面を開くと、

上の赤枠の部分がデフォルトである投稿タイプです。

下のお知らせの部分が、新しく作ったカスタム投稿タイプになります。

投稿ページと固定ページの違いについて

カスタム投稿タイプの理解をするためにも、改めて投稿ページと固定ページも勉強しましょう。

投稿ページについて

投稿ページは、カテゴリーやタグによりページ同士をジャンル分けして一覧表示することができます。

ブログやニュースのようなコンテンツは投稿で作成します。

できること

  • カテゴリー・タグによる投稿の関連付け
  • 投稿一覧、カテゴリー一覧、タグの一覧から各ページを一覧表示
  • カスタム投稿タイプを作ることができる

できないこと

  • 投稿同士で親子関係を作ることはできない
  • ページごとにデザインのテンプレートは選択できない

固定ページについて

固定ページは通常カテゴリーやタグという概念がなく、ページ単体で独立しているのが特徴です。

ページ単体で完結できるようなコンテンツを書くのに適しています。

トップページや会社情報、採用情報、アクセス、ランディングページとかですね。

できること

  • 固定ページ同士で親子関係が作れる
  • ページごとにデザインテンプレートを作成して使い分けることができる

できないこと

  • 固定ページ一覧、カテゴリー一覧、タグ一覧、日付アーカイブなどで各ページを一覧表示することはできない。

ここまで振り返りも兼ねつつ理解できましたら、次は「タクソノミー」「ターム」について勉強していきましょう!

この部分で???マークになる人も多いかもですが、表で見たら分かりやすいので表にしました。

タクソノミーとタームについて

タクソノミーとタームの関係

まずはデフォルトにある投稿タイプから

タクソノミーターム
デフォルトの投稿タイプカテゴリー新着情報
ブログ
お知らせ

次にカスタム投稿タイプ。

カスタム投稿タイプタクソノミーターム
※携帯の商品リストを作成
価格〜50,000
50,001〜80,000
80,000〜
カラーred
white
blue
機種iPhone
Andoroid

タクソノミーは表にあるように、ややこしいですけどタクソノミーに、

  • カテゴリーや
  • 価格
  • カラー
  • 機種

といった名前が付けられているということです。

で、次にタームはタクソノミーの中の分類です。

分かりやすくカラーのタクソノミーで説明します。

カラーというタクソノミーの中に、

  • red
  • white
  • blue

というタームという分類分けがされているというイメージです。なんとなく分かりましたか?

なんとなくというよりも、こういう概念で構成されているので覚えましょう。

カテゴリーとタグの違いとは

続いてカテゴリーとタグの違いについて説明します。

カテゴリーはフォルダ(親子関係を持つことができる)

カテゴリーは投稿の各記事をカテゴライズ・グルーピング化するためのフォルダのような機能です。

各投稿記事をグルーピング化することができます。

カテゴリーは大きい分類分けで使います。

要するに先程説明した、

カスタム投稿タイプタクソノミーターム
※携帯の商品リストを作成
価格〜50,000
50,001〜80,000
80,000〜
カラーred
white
blue
機種iPhone
Andoroid

カスタム投稿タイプの中のタクソノミーの部分がカテゴリーです。

親カテゴリーが「携帯の商品リスト」で、その子供のカテゴリーが「価格」とか「カラー」とかのことです。

タグは札・付箋みたいなもの

タグはカテゴリーの中の更に細かい分類のことです。(タームの部分)

タグは親子関係を持たせることはできませんが、柔軟に分類分けすることができます。

階層構造がない変わりに増やしたり、減らしたり、この辺は自由です。別に必ず使わなくてもいいですしね。

タグはWordPress化する時に、そこまで神経質に考える必要はありませんが、カテゴリーの部分は予め構造を決めておかないとサイト構造がおかしくなります。

重要度的にはカテゴリー構造(大きい枠組み)の方が大事なので、この辺はしっかり押さえておきましょう。

補足※スラッグとは

スラッグとは、各ページのURLのことです。

記事やカテゴリなどのURLの最後の部分を任意の文字列に指定できる機能でURLの一部になります。

記事に付けるスラッグは自由度は高いです。

スラッグはSEOの観点から見ても、一度設定したURLを頻繁に変えるのはNGです。検索順位が飛ばされてしまう原因にも繋がります。

では、概念とか色々わかった所で実際にどうやて作るのかも解説していきます。

register_post_typeとは?

「register_post_type」は、カスタム投稿タイプを作成できる関数です。

カスタム投稿タイプの追加をする処理の呼び出し

add_action('init', 'my_add_custom_post');
function my_add_custom_post()
{
  register_post_type( // カスタム投稿タイプの追加関数
    'news', // カスタム投稿タイプ名
)
}

上記で、新たにカスタム投稿を追加する処理ということになります。

このコードのみでカスタム投稿自体は作成されますが、オプションなどの設定をしないと使い物にならないので、そちらも併せて見ていきましょう!

処理の呼び出し

add_action('init', 'my_add_custom_post');
function my_add_custom_post() {
// 処理内容
}

function my_add_custom_post() { } の { } 内の処理を呼び出しています。

1行目にあるmy_add_custom_postと、2行目にあるmy_add_custom_postが同じ文字列であれば、「// 処理内容」の処理を呼び出せます。

register_post_type(
  'news',
)

カスタム投稿タイプの追加をする関数です。
このコードの場合、「news」というカスタム投稿名で追加されます。

register_post_typeは、カスタム投稿タイプを追加するためのWordPressで用意されている関数です。

この「news」などのテキストは記事のURLにもなります。

カスタム投稿記事のURL
https://ドメイン名/news/

使える文字は、

  • 小文字のアルファベット
  • 記号のみ

です。
「スペース」は使えませんので注意。単語の区切りにはハイフン(-)を使ってください。

投稿をいくつかした後の変更はやめましょう。URLが変わってしまいますので。

オプション(パラメータ)の指定

カスタム投稿を作ったら、オプションを付けてカスタマイズします。

この作業をするとようやく実際に使えるようなカスタム投稿になります。

下記のような記述が基本です。
array()の中に、利用したいオプション名の指定をします。

array(
      'label' => 'お知らせ',

   /*ラベルの作成*/
      'labels' => array(   /*任意の名前*/   
    'name' => 'お知らせ',  //管理画面などで表示する名前
        'singular_name' => 'お知らせ',  //管理画面などで表示する名前(単数形)
        'all_items' => 'お知らせ一覧',   //管理画面メニューで表示する名前(nameより優先される)
      ),
      'public' => true,   //ユーザーが内容を投稿する場合true(通常はtrue)
      'has_archive' => true,   //アーカイブページを作成するか否かを設定(trueでindexページを作成)
      'menu_position' => 5, //この投稿タイプが表示されるメニューの位置 5 - 投稿の下
      'supports' => array(  // サポートする機能(以下)
        'title',  // タイトル
        'editor',   // エディター
        'custom-fields',  //カスタムフィールド
        'thumbnail',  // アイキャッチ画像
        'revisions',  // リビジョンの保存
      ),
      'show_in_rest' => true, // Gutenbergエディタを有効
    )

他にも色々ありますが、基本的に使うパラメーターは大体入れてあります。

各オプション(パラメータ)の詳しい解説

label

管理画面上で表示されるカスタム投稿タイプの名前の設定。
日本語で大丈夫です!管理画面上で分かりやすい名前を付けてください。

name

管理画面で表示する名前です。メインの表示名(labelを上書きする)

singular_name

メインの表示名の単数形

all_items

管理画面メニューで表示する名前(nameより優先される)

public

このカスタム投稿タイプを管理画面上に表示するかどうかの設定です。
初期値は”false”となっているので、管理画面のメニュー表示が非表示となり投稿ができなくなるので、”true”にします。

has_archive

カスタム投稿タイプのアーカイブページ(一覧ページ)を作成したい場合の設定です。
カスタム投稿は、デフォルトでは固定ページと同じで一覧表示はされません。これを一覧表示させるためには、アーカイブを有効にする必要があります。


またパーマリンク設定がデフォルトの場合は、この設定をせずともアーカイブページを表示できますが、あらかじめ記述しておいて問題ありません。

menu_position

管理画面左にあるメニューのどの位置に表示するかの設定。
「5」と指定すると「投稿」の下に表示されます。「メディア」の下に置きたい場合は「10」、「固定ページ」の下に置きたい場合は「20」、「投稿」の上に置きたい場合は「4」に設定してください。

もっと詳しく知りたい人は、Codexを参考にしてください。

supports

このカスタム投稿タイプが指定した機能をサポートするかチェックする関数です。

編集画面で使用できる項目の設定。

例えば、

  • title’ (タイトル)
  • ‘editor’ (内容の編集)
  • ‘author’ (作成者)
  • ‘thumbnail’ (アイキャッチ画像)
  • ‘excerpt’ (抜粋)
  • ‘trackbacks’ (トラックバック送信)
  • ‘custom-fields’ (カスタムフィールド)
  • ‘comments’ (コメントの他、編集画面にコメント数のバルーンを表示する)
  • ‘revisions’ (リビジョンを保存する)
  • ‘page-attributes’ (メニューの順序)(投稿タイプの hierarchical が true であること)
  • ‘post-formats’ (投稿のフォーマットを追加)

こんな感じで色々あります。必要なものだけ記述しましょう。

show_in_rest

デフォルトはfalseです。「REST APIの有効化」などと言われる事が多いですが、ブロックエディタ(Gutenberg)で使用できるようにするための設定です。


エディタの有効化(‘supports’ => ‘editor’)している必要があります。エディタが無効化されていると true が記述されていてもGutenbergが表示されないので注意!

複数のカスタム投稿タイプを新たに追加したい場合

/**
 * 定義
 */
add_action('init', 'my_add_custom_post');
function my_add_custom_post()
{
  register_post_type(
    'news',
    array(
      'label' => 'お知らせ',
      'labels' => array(
        'name' => 'お知らせ',
        'singular_name' => 'お知らせ',
        'all_items' => 'お知らせ一覧',
      ),
      'public' => true,
      'has_archive' => true,
      'menu_position' => 5,
      'supports' => array(
        'title',
        'editor',
        'custom-fields',
        'thumbnail',
        'revisions',
      ),
      'show_in_rest' => true, // Gutenbergエディタを有効
    )
  );

  register_post_type(
    '',
    array(
      'label' => 'サービス', //カスタム投稿タイプ名
      'labels' => array( //オプション
        'name' => 'サービス紹介',
        'singular_name' => 'サービス紹介',
        'all_items' => 'サービス一覧',
      ),
      'public' => true,
      'has_archive' => true,
      'menu_position' => 5,
      'supports' => array(// サポートする機能を記述
        'title',
        'editor',
        'custom-fields',
        'thumbnail',
        'revisions',
      ),
      'show_in_rest' => true, // Gutenbergエディタを有効
    )
  );
}

register_post_typeを繋げて新たに定義するだけですね。記述は変わりません。増やしたカスタムタイプ投稿に併せて内容を変更するだけです。

カテゴリーとしてカスタムタクソノミーを新たに追加する方法

長くなってきましたけど、最後の項目です。

下記のコードをfunctions.phpに追記します。

/**
 * カスタムタクソノミー
 */
add_action('init', 'my_add_taxonomy');
function my_add_taxonomy()
{
  register_taxonomy(
    'tax_news', // タクソノミー名
    'news', // カスタム投稿タイプ名
    array(
      'label' => 'お知らせカテゴリー',
      'labels' => array(
        'all_items' => '全てのカテゴリー',
        'add_new_item' => 'カテゴリーを追加'
      ),
      'public' => true,
      'hierarchical' => true,
      'show_in_rest' => true,
      'rewrite' => array(
        'slug' => 'news',
      ),
    )
  );
}

それでは詳しく見ていきましょう!

カテゴリー用のカスタムタクソノミーを追加する処理の呼び出し

下記によって、function my_add_taxonomy()内の内容を呼び出しています。

add_action('init', 'my_add_taxonomy');
function my_add_taxonomy() {
// 処理内容
{

下記によってカスタムタクソノミーの登録をしています。

register_taxonomy( // カスタムタクソノミーの追加関数
    'tax_news',// カテゴリーの名前(英字)
    'news', // // カテゴリーを追加したいカスタム投稿タイプ名
)

1行目にあるregister_taxonomyは、「カスタムタクソノミー」を追加するためのWordPressで用意されている関数になります。

今回の場合、「tax_news」というカテゴリー名(2行目)で、「news」として作成したカスタム投稿タイプに追加(3行目)しています。

なお、使える文字は、小文字のアルファベットと記号のみです。
単語の区切りにはハイフン( – )、もしくはアンダーバー( _ )を使ってください。スペースは使えません。

カテゴリー用のオプション(パラメータ)の指定

array(
      'label' => 'お知らせカテゴリー', // 表示名
      'labels' => array(
        'all_items' => '全てのカテゴリー',
        'add_new_item' => 'カテゴリーを追加'
      ),
      'public' => true, // 管理画面に表示するかどうかの指定
      'hierarchical' => true, // 階層を持たせるかどうか
      'show_in_rest' => true, // REST APIの有効化。ブロックエディタの有効化。
      'rewrite' => array( //カスタム投稿タイプのパーマリンク設定
        'slug' => 'news',  //カスタム投稿タイプのスラッグ設定
      ),
    )

オプションの使い方もほぼほぼ一緒なのですが、新しく出てくるやつもあるのでまとめます。

label

管理画面上で表示されるカスタム投稿タイプの名前の設定。
日本語で大丈夫です!管理画面上で分かりやすい名前を付けてください。

public

このカテゴリーを管理画面上に表示するかどうかの設定です。
初期値は”false”となっているので、管理画面のメニュー表示が非表示となり投稿ができなくなるので、”true”にします。

hierarchical

デフォルトはfalse。階層構造を持つかどうかの設定です。
“true”だと「カテゴリー」のように。”false”だと「タグ」のような形式になります。

show_in_rest

デフォルトはfalseです。投稿タイプをブロックエディタ(Gutenberg)で使用できるようにするための設定です。

register_post_type内に記述していても、ここの中でもshow_in_restにtrueを指定してあげます。
なお、エディタの有効化(‘supports’ => ‘editor’)にしている必要があります。

rewrite

カスタム投稿タイプのパーマリンク設定ができます。

他にもたくさんのオプション(パラメータ)が存在します。

詳しく知りたい方は、WordPress Codexで調べて見てください。

複数のカスタムタクソノミー(カテゴリー)を追加したい場合

複数のカスタムタクソノミー(カテゴリー)を追加したい場合、下記の様に記述します。

カスタムタクソノミー(カテゴリー)は、元となる「カスタム投稿タイプ」の追加登録があって初めて追加ができます。実用性も兼ねて、カスタム投稿タイプの追加も合わせたコードになります。

/* ---------- カスタム投稿タイプを追加 ---------- */
add_action( 'init', 'my_add_taxonomy' );

function my_add_taxonomy() {

  // 「ニュース」のカスタム投稿追加
  register_post_type(
    'news', //カスタム投稿タイプ名
    array(
      'label' => 'ニュース',
      'public' => true,
      'has_archive' => true,
      'menu_position' => 5,
      'show_in_rest' => true,
      'supports' => array(
        // サポートする機能を記述
      ),
    )
  );

  // 「ニュース」のカスタム投稿にカテゴリーを追加
  register_taxonomy(
    'news-cat',
    'news', // カテゴリーを追加したいカスタム投稿タイプ名
    array(
      'label' => 'カテゴリー',
      'hierarchical' => true,
      'public' => true,
      'show_in_rest' => true,
    )
  );

  // 「サービス」のカスタム投稿追加
  register_post_type(
    'service',  //カスタム投稿タイプ名
    array(
      'label' => 'サービス',
      'public' => true,
      'has_archive' => true,
      'menu_position' => 5,
      'show_in_rest' => true,
      'supports' => array(
        // サポートする機能を記述
      ),
    )
  );

  // 「サービス」のカスタム投稿にカテゴリーを追加
  register_taxonomy(
    'service-cat',
    'service', // カテゴリーを追加したいカスタム投稿タイプ名
    array(
      'label' => 'カテゴリー',
      'hierarchical' => true,
      'public' => true,
      'show_in_rest' => true,
    )
  );

}

タグとしてカスタムタクソノミーを新たに追加したい場合

タグとしてカスタムタクソノミーを追加したい場合、下記のコードをfunctions.phpに追記します。

add_action('init', 'add_taxonomy_tag');
function add_taxonomy_tag(){
  register_taxonomy(
    'news-tag', // タグの名前(半角英数字の小文字)
    'news',     // タグを追加したいカスタム投稿タイプ
    array(      // オプション(以下)
      'label' => 'タグ', // 表示名
      'public' => true, // このタクソノミーを利用する場合かどうか
      'hierarchical' => false, // 階層を持たせるかどうか
      'show_in_rest' => true, // REST APIの有効化。ブロックエディタの有効化。
      'update_count_callback' => '_update_post_term_count',
    )
  );
}

タグ用のカスタムタクソノミーを追加する処理の呼び出し

下記によって、function add_taxonomy_tag()内の内容を呼び出しています。

add_action('init', 'add_taxonomy_tag');
function custom_taxonomy_tag(){
  // 処理内容
}

下記によって、カスタムタクソノミーの登録をしています。

register_taxonomy(
  'news-tag',
  'news',
)

1行目のregister_taxonomyは、「カスタムタクソノミー」を追加するためのWordPressで用意されている関数です。
今回の場合、「news-tag」というタグ名(2行目)で、newsのカスタム投稿タイプに追加(3行目)しています。

なお、使える文字は、小文字のアルファベットと記号のみです。
単語の区切りにはハイフン( – )、もしくはアンダーバー( _ )を使ってください。スペースは使えません。

タグ用のオプション(パラメータ)の指定

下記で、タグのオプションを指定できます。

タグ用のパラメーターで一つ必ず付けないといけないものがありますので、そのオプションだけ詳しく説明します。

その他のパラメーターは既に説明しあるので、分からなければ戻って確認してください。

array(
  'label' => 'ニュースタグ',
  'hierarchical' => false,
  'public' => true,
  'show_in_rest' => true,
  'update_count_callback' => '_update_post_term_count',
)

各オプション(パラメータ)の詳しい解説

update_count_callback

カスタムタクソノミーをタグのように使いたい場合は、オプションの'update_count_callback' => '_update_post_term_count'を必ず追加します。

この関数を入力しないと、一度に入力したコンマ区切りの複数の項目が、別々の値ではなく一つの値として保存されてしまいます。これは get_the_term_list や他のターム表示用関数を使うとき、非常に面倒なことになります。

複数のカスタムタクソノミー(タグ)を追加したい場合

複数のカスタムタクソノミー(タグ)を追加したい場合、以下の様に記述します。

なお、カスタムタクソノミー(タグ)は、カスタムタクソノミー(カテゴリー)と同様に、元となる「カスタム投稿タイプ」の追加登録があって初めて追加ができます。
実用性も兼ねて、カスタム投稿タイプの追加とカスタムタクソノミー(カテゴリー)の追加も合わせたコードになります。

/* ---------- カスタム投稿タイプを追加 ---------- */
add_action( 'init', 'custom_post_type' );

function custom_post_type() {

  // 「ニュース」のカスタム投稿追加
  register_post_type(
    'news', //カスタム投稿タイプ名
    array(
      'label' => 'ニュース',
      'public' => true,
      'has_archive' => true,
      'menu_position' => 5,
      'show_in_rest' => true,
      'supports' => array(
        // サポートする機能を記述
      ),
    )
  );

  // 「ニュース」のカスタム投稿にカテゴリーを追加
  register_taxonomy(
    'news-cat',
    'news', // カテゴリーを追加したいカスタム投稿タイプ名
    array(
      'label' => 'ニュースカテゴリー',
      'hierarchical' => true,
      'public' => true,
      'show_in_rest' => true,
    )
  );

  // 「ニュース」のカスタム投稿にタグを追加
  register_taxonomy(
    'news-tag',
    'news', // タグを追加したいカスタム投稿タイプ名
    array(
      'label' => 'ニュースタグ',
      'public' => true,
      'hierarchical' => false,
      'show_in_rest' => true,
    )
  );

  // 「サービス」のカスタム投稿追加
  register_post_type(
    'service',  //カスタム投稿タイプ名
    array(
      'label' => 'サービス',
      'public' => true,
      'has_archive' => true,
      'menu_position' => 5,
      'show_in_rest' => true,
      'supports' => array(
        // サポートする機能を記述
      ),
    )
  );

  // 「サービス」のカスタム投稿にカテゴリーを追加
  register_taxonomy(
    'service-cat',
    'service', // カテゴリーを追加したいカスタム投稿タイプ名
    array(
      'label' => 'サービスカテゴリー',
      'public' => true,
      'hierarchical' => true,
      'show_in_rest' => true,
    )
  );

  // 「サービス」のカスタム投稿にタグを追加
  register_taxonomy(
    'service-tag',
    'service', // タグを追加したいカスタム投稿タイプ名
    array(
      'label' => 'サービスタグ',
      'public' => true,
      'hierarchical' => false,
      'show_in_rest' => true,
    )
  );

}

カスタム投稿タイプの追加による注意点

WordPressには、

  • すでにWordPress内で使われてる文字や
  • 予約語として登録されている単語

というものが存在します。

これらの文字列(単語)が重複すると、WordPress は何のヒントも説明も無しに 404 エラーを返します。

予期せぬエラーが出て詰まってテンパることにもなるので注意しましょう。

NG単語 (アルファベット順)

  • attachment
  • attachment_id
  • author
  • author_name
  • calendar
  • cat
  • category
  • category__and
  • category__in
  • category__not_in
  • category_name
  • comments_per_page
  • comments_popup
  • customize_messenger_channel
  • customized
  • cpage
  • day
  • debug
  • error
  • exact
  • feed
  • fields
  • hour
  • link_category
  • m
  • minute
  • monthnum
  • more
  • name
  • nav_menu
  • nonce
  • nopaging
  • offset
  • order
  • orderby
  • p
  • page
  • page_id
  • paged
  • pagename
  • pb
  • perm
  • post
  • post__in
  • post__not_in
  • post_format
  • post_mime_type
  • post_status
  • post_tag
  • post_type
  • posts
  • posts_per_archive_page
  • posts_per_page
  • preview
  • robots
  • s
  • search
  • second
  • sentence
  • showposts
  • static
  • subpost
  • subpost_id
  • tag
  • tag__and
  • tag__in
  • tag__not_in
  • tag_id
  • tag_slug__and
  • tag_slug__in
  • taxonomy
  • tb
  • term
  • theme
  • type
  • w
  • withcomments
  • withoutcomments
  • year

WordPress Codex 日本語版も内容は同じですが参考にしてください。

まとめ

カスタム投稿タイプとは?からはじまって、長くなりましたが、全て説明が終わりました。

この記事だけでも、

  • カスタム投稿とは?
  • カスタムタクソノミーとは?
  • カテゴリーとタグの違いとは?
  • スラッグとは?
  • register_post_typeの使い方
  • register_taxonomyの使い方

まで全てわかると思います。コピペしてもいいですが、せめてもコメントアウト部分は読みながら理解して使っていくようにした方が開発する側にとって自分の為だと思います。

それでは。