12

高度なテーマを使用する tinyMCE エディターがあります。私はその高度なテーマで単純なレイアウトを使用しているので、tinyMCE が行っていることを深く理解しなくても、init() で独自のツールバーを定義できます。

私が抱えている問題は、エディターに見出し要素を追加するためのボタンがないことです。私はこのオプションを切実に必要としていますが、この件に関する実際的なアドバイスを見つけることができません.

私がやっていることはすべて、以下に貼り付けた tinymce.init() 関数内で行われます。

$("textarea.tinymce").not(".simple").tinymce({
            script_url : "/_lib/script/tiny_mce/tiny_mce.js",
            plugins : "wordcount,paste,spellchecker,table",
            theme : "advanced",
            theme_advanced_layout_manager : "SimpleLayout",
            theme_advanced_statusbar_location : "bottom",
            theme_advanced_toolbar_location : "top",
            theme_advanced_buttons1
                : "bold,italic,underline,strikethrough,|,sub,sup,|,charmap,|,forecolorpicker",
            theme_advanced_buttons2
                : "undo,redo,|,cut,copy,pastetext,pasteword,|,link,unlink,anchor,|,image,code",
            theme_advanced_buttons3 : "",
            theme_advanced_toolbar_align : "left",
            height : 480,
            apply_source_formatting : false,
            convert_fonts_to_spans : true
        });

私はjqueryプラグインを使用してtinyMCEにアクセスしています（これは私の質問とは何の関係もないと確信していますが、コードを説明しています）。

私が持っていた 1 つのアイデアは、theme_advanced_styles オプションを使用することでしたが、これで実際の見出しタグを挿入できるとは思いません。代わりに、スパンなどでマークアップをヘッダーのようにスタイル設定するだけです。

どんなアイデアでも大歓迎です。乾杯、J

4

3 に答える 3

18

これは、段落から見出し 1 を作成するボタンです。ボタンリストに「format1」を追加し、これをtinymce initに追加します

setup : function(ed){
    ed.addButton('formath1', // name to add to toolbar button list
    {
        title : 'Make h1', // tooltip text seen on mouseover
        image : 'http://myserver/ma_button_image.png',
        onclick : function()
        {
        ed.execCommand('FormatBlock', false, 'h1');
        }
    });
},
于 2012-01-05T13:16:36.623 に答える
3

見出しプラグインは、この問題の完璧な解決策であることがわかりました。受け入れられた答えも問題なく機能します。私たちが見つけた唯一の問題は、カーソルが見出しにあるときに見出しボタンがアクティブに表示されないため、ボタンをもう一度押して書式設定を元に戻すことが直感的ではないことです. 見出しプラグインは、アクティブな状態を正しく表示します。

于 2013-08-28T07:32:55.377 に答える