2019.02.06

Marker AnimationプラグインをGutenbergエディタに対応させました

DropDown

Gutenberg

RichText

リッチテキスト

Marker Animationプラグインは蛍光ペンを引くようなアニメーションを設定できるようにするWordPressのプラグインです。

ツールバーにボタンを追加

Gutenbergのツールバーにボタンを追加する方法は以前紹介しました。

下線を引いたり文字色を変えたりするのに便利な機能を追加することができるのですが、いくつもボタンを追加すると横に長くなってしまいます。

Marker Animationプラグインではマーカーの色や太さ、マーカーを引く速さなどをセットにした設定をいくつも保存できるため、ドロップダウン形式でまとまるようにボタンを追加しました。

引いたマーカーと同じ色で表示できるようにしました。

Marker Animationは色を自由に設定できるため、あらかじめ決められたクラスにCSSで色を付けておくことができません。

後から設定を変えてもその色になるような仕組みになっています。

Gutenberg側にバグと思われる動作があり、設定で追加したものを削除したとき等にエディタ側のみでおかしな動きをする可能性があります。

WordPress v5.2 でこの現象は解消されました。