【ビジュアル解説】Diver動くマーカーの設定方法

Diverに実装されているはずの動くマーカー。

使おうと思っても見当たらなかったので、自分で設定してみました。

同じような人もいるのでは？

この記事では動くマーカーの設定方法をお伝えします。

プラグインで「Advanced Editor Tools (旧名 TinyMCE Advanced)」をインストール

WordPressの管理画面にログインします。

メニューの下部にある「プラグイン＞新規追加」をクリックします。

検索窓に「Advanced Editor Tools」または「TinyMCE Advanced」と入力します。

「Advanced Editor Tools」が表示されたら「今すぐインストール」をクリックします。

※上記キャプチャーはすでにインストール済みのため「有効」の表示になっています。

Advanced Editor Toolsで、スタイル（動くマーカー）を設定

インストールが終わったり

「設定＞Advanced Editor Tools（TinyMCE Advanced）」をクリックします。

タブを「ブロックエディター」から「旧エディター」に切り替えます。

「使用しないボタン」の中にある「スタイル」を「フォントサイズ」の右横にドラッグ&ドロップします。

「変更を保存」をクリックします。

「投稿＞新規投稿」に移動して、「スタイル」の中に「動くマーカー」が表示されていれば完了です。

動くマーカーの使い方

本文にテキストを入力します。

動くマーカーを適用したい文字を選択します。

選択したらスタイルの中から適用したい「動くマーカー」を選択します。

黄色いマーカーを適用したい場合は、「動くマーカー（黄）」を選択します。

太字になっていれば設定完了です。

同じようにマーカーを設定して、プレビューしてみるとこんなふうに表示されます。

動くマーカーをうまく使って読みやすいコンテンツを提供しましょ〜！