NeGiMeMo.net

ねぎさんのメモ帳。日常・メモ・ときどきWordPress。

投稿タイプごとに管理画面で異なる editor-style を適用する

bell賞味期限切れコンテンツ

この記事は公開または最終更新から1038日くらい経過しています。
このメッセージが表示されている記事(特にプログラミング系)は情報が古くなっている可能性があるので注意して下さい。

こんにちは。

毎日WordPressのしごとをやってると、たまによくわからない仕様が届きます。

今回は「投稿・固定ページ・カスタム投稿の全てで見出しタグの装飾が異なる」という面倒くさい状況に加え、「それぞれに応じたエディタスタイルをビジュアルエディタに適用してもらいたい」というものでした。

やりたいことを整理し、仕組みを考える

さっきも言ったとおりで、投稿タイプ毎に異なるエディタスタイルを定義したいのです。

そのためには、

  1. 現在開いてるエディタが編集しようとしている投稿タイプを調べる
  2. 1で調べた情報をもとに異なるエディタスタイル用CSSを読み込ませる

というふうにすればOKそうですね。

まずは投稿タイプを調べる方法ですが、これは「get_current_screen()」という関数が有りますのでこれを使います。

この関数は WP Screen オブジェクトか、失敗した場合は null を返します。

実際にどんな内容が返ってくるかは Function Reference/get current screen « WordPress Codex に詳しく載っています。

今回は現在の投稿タイプで振り分けるので、そのうちの「post_type」を利用します。
まとめるとこんな感じです。

続いて、エディタスタイルを読み込ませる方法ですが、これは add_editor_style() でやってることをそのまま再現すれば良さそうです。

Codexで調べてみると、どうやら theme.php のなかに有るらしいです。これがその部分。

 ここから必要なコードを拝借してくれば良さげですね。

フックを作る

ということでさっきの振り分けと組合せて出来上がったのがこちら

これで投稿タイプごとに異なるCSSを読み込ませることができますので、場所ごとに見た目が異なるスタイルを適用したい場合でもビジュアルエディタ側もそれに合わせることができそうです。

 

 

 

 

おまけ。

なんかこんな面倒臭いことをしなくても、分岐の後はそれぞれに応じて add_editor_style() を呼んじゃってもOKだったようです。

Killer hacks to enhance WordPress editor | CatsWhoCode.com

はやくいってよねぇ〜(怪傑ギリジン風に)

TAGS
  • ryo sakuragi

    クリスマスに失礼します。
    初歩的な質問だと思いますが、「editor-style-post.css」などのcssファイルはどこに置けばいいのでしょうか。なにとぞよろしくお願い致します。メリークリスマス!!

    • negi

      ryo sakuragiさん、コメントありがとうございます。
      読み込ませるエディタスタイル用CSSファイルはテーマフォルダの中、 functions.php と同じ階層に設置すれば大丈夫だったはずです。
      それでは良いクリスマスを!

Pingback / Trackback