サポート » 使い方全般 » ビジュアルエディタ(tinyMCE)のドロップダウンメニューについて

  • 解決済 doggs

    (@doggs)


    ビジュアルエディタにドロップダウンメニューを実装したく、

    https://codex.wordpress.org/TinyMCE_Custom_Styles

    を参考にメニューの設置は完了いたしました。

    メニューのblockの部分をh2,pなど
    ビジュアルエディタに最初からある「段落メニュー」にあるものは
    機能しないようです。(指定したブロック要素で囲まれません。)

    divなど「段落メニュー」にないものは期待通りに機能します。

    なお、ボタンを非表示にしても状況は変わりません。
    プラグイン停止、複数のテーマでも状況変化なしです。

    ・「段落メニュー」との重複設定は出来るか
    ・または「段落メニュー」を無効にすることは出来るか

    ご教示いただけますと幸いです。
    何卒、よろしくお願いいたします。

8件の返信を表示中 - 1 - 8件目 (全8件中)
  • CG

    (@du-bist-der-lenz)

    最新バージョンでも、「段落メニュー」と連動できていて問題は見られませんでした。

    TinyMCE廻りはバージョン4.3で変更があったんでしたかね。

    トピック投稿者 doggs

    (@doggs)

    CG (@du-bist-der-lenz)さん
    ご返信ありがとうございます。

    私もここまでは確認が出来ております。
    実際に適用をしようとすると、
    入力済みの文字にスタイルに変化が起きず。

    テキストエディタで確認をすると
    やはりh2などが適用されておりません。

    こんにちは

    どのようなコードを書いたのか具体的に教えていただけますか。

    ちなみに下記のようなコードでスタイルフォーマットに h2 を追加することはできると思います。

    function my_mce_before_init_insert_formats( $init_array ) {
    	$style_formats = array(
    		array(
    			'title' => '見出し2',
    			'block' => 'h2',
    			'classes' => 'midashi2',
    		),
    	);  
    	$init_array['style_formats'] = json_encode( $style_formats );
    	return $init_array;
    }
    add_filter( 'tiny_mce_before_init', 'my_mce_before_init_insert_formats' );
    トピック投稿者 doggs

    (@doggs)

    ishitakaさん、ご返信ありがとうございます。

    具体的なコードは下記となります。

    // Callback function to filter the MCE settings
    function my_mce_before_init_insert_formats( $init_array ) {  
    	// Define the style_formats array
    	$style_formats = array(  
    		// Each array child is a format with it's own settings
    		array(  
    			'title' => '.translation',  
    			'block' => 'h2',  
    			'classes' => 'translation',
    			'wrapper' => true,
    			
    		),  
    		array(  
    			'title' => '⇠.rtl',  
    			'block' => 'blockquote',  
    			'classes' => 'rtl',
    			'wrapper' => true,
    		),
    		array(  
    			'title' => '.ltr⇢',  
    			'block' => 'blockquote',  
    			'classes' => 'ltr',
    			'wrapper' => true,
    		),
    	);  
    	// Insert the array, JSON ENCODED, into 'style_formats'
    	$init_array['style_formats'] = json_encode( $style_formats );  
    	
    	return $init_array;  
      
    } 
    // Attach callback to 'tiny_mce_before_init' 
    add_filter( 'tiny_mce_before_init', 'my_mce_before_init_insert_formats' );  

    下記ページのコード最初のblockの部分をh2に変更いたしました。
    https://codex.wordpress.org/TinyMCE_Custom_Styles

    ドロップダウンメニューには表示されるのですが、
    h2の部分を選択をしても、文章に適用がされないような状況です。

    'wrapper' => true,

    'wrapper' => false,

    では、どうでしょうか?

    トピック投稿者 doggs

    (@doggs)

    ishitakaさん

    上記にて改善いたしました。
    ありがとうございます。
    大変助かりました。

    wrapper – State that tells that the current format is a container format for block elements. For example a div wrapper or blockquote.

    ブロック要素のcontainerだったらtrue
    h2にはブロック要素がいれられないので、falseにする必要があったということでしょうか。

    h2 はブロック要素なので本来であれば wrapper は true なのかも知れませんが・・・よく分かりません (^^;

    トピック投稿者 doggs

    (@doggs)

    ishitakaさん

    熟練の勘ということですね!
    本当にありがとうございます。

8件の返信を表示中 - 1 - 8件目 (全8件中)
  • トピック「ビジュアルエディタ(tinyMCE)のドロップダウンメニューについて」には新たに返信することはできません。