Ubuntu

WordPress 高度な設定を開いたままにしたい

アンカーや追加CSSクラスをちょいちょい設定する関係で、ブロックエディターの高度な設定を開いたままにしたいと考えた。
この高度な設定は、英語だと「Advanced」とだけ表示される。



広告


こちらで同じことを聞いている方がいた。
WordPress.org Support / Can I expand the “Advanced” tab in Gutenberg blocks by default?

いやー、そうですよね、ちょっと手間が掛かります。

解決策

これに1つの解決策を提示してくださる方が!
Github Gist / brandonjp / block-editor-open-advanced-on-mouseenter-code-snippets.json

Advancedを開いたままにすることはできないけれど、マウスが右ペインに入ると勝手に「高度な設定」が開く。
開いたままになるわけではないけれど、クリックしてからスクロールするよりはだいぶ簡単。

実装

提示されているのはソースコードで、それをどうにかしてWordPressに組み込まなければならない。
どうやればいいかなーとディレクトリを眺めていたのだが、結論からすると、

<WordPress home>/wp-content/themes/cocoon-child-master/functions.php

に提供していただいている関数を貼り付ければOK。

具体的には…このサイトでは、テーマに「Cocoon」を使わせていただいている

Cocoonは、SEO・高速化・モバイルフレンドリーに最適化した無料テーマです。
見た目はシンプルですが、初めての方でも感覚的に使えるように
便利な機能を織り込んで作りました。
100%GPLテーマなので自由にご利用いただけます。

WordPress無料テーマ Coccon より抜粋

WordPressがよく分かっていないろっひーでも、簡単かつ快適に使える素晴らしいテーマである。

今回の場合、block-editor-open-advanced-on-mouseenter-code-snippets.phpのソースコードから、

/**
 * Block Editor: Open Advanced on Mouseenter

から

add_action( 'admin_print_footer_scripts', 'block_editor_open_advanced_on_mouseenter' );

までをコピーしてくる。

それを、Cocoonに用意されているfunctions.phpに貼り付ける。
<WordPress home>/wp-content/themes/cocoon-child-master/functions.php

<?php //子テーマ用関数
if ( !defined( 'ABSPATH' ) ) exit;

//子テーマ用のビジュアルエディタースタイルを適用
add_editor_style();

//以下に子テーマ用の関数を書く

/**
 * Block Editor: Open Advanced on Mouseenter

…

add_action( 'admin_print_footer_scripts', 'block_editor_open_advanced_on_mouseenter' );

一旦エディタを閉じて、もう一度エディタを表示させれば動き出す。
たったこれだけ。

さいごに

アンカーや追加CSSクラスの設定をもっと簡単にしたい、と思ったとき、もう少し違ったアプローチもあるのかもしれない。
それはそれでゆっくりと探していこう。

広告

コメントはこちらから お気軽にどうぞ ~ 投稿に関するご意見・感想・他