TinyMCE 工具栏位置

Question

如何在指定的位置（具有特定ID的div）上显示工具栏？

我尝试了theme_advanced_toolbar_location:“external”并设置“mceExternalToolbar”的位置（如此处建议：TinyMCE - external toolbar position），但我并不喜欢这个解决方案，因为它使用固定定位...是否有一种选择来放置div。

文档中对于theme_advanced_toolbar_location的说明：

"..将工具栏添加到DIV元素中，并将该DIV的类设置为“mceExternalToolbar”....但不能更改div。也许有一种可能改变这段代码？

敬礼， Stefan

- Stefan

Answer 1

这对我来说是一个问题，几个月前我遇到了这个问题。你需要做的就是将外部工具栏移动到想要的位置。我在我的插件中编写了一个函数。在我的页面上，我创建了一个带有“externalToolbarWrapper”类的div，其中我插入了工具栏。以下是该函数。您可能需要稍微调整一下，但我认为它会对您有所帮助。

    showExternalToolbar: function(){

        if (this.editor.getParam('theme_advanced_toolbar_location') != 'external') return;

        if (!document.getElementById('externalToolbarWrapper')) $(document.body).prepend('<div id="externalToolbarWrapper"></div>');

        var $toolbar = $('#'+this.editor.id + '_external');

        // inserts the external toolbar in the external wrapper
        $('#externalToolbarWrapper').append('<div id="replacementDiv"></div>');

        $('#replacementDiv').replaceWith($toolbar.show());
        $toolbar.css('top','0px');
        $toolbar.css('display','block');

        $('#' + this.editor.id + '_external_close').remove();
        $('#' + this.editor.id +'_toolbargroup').css('width', innerWidth || 800); // innerwidth is an integer value
    },

更新：

你应该在 onInit 中调用它（在这里使用 setup 配置参数）。

   setup : function(ed) {
      ed.onInit.add(function(ed) {
          // place your code here
      });
   },

- Thariama

---

不，你要么将此函数放入自己的插件中，要么使用设置配置参数将其包含到你的tinymce初始化函数中。 - Thariama

好的，我对tinymce还很陌生。有没有tinymce插件开发的说明？ - Stefan

那个没问题，创建插件的官方指南可以在这里找到：http://www.tinymce.com/wiki.php/Creating_a_plugin。如果您不想创建自己的插件，设置参数可能已经足够了：http://www.tinymce.com/wiki.php/Configuration:setup - Thariama

谢谢，我必须更好地了解tinymce，niceEdit功能太少，而且没有进一步的开发... :/ - Stefan

需要一些时间来适应，但大部分情况下它是值得的。 - Thariama