★フォーマットのh1,h2を削除する

http://www.webopixel.net/wordpress/211.html

 

フォーマットのh1,h2を削除する

 

ビジュアルエディタのアドバンスドツールバーには「フォーマット」というセレクターがあり、ここからhxに該当する見出しや段落などを指定することができます。
これは便利なんですがだいたいブログはh1がブログタイトルで、h2が記事のタイトル名で、記事内で使用するのはh3くらいからなんじゃないかと思います。

 

htmlに詳しくない人はそういうことを知らずに「見出し1」とか選択してしまいそう。
ということで「h1」「h2」を選択できないようにしましょう。

 

functions.php

function custom_editor_settings( $initArray ){
 // WordPress3くらい
 //$initArray['theme_advanced_blockformats'] = 'p,address,pre,code,h3,h4,h5,h6';
 // WordPress4から
 $initArray['block_formats'] = "見出し3=h3; 見出し4=h4; 見出し5=h5; 段落=p; グループ=div;";
 return $initArray;
}
add_filter( 'tiny_mce_before_init', 'custom_editor_settings' );

 

「$initArray[‘theme_advanced_blockformats’]」にh1、h2を除く形で指定します。

場、ばっちりです。

 

 

「リンクの挿入」ボタンにカスタムクラス設定する

ここにLightBoxなどオリジナルのクラスを指定できるようになれば便利ですね。

「リンクの挿入」ボタンにカスタムクラス設定する

functions.php

function custom_editor_settings( $initArray ){
 $initArray['theme_advanced_styles'] = "Lightbox=lightbox;Blank=blank";
 return $initArray;
}
add_filter( 'tiny_mce_before_init', 'custom_editor_settings' );

$initArray[‘theme_advanced_styles’]に「Lightbox=lightbox」と記述します。
複数指定する場合は「;」で区切ってどんどん追加していきます。

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

 

ビジュアルエディタの初期に配置されているボタンは厳選されて配置されていますね。
このタグのボタンがほしいという場合追加することができます。

ールバーにボタンを追加する

たとえばツールバーの3列目に「hr」と「fontsizeselect(フォントサイズ変更)」のボタンを追加する場合は次のようになります。

functions.php

function custom_editor_settings( $initArray ){
 $initArray['theme_advanced_buttons3'] = 'hr,fontsizeselect';
 return $initArray;
}
add_filter( 'tiny_mce_before_init', 'custom_editor_settings' );

 

追加できるボタンは他にもいろいろありますので、下記のリファレンスを参考にしてください。

TinyMCE:Control reference

 

iframe削除させない

 

コードで「iframe」を書いても、ビジュアルエディタに切り替えると「iframe」は消えてしまいます。
xhtmlには非推奨だったりセキュリティ的にいろいろあるようですが、どうしても使用したい場合は下記のようにします。

functions.php

function custom_editor_settings( $initArray ){
 $initArray['extended_valid_elements'] = "iframe[id|class|title|style|align|frameborder|height|longdesc|marginheight|marginwidth|name|scrolling|src|width]";
 return $initArray;
}
add_filter( 'tiny_mce_before_init', 'custom_editor_settings' );

 

[参考サイト]
Customize WordPress WYSIWYG Editor
Make the Visual Editor Actually WYSIWYG