WordPress

カスタム投稿タイプでアイキャッチが有効にならない時の2つのチェックポイント

この記事にたどり着いたあなたはテーマを自作しているのではないでしょうか?

そして、カスタム投稿タイプの記事の投稿画面で右側にアイキャッチの登録メニューが出てこないので、表示させる方法を探している。そうだとしたらこの記事が、今抱えているアイキャッチの問題を解決してくれるのでそのまま読み進めてください。

それでは、早速、解決策を見ていきましょう。

カスタム投稿タイプでアイキャッチが有効にならない時のチェックポイント

アイキャッチ画像を有効にするには、「テーマのための関数 (functions.php)」で2つの設定が必要です。

WordPressでアイキャッチの機能を有効にさせる

1つ目は、「テーマのための関数」の中に下記のコードを記入して、アイキャッチそのものを有効にさせる必要があります。

add_theme_support( 'post-thumbnails', array( 'post','page' ) );

上記のコードは、「投稿」と「固定ページ」でアイキャッチを有効にした場合です。勘のいい方はお気づきだと思いますが、アイキャッチを有効にするときは、「どの投稿」で有効にするかも合わせて指定しなければ行けません。もしも、カスタム投稿タイプでアイキャッチを有効にしたい場合は、ここにカスタム投稿タイプのスラッグを追加します。

例えば、”example”というスラッグだとしたら下記のようになります。

add_theme_support( 'post-thumbnails', array( 'post','page','example' ) );

カスタム投稿タイプのsupportsにアイキャッチを追加する

2つ目は、カスタム投稿タイプを追加したときの設定です。以前の記事で、カスタム投稿タイプを「テーマのための関数 (functions.php)」で追加する方法についてご紹介しました。

下記は、そのときにご紹介したコードです。

PHP

/* カスタム投稿タイプの追加 */
add_action('init', 'create_post_type');
function create_post_type() {
  $args = array(
    'label'               => 'サンプル投稿', // カスタム投稿タイプ名
    'public'              => true,          // カスタム投稿タイプの公開設定
    'has_archive'         => true,          // アーカイブの有無
    'hierarchical'        => false,         // 階層の有無
    'menu_position'       => 5,             // メニューの位置
    'supports'            => array(
                            'title',        // 編集ページのタイトル
                            'editor',       // 編集ページの本文エディタ
                            'thumbnail',    // 編集ページのアイキャッチ画像
                            'custom-fields',    // 編集ページのカスタムフィルド
      )
  );
  register_post_type(       'example',      // カスタム投稿タイプのスラッグ
  $args);
}

このコードのsupportsという行に注目してください。supportsというのは、記事の編集画面で表示させたいメニューを指定する場所です。ここに'thumbnail'が入っていないとアイキャッチが投稿の編集画面でメニューとして表示されません。

以上の2つの設定をしていただければ無事にカスタム投稿タイプでアイキャッチの設定ができるようになります。以上がカスタム投稿タイプでアイキャッチが有効にならない時の2つのチェックポイントでした。

最近の記事

  1. CSS

    擬似クラス「:first-child」「:last-child」はどうして効かな…
  2. WordPress

    WordPressの立ち上げからサイト構築までの初期手順
  3. CSS

    レスポンシブウェブデザインの基本|メディアクリエリの設定
  4. CSS

    CSS|中央寄せが効かないときは・・・
  5. CSS

    要素の配置が簡単に決まるFlexboxの使い方
PAGE TOP