WordPress5 カスタム投稿タイプ、カスタムタクソノミー(カテゴリ・タグ)をgutenbergに対応する

  • ---

    LINEで送る
  • -

    ブックマーク
  • -

    pocket
  • -

    rss
他言語サイト
翻訳はみつかりませんでした
wordpress image
イラストACの画像をもとに加工しています。

カスタム投稿タイプやカスタムタクソノミー(カスタムのカテゴリやタグ)をWordPress 5の標準エディタgutenbergで使うための方法です。

あまりにもかんたんです。1~2か所設定を変更するだけです。

テーマやプラグインのカスタム投稿タイプやカスタムタクソノミー(カテゴリやタグ)で、WordPress 5から採用された新しいエディタgutenbergに対応していないときがあります。

  • カスタム投稿タイプの編集画面がgutenbergで開かない
  • gutenbergの編集画面でカスタムカテゴリ・タグが設定項目に表示されない

など焦る人もいるでしょう。

Custom Post Tpye UIプラグインを使っている場合は、プラグインの設定を変更するだけで対応できます。

-> Custom Post Type UIをgutenbergに対応させる

対応させる作業はとてもかんたんです。数秒で終わります。ただし、.phpファイルを編集します。作業をするときはバックアップを取ってからしましょう。

カスタムタクソノミー

register_taxonomy()を使っているソースコードを検索機能を使って探します。

register taxonomy
function register_my_taxes_category_test() {
	$labels = array(
		"name" => __( "test category", "origin_theme" ),
		"singular_name" => __( "test category", "origin_theme" ),
	);

	$args = array(
		"label" => __( "test category", "origin_theme" ),
		"labels" => $labels,
		"public" => true,
		"publicly_queryable" => true,
		"hierarchical" => true,
		"show_ui" => true,
		"show_in_menu" => true,
		"show_in_nav_menus" => true,
		"query_var" => true,
		"rewrite" => array( 'slug' => 'category_test', 'with_front' => true, ),
		"show_admin_column" => true,
		"show_in_rest" => true,
		"rest_base" => "category_group",
		"rest_controller_class" => "WP_REST_Terms_Controller",
		"show_in_quick_edit" => false,
		);
	register_taxonomy( "category_test", array( "post" ), $args );
}
add_action( 'init', 'register_my_taxes_category_test' );

タクソノミーをつくるときに設定する項目(show_in_rest)がfalseになっていませんか?または未設定ではないですか?

これをtrueにするだけです。未設定の場合は『"show_in_rest" => true,』を追加してください。たったこれだけです。

カスタム投稿タイプ

カスタム投稿タイプの場合は、register_post_type()を使っているソースコードを検索機能を使って探します。

register post type
function register_my_cpts_test() {
	$labels = array(
		"name" => __( "test", "origin_theme" ),
		"singular_name" => __( "test", "origin_theme" ),
		"menu_name" => __( "test", "origin_theme" ),
	);

	$args = array(
		"label" => __( "test", "origin_theme" ),
		"labels" => $labels,
		"description" => "",
		"public" => true,
		"publicly_queryable" => true,
		"show_ui" => true,
		"delete_with_user" => false,
		"show_in_rest" => true,
		"rest_base" => "",
		"rest_controller_class" => "WP_REST_Posts_Controller",
		"has_archive" => false,
		"show_in_menu" => true,
		"show_in_nav_menus" => true,
		"exclude_from_search" => false,
		"capability_type" => "post",
		"map_meta_cap" => true,
		"hierarchical" => false,
		"rewrite" => array( "slug" => "test", "with_front" => true ),
		"query_var" => true,
		"supports" => array( "title", "editor", "thumbnail" ),
		"taxonomies" => array( "category", "post_tag" ),
	);

	register_post_type( "test", $args );
}
add_action( 'init', 'register_my_cpts_test' );

タクソノミーと同じように『"show_in_rest" => true,』を設定します。

それともうひとつ、設定項目のsupportsを見てください。"editor"は入ってますか?

これがないとカスタム投稿タイプでgutenbergは使えません。supportsが未設定の場合はデフォルトで"editor"が設定されるのでそのままでいいです。

たったこれだけです。ちなみに、Classic Editorプラグインを使っていて旧エディタと併用して使う場合、新旧エディタ両方とも使えます。

gutenbergでカスタム投稿タイプ・タクソノミー(カテゴリ・タグ)を使うには、

REST APIを有効化

する。

REST APIとは

Representational State Transferのことで、URLを指定すると常に同じ結果を返す処理をおこなうAPIです。

URLはユニークでそのまま決まった処理のリクエストになるので、シンプルでわかりやすい特長があります。処理を受けるサーバーでも、URLを見れば何をすれば分かるのでシンプルで実装しやすいです。

結果は、HTML, XML, JSONなどで返します。

最近は、Webサービスで提供されるAPIはREST APIが多いです。

Facebook, Twitterなどもそうですね?また、ECサイトを構築している人などは在庫管理などのWebサービスと連携するときにもREST APIを使います。

Webサービスでは情報取得、情報の追加・更新・削除などのAPIが提供されることが多いですが、その説明にURLを指定するようになっているものはREST APIであることが多いです。

REST APIの特長を1つ挙げれば『セッションを使わない』です。

セッションを使わず1リクエストで処理が完結するため、アクセス数やリクエスト数の多いサイトに適しています。

SNSなどはとくにそうですね?

セッションハイジャックがないので、情報漏えいや不正なリクエストも防ぐことができます。

-> くわしい内容 Wikipedia

WordPressの本
post-cta-image

たくさんあるなかで、WordPressの基本が学べる、目的別に学べる本を選びました。

  • WordPressの基本
  • Webサイト作成から運用まで全体的に学ぶ
  • ブログサイトの運営からサイトの収益化を学ぶ
  • サイト作成・運営 + 集客の方法を学ぶ
  • WordPressからPHPプログラミングを学ぶ
  • 最新のWordPress(バージョン5)に対応した本

の7冊です。どうしてもネット上で調べて勉強するのが苦手という人におすすめです。

この内容をモノにすればほかの本は必要ありません。あとは自分の力で、書籍を使わずにインターネット上にある情報だけで学んでいけます。


WordPressの本7選

SNSでも記事を配信しています。
コメントを残す

*

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

top
この記事を気に入ったらぜひシェアも!!