【解決済み】 カスタム投稿で『SWELL設定』を可能にする方法(カスタムフィールドを使ったメタデータ書き込み)

SWELL設定 カスタムフィールド メタデータ
お知らせ

text-ed

カスタム投稿の『SWELL設定』は、ver.2.6.7より実装されました。
カスタムタクソノミーでも『SWELL設定』ができるようになりましたので、詳しくは公式サイトの更新情報をご参照下さい。
https://swell-theme.com/update/10198/

以下、備忘録として、置いておきます。

『SWELL設定』のメタデータが、どのテーブルに、どのように格納されるか、参考にして下さい。


人気のWordPressテーマ「SWELL」でカスタム投稿タイプを作成したものの、編集画面に『SWELL設定』が表示されない為、個別記事での『アイキャッチ画像』『サイドバー』『タイトル位置』などのカスタマイズが行えず、お困りの方もたくさんおられると思います。

カスタムフィールドwp_postmetaを使えば、通常の投稿(post)と同じように、個別記事での表示 / 非表示 が設定できますので、参考にどうぞ。

↓ カスタム投稿タイプでは、『SWELL設定』が投稿画面に表示されないんですね
swell設定

目次

基本の手順

カスタム投稿タイプでも『SWELL設定』を使うには、次の二点が必要です。

  1. カスタム投稿タイプの作成時、『カスタムフィールド』を有効にする
  2. プラグイン『Advanced Custom Fields』をインストールする

カスタム投稿タイプで『カスタムフィールド』を有効にする

手動で有効にする

カスタム投稿タイプを手動で作成する場合。

functions.php 記述の一例

『product』という名前のカスタム投稿タイプを作成する場合。

supportsで、利用する機能を設定します。

「custom-fields」を追記することで、カスタムフィールドが使えるようになります。

'supports' => array( 'title', 'editor', 'custom-fields' )

function create_post_type() {
register_post_type( 'acme_product',
array(
'labels' => array(
'name' => __( 'Products' ),
'singular_name' => __( 'Product' )
),
'public' => true,
'has_archive' => true,
'supports' => array( 'title', 'editor', 'custom-fields' )
)
);
}
add_action( 'init', 'create_post_type' );

参照 → How to Add Custom Field to Custom Post Types in WordPress

プラグインを使う

プラグインを使って、カスタム投稿タイプを作成する方も多いと思います。

有名なのは、『Custom Post Type UI

当サイトでは、シンプルな『MB Custom Post Types & Custom Taxonomies』を使用しています。

Supports で Custom fields にチェックを入れれば、カスタムフィールドが有効になります。

※ functions.phpの記述だけで、カスタム投稿タイプとカスタムタクソノミーを作成する方法もありますが、複数作成して、あれこれアレンジするなら、素直にプラグインを使った方が賢明です。プラグインの方で、自動的に処理してくれるので。

カスタム投稿タイプ MB Custom Post Types & Custom Taxonomies カスタムフィールドを有効化

Advanced Custom Fieldsの設定

次に、プラグイン『Advanced Custom Fields』をインストールします。

https://wordpress.org/plugins/advanced-custom-fields/

カスタムフィールドを重視しない方には必要性を感じないかもしれませんが、投稿画面のカスタマイズに便利なので、これを機会に使い方を習得することをおすすめします。

インストールして、有効化したら、funcions.phpに追記します。

add_filter('acf/settings/remove_wp_meta_box', '__return_false', 20);

カスタム投稿タイプの編集画面を開いたら、画面上部の『表示オプション』を開き、カスタムフィールドを表示します。

投稿画面 表示オプション カスタムフィールドを有効化

SWELL設定のメタデータを調べる

カスタムフィールドの準備が出来たら、通常の投稿画面(post)を開き、SWELL設定のメタデータを調べます。

『タイトル位置』『ピックアップバナー』『サイドバー』『目次』など、適当に設定して、どのようなメタデータが生成されるか、確認します。

「コンテンツ上 / コンテンツ内』「表示 / 非表示」など、一通り設定したら、一度、『下書き保存』(もしくは更新)をして、データベースにメタデータを書き込みます。

すると、カスタムフィールドに下図のようなデータが現れます。

各投稿のSWELL設定は、データベースのwp_postmetaに「メタキー」「メタ値」として格納されるわけですね。

それと同じものを、カスタム投稿タイプのカスタムフィールドにも追記すれば、カスタム投稿でも通常の投稿と同じように『SWELL設定』を使うことができます。

「表示 / 非表示」のメタ値は、メタキーによって異なるので、しっかり確認すること。

「1」の反対は「空(メタキーを作らない)」です。「0」ではありません。

タイトル位置のみ、top / innner になります。

swell_meta_show_comments (コメント) hide / show
swell_meta_show_index(目次) hide / show
swell_meta_show_pickbnr(ピックアップバナー) hide / show
swell_meta_show_related(関連記事)hide / show
swell_meta_show_sidebar(サイドバー) hide / show
swell_meta_show_shumb(サムネイル) hide / show
swell_meta_ttl_pos(タイトル位置) top / inner
swell_meta_hide_autoad(自動広告を停止する) 1 / 空
swell_meta_hide_before_index(目次広告を隠す) 1 / 空
swell_meta_hide_sharebtn(シェアボタンを隠す) 1 / 空
swell_meta_show_widget_top(上部ウィジェットを隠す) 1 / 空
swell_meta_show_widget_bottom(下部ウィジェットを隠す) 1 / 空
swell_meta_hide_widget_cta(CTAウィジェットを隠す) 1 / 空
swell_meta_show_author(著者情報) show / hide

SWELL設定 カスタムフィールド メタデータ

