Question

我有一个使用高级主题的tinyMCE编辑器。我正在使用该高级主题的简单布局，因此我可以在init（）上定义自己的工具栏，而无需深入了解tinyMCE正在做什么。

我遇到的问题是我的编辑器没有添加标题元素的按钮。我迫切需要这个选项，但没有找到关于这个问题的实用建议。

我正在做的一切都发生在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（我确定这与我的问题无关，但它解释了代码）。

我有一个想法是使用theme_advanced_styles选项，但我不认为这会允许我插入实际的标题标签，而只是用标记来标记我的标记，看起来像标题。

任何想法都非常感激。干杯， Ĵ

Answer 1

这是一个按钮，它会在一个段落中生成一个heading1。将'formath1'添加到您的按钮列表并将其添加到您的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');
        }
    });
},

Answer 2

使用隐式样式添加标题和其他元素可以通过formatselect实例theme: 'advanced'列表添加theme_advanced_buttons_[1-3]：

tinyMCE.init({
    mode : 'textareas',
    theme : 'advanced',
    editor_selector : 'mceAdvanced',
    plugins: 'autolink,inlinepopups',
    theme_advanced_blockformats: 'p,address,pre,h1,h2,h3,h4,h5,h6',
    theme_advanced_buttons1: 'formatselect,|,bold,italic,removeformat',
    theme_advanced_buttons2: '',
    theme_advanced_buttons3: '',
    theme_advanced_toolbar_location: 'top',
    theme_advanced_statusbar_location: 'bottom',
    theme_advanced_resizing: true,
    theme_advanced_resize_horizontal: false,
    relative_urls: false
});

我多余地包含了仅用于演示的默认值，但TinyMCE Wiki表示，因为 2010-10-28 此元素列表可以减少或添加到包含以下元素的元素： / p>

 `p,div,h1,h2,h3,h4,h5,h6,blockquote,dt,dd,code,samp`

Answer 3

我发现heading plugin只是这个问题的完美解决方案。接受的答案也可以。我们发现的唯一问题是，当光标位于标题处时，标题按钮不会显示为活动状态，从而使您无法再次按下该按钮以恢复格式设置。标题插件正确显示活动状态。

如何使用高级主题，简单布局将标题（h1，h2 ...）按钮添加到tinyMCE？

3 个答案: