TinyMCE工具栏位置 [英] TinyMCE Toolbar location
问题描述
工具栏如何显示在已定义的位置(具有特定ID的div)?
How can the Toolbar be displayed on a defined Place (div with specific id)?
我尝试了theme_advanced_toolbar_location:external并设置mceExternalToolbar的位置(这里建议: TinyMCE - 外部工具栏位置)但不太喜欢这个解决方案因为它使用固定定位....
是否有选项如何放置div。
I tried theme_advanced_toolbar_location : "external" and setting the position of the "mceExternalToolbar" (like suggested here: TinyMCE - external toolbar position) but don't really like this solution since it uses fixed positioning.... Is there a option how to where to place the div.
文档说明了theme_advanced_toolbar_location:
The docu says for theme_advanced_toolbar_location:
..将工具栏添加到DIV元素,并将此DIV的类设置为
mceExternalToolbar。 ...
但是如果你能改变div则不行。是否有可能更改此代码?
.. adds the toolbar to a DIV element and sets the class of this DIV to "mceExternalToolbar". ... but not if you can change the div. is there maybe a possibilty to change this code?
BR,
Stefan
BR, Stefan
推荐答案
几个月前,这对我来说是一个问题。您需要做的就是将外部工具栏移动到您想要的位置。我在我的一个插件中编写了一个函数。
在我的页面上,我创建了一个带有externalToolbarWrapper类的div,其中我插入了工具栏。这是那个功能。您可能需要稍微调整一下,但认为它会对您有所帮助。
This has been an issue for me a few months ago. All you need to do is to move the external toolbar to the place you want it to be. I wrote a function in one of my plugins. On my page i have created a div with class "externalToolbarWrapper" in which i insert the toolbar. Here is that function. You might need to tweak it a bit, but think it will be of help to you.
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(使用设置配置参数这里)
You should call it onInit (use the setup configuration parameter here)
setup : function(ed) {
ed.onInit.add(function(ed) {
// place your code here
});
},
这篇关于TinyMCE工具栏位置的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!