投稿画面にメタデータ専用のBOXを設置する(ACF使用)

『Advanced Custom Fields』を使えば、メタデータ専用のBOXを設置することができます。

たとえば、カスタム投稿で、SWELL専用のカスタムCSSを頻回に使用する場合、いちいちカスタムフィールドにメタキーとメタ値を書き込むのは面倒ですよね。

そこでACFを使って、『カスタムCSS』のBOXを設置します。

『新規追加』で『フィールドグループ』を作成。

SWELLのカスタムCSSは、wp_postmeta の swell_meta_css としてデータベースに格納されます。

Advanced Custom Fields 新規フィールドグループの作成

『フィールド名』に、 swell_meta_css を設定。

ラベルやデフォルト値などは、お好みで。

Advanced Custom Fields カスタムフィールドの記入欄

カスタム投稿の編集画面に、下図のような専用BOXが表示されます。
ここにカスタムCSSを書き込むことで、swell_meta_css のメタ値として、wp_postmetaにデータが格納されるので、通常の投稿と同じように、カスタムCSSを記入することができます。

swell設定 カスタムCSS メタデータ 

記入後、投稿を『下書き保存』、もしくは『更新』すれば、自動的にメタデータとして追加されます。

swell設定 カスタムCSS メタデータ 

同じ要領で、『サイドバーの表示』『アイキャッチの表示』など、頻回に使用する場合は、専用BOXを作成すればOK。

いちいち、投稿画面のカスタムフィールドからメタ名やメタ値を記入しなくていいので、作業も簡素化されます。

メタ値の一括編集(Admin Column Pro を使用 )

カスタム投稿の数が多いと、いちいち投稿画面を開いて、編集するのも大変ですが、一つの方法として、有料プラグイン『Admin Column Pro』を使った一括編集の手順を紹介します。

詳しくは WordPressの管理画面を見やすくする『Admin Column Pro』

たとえば、カスタム投稿について、タイトル位置とアイキャッチ画像のデータを書き換えたい場合。

通常、カスタムフィールドの値は、投稿管理パネルには表示されません。

Admin Column Pro 投稿管理 メタデータ

『Admin Column Pro』を使えば、通常、管理パネルに表示できないカスタムフィールドのメタ値やタクソノミーなどをカラムに追加することができます。

Admin Column Pro カラムの設定

『タイトル位置』の場合、下図のように、『カスタムフィールド』→『swell_meta_ttl_pos』をカラムに追加します。

Admin Column Pro カラムに追加する

メタデータを変更したい投稿にチェックを入れ、管理画面の「一括編集」からデータを更新します。

Admin Column Pro メタデータ 一括編集

下図のように、投稿のメタデータを一括編集することができます。
プラグインを使えば、数十、数百の投稿も数秒で書き換わるので大変便利です。

Admin Column Pro メタデータ 一括編集

その他のプラグインについて

管理画面のカラムにカスタムフィールドの値を表示するプラグインは、有料版なら幾つか公開されています。

上記の『Advanced Custom Field Pro

Pro版に対応した『ACF Quick Edit Fields』などです。

筆者はAdmin Column Proを愛用していて、初心者にはこれが一番分かりやすいと思います。

有料版ですが、作業時間を大幅に短縮できるので、非常に重宝します。

たくさんの投稿管理が必要な方は試してみて下さい。
無料版はこちら https://wordpress.org/plugins/codepress-admin-columns/

データの格納場所を把握しよう

有料・無料にかかわらず、テーマ・テンプレートやプラグイン固有のデータは、多くの場合、wp_postmetaに格納されます。

phpMyAdminから、wp_postmetaにアクセスし、『検索』から、自分の調べたいメタキーを入力して、実行します。

下図の場合、『SWELL設定』で、「サイドバーを表示」= swell_meta_show_sidebar を検索します。

メタキーが分からない場合は、『LIKE %...%』 を使って、swell_meta_ で調べれば、wp_postmeta に格納されているSWELL設定のメタデータが全て表示されます。

wp_postmeta SWELL設定 メタキー

検索結果。

post_id から、『SWELL設定』で「サイドバー表示」を指定した投稿IDを調べることができます。

wp_postmeta swell_meta_show_sidebar SWELL設定 サイドバー

『編集』の画面から、データベースを直接編集することもできます。
この場合、show を hide に書き換えます。
馴れた人向きです。

データベース SWELL設定 直接編集

こちらもおすすめ

WordPressテーマ『SWELL』でテキストエディタを優先的に使う方法 ~ブロックエディタのデメリット
Swellはお洒落なブロックエディタが売りですが、テキスト系サイトを運営している方にはブロックエディタは不要だと思います。
その理由と、テキストエディタを優先的に使う裏技を紹介しています。

おわりに ~テーマ・テンプレートのメタデータについて学ぼう

テーマ・テンプレート『SWELL』は便利で、見映えもお洒落ですが、カスタム投稿が弱いのが難点です。

初めての方は、どこをどうカスタマイズすればいいのか分からなくて、困ってる人もたくさんいらっしゃるのではないでしょうか。

近年は、レンタルサーバーも、テーマ・テンプレートも、あまりに便利になり過ぎて、自分でデータベースを見ることもなければ、WordPressのファイル構造さえ知らない人も増えていると聞きます。

しかしながら、長期でWordPressを管理するなら、どのデータが、どこに格納されているのか、どこまでがカスタマイズ可能か、知っておくのは必須です。

『SWELL設定』に関しては、カスタムフィールドを使って、簡単にデータベースに書き込めるので、これを機会に、データベースの操作をマスターされてはいかがでしょうか

誰かにこっそり教えたい 👂
  • URLをコピーしました!
  • URLをコピーしました!
目次