Advanced Custom Fields(ACF)でフィールドの表示位置が変更できない時の解決方法

Advanced Custom Fields(ACF)でフィールドの表示位置が変更できない時の解決方法
2018年7月20日2019年9月9日

WordPressでカスタムフィールドを簡単に作成して管理できるプラグインといえば、Advanced Custom Fields(アドバンスド カスタムフィールズ)じゃないでしょうか。個人的にはWordPressの標準機能にして欲しいくらいです。

そんな私のお気に入りのAdvanced Custom Fieldsですが、以前からカスタムフィールドの表示位置が思い通りに動かせなくなる事が、たま~にありました。その都度「あれ?バグかな?」なんて思って、適当にやり過ごしてきたのですが、ちょっと今回はそうもいかず、ちゃんと直してみました。

同じ状況の方がいましたら、簡単に直せますのでやってみて下さい。

位置を変更しても反映されない

Advanced Custom Fieldsには、オプションに「位置」という項目があり、作成したカスタムフィールドの表示位置を変更できるようになっています。

この記事を書いている時点(2018-07-21)では

  1. High(after title)
  2. Normal(after content)
  3. Side

以上の3種類から選べます。(環境によって、日本語に翻訳されているかもしれません。)
上から、記事タイトルの下・記事本文の下・サイドバー表示ですね。

しかし、変更しても位置が変わらない。
たしか、カスタムフィールドの作成を始めた頃は、しっかりと変更できたはず・・・

ですが、何回試しても一向に変わらない。私の場合は2つに分けて作ったカスタムフィールドが、デフォルトのエディターの上下に分かれてしまいました・・・。

せっかくお客さんが使いやすいように作ってるのに「残念…」では済まない状況です。

原因はWordPress

原因はAdvanced Custom FieldsというよりWordPressの方でした。

投稿画面のボックスの配置はドラッグ&ドロップで自由に変更できますよね。この情報を、ユーザーごとに仕分けしてデータベースに記録しているんですね。だから、前に移動したボックスの位置が記憶されていて、使いやすいわけです。でも、今回はこのデータが干渉して、変更ができなくなっています。

カスタムフィールドを作成し始めた頃はこのデータが無かったので、意図通りに変更可能でした。

しかし、ちょこちょこボックスの配置を変えたりしたので、そのデータが干渉して、位置変更が上手く動かなくなっています。

投稿画面のボックスレイアウトが記録されている場所

「カスタムフィールドの位置さえ変更できりゃいいんだよ!」という方は読み飛ばして下さい。

どこに記録されているかというと、wp_usermetaテーブルに保存されていました。

user_idカラムとmeta_keyカラムを組み合わせて、ユーザーごとにボックスの配置を変更した情報が記録されています。

meta_keyの値が下の3タイプの行が、ACFの位置変更を邪魔しています。

  1. meta-box-order_post(投稿ページ)
  2. meta-box-order_page(固定ページ)
  3. meta-box-order_〇〇(カスタム投稿タイプ)

※3はカスタム投稿タイプを作成して使用している場合です。〇〇にはカスタム投稿タイプのスラッグが入ります。

これらは、全部あるわけではないようです。ボックスをドラッグしたりして配置を変更すると作成されます。

つまり、user_idが「1」のユーザーが見た投稿ページでのボックス配置は、user_idカラムの値が「1」でmeta_keyカラムの値が「meta-box-order_post」の行のmeta_valueカラムに記録されています。

フィールド位置の変更が正常に反映されるようにする方法

さて、実際にACFのカスタムフィールドが、オプションで設定した場所に表示されるようにする方法です。

以下のコードをコピーして、現在使用しているテーマのfunctions.phpに貼り付けて更新しましょう。

これで現在ログインしているユーザーの「固定ページ」と「通常投稿ページ」の編集画面のボックス配置データが消去され、カスタムフィールドの表示位置がちゃんと反映されるようになります。

カスタム投稿タイプを使用している場合

カスタム投稿タイプの投稿画面の場合は、下のコードをfunction内(波カッコ内の中)に追加しましょう。

『YOUR_CPT_SLUG』の部分は、カスタム投稿タイプのスラッグに置き換えて下さい。

例:スラッグがproductの場合

指定のユーザーのボックス配置データだけクリアする場合

コードの各行の以下の部分を、ユーザーのユーザーIDに変更してください。

 

例:ユーザーIDが16の場合

最後に

ちゃんと思い通りの位置にカスタムフィールドが表示されるようになったでしょうか?

このコードは、継続的にボックスの配置の記録をリセットしてしまいますので、カスタムフィールドの位置が、Advanced Custom Fieldsで設定した通りになる事を確認したら消しておきましょう。

参考サイト

Advanced Custom Fieldsの公式フォーラムの以下のページが参考になりました。

https://support.advancedcustomfields.com/forums/topic/position-high-after-title-not-working/

One Reply to “Advanced Custom Fields(ACF)でフィールドの表示位置が変更できない時の解決方法”

Comments are closed for this post.

関連のある記事

ACFのカスタムフィールドをクイック編集できるプラグイン「ACF Quick Edit Fields」

ACFのカスタムフィールドをクイック編集できるプラグイン「ACF Quick Edit Fields」

記事を読む

Advanced Custom Fieldsでセレクトボックスなどの選択肢を動的に設定する方法

Advanced Custom Fieldsでセレクトボックスなどの選択肢を動的に設定する方法

記事を読む

Advanced Custom Fieldsでチェックボックスの作成と値の利用方法【ワードプレス】

Advanced Custom Fieldsでのチェックボックスの作成と値の利用方法【ワードプレス】

記事を読む

Advanced Custom Fieldsのカスタムフィールド入力値の出力や利用の方法

Advanced Custom Fieldsのカスタムフィールド入力値の出力や利用の方法

記事を読む

Advanced Custom Fieldsでラジオボタンを作成し値を出力する方法

Advanced Custom Fieldsでラジオボタンを作成し値を出力する方法

記事を読む

Advanced Custom Fieldsのフィールドグループの作成・設定方法

Advanced Custom Fieldsのフィールドグループの作成・設定方法

記事を読む


目次へ
Generic selectors
Exact matches only
Search in title
Search in content
Search in posts
Search in pages