Simplicityのビジュアルエディターのカスタマイズについて

Simplicity1.7.7より、ビジュアルエディターのスタイルを変更しました。

エディターのスタイルは、Simplicityの投稿ページのデフォルトスタイルに似せたものにしました。

Simplicityのビジュアルエディタースタイル

ビジュアルエディターの設定

ただ、デフォルトのエディタースタイルが変わってしまうと、以前のスタイルに慣れている方は、「書きにくい」となってしまうかもしれません。

ですので、「外観→カスタマイズ→管理画面」の「ビジュアルエディターにSimplicityスタイルを適用」のチェックを外すだけでWordpressデフォルトのビジュアルエディターになるようになっています。

ビジュアルエディターにSimplicityスタイルを適用 [5]

子テーマでの設定

「Simplicity子テーマ(無印)20150707」より、子テーマ内の「editor-style.css」にスタイルを書くことで、ビジュアルエディターのスタイルを変更できるようにしました。

ただ、「Simplicity子テーマ(無印)20150707」以前のバージョンを利用している場合は、その機能を利用できません。

以前のバージョンで、同様の機能を利用するには、以下の手順を行ってください。

  1. functions.php内に「add_editor_style();」と追記
  2. 子テーマフォルダ内に「editor-style.css」ファイルを作成
  3. 「editor-style.css」ファイルにスタイルを書く

詳しい仕様は、以下を参照してください。

Wordpressの記事を作成するとき、投稿画面のビジュアルエディターを用いている方も多いかと思います。 ビジュアルエディターは、デフォルトの状態だと、フォントサイズも小さめですし、WindowsデフォルトではMSゴシックが選択されま

まとめ

ビジュアルエディターの見た目を、実際の投稿ページの見た目と似せることにより、個人的には編集がかなりしやすくなったように思います。

また、投稿ページの実際のでき上がりを想像しながら、記事を書けるようになったと思います。

スポンサーリンク
アドセンス(大)

コメント

  1. 卯月廿六 より:

    WordPress初心者でSimplicity2でライブドアブログからの移行のために構築中です。

    とっても初歩的な質問なのですが、ヘッダー画像の大きさをカスタマイズの説明で、エディターで、functions.phpと、テーマファイルのstyle.cssを開くと有りますがカスタマイズに際してはアップロード前のzipを解凍して該当のファイルを開いて修正等を加えて終ったら再度圧縮してアップロードし直すのでしょうか?
    その辺りも勉強不足で明後日に一応入門書が届く予定ですが、良かったらご教授頂けたら幸いです。

    • わいひら わいひら より:

      ヘッダー画像の大きさをカスタマイズの説明で、エディターで、functions.phpと、テーマファイルのstyle.cssを開くと有りますが

      当記事は、ビジュアルエディターのスタイルのカスタマイズについて書かれたページページです。
      「ヘッダー画像の大きさをカスタマイズの説明」というのはどこのページのことでしょうか?
      できればURLを掲載していただければと思います。