Question

我想在TinyMCE编辑器（Moodle 2.2.3中的版本3.4.9）中将自己的表格样式设置为默认样式。现在，我的新样式显示在下拉列表中，但我无法将其作为默认表格样式。默认值始终为“ - 未设置 - ”，这意味着不会使用任何表格样式。

这就是目前的情况： https://img.skitch.com/20111226-f4wgp8kudx45t6e2s17yse4cq6.jpg

最后它应该是这样的（“Tircia Style”应该是默认的）： https://img.skitch.com/20111226-dcf3t3w7qxagst1xgr2ieas26b.jpg

图片来自TinyMCEforum。

Answer 1

不要修改核心文件。我意识到之前没有选择，但在TinyMCE 4.x中，现在有一种方法可以使用string设置默认表格样式。

http://fiddle.tinymce.com/iUeaab

Answer 2

初始化tinymce时，请将路径添加到新的css文件中，该文件将定义编辑器中使用的样式。

tinymce.init({
        content_css: [
        '/css/innerLayout.css'
      ]
});

表格的innerLayout.css的一些示例样式 -

.mce-content-body table{width:100%;border-spacing:0;border-collapse:separate;border:0}
.mce-content-body table tr:nth-child(even){background:#FAFAFA}
.mce-content-body table caption,.mce-content-body table td,.mce-content-body table th{padding:15px 7px;border:0;font:inherit}
.mce-content-body table th{font-weight:400;color:#6E6E6E;border-bottom:2px solid #B9B9B9!important;

其他风格可以在这里找到 - link

Answer 3

table.js中的

添加以下代码：

 function init() {
   settings = tinyMCE.settings;       
   settings["table_styles"] =  "default1=red;default2=blue;" + settings["table_styles"];
   tinyMCE.settings["table_styles"] = settings["table_styles"];

Answer 4

我有同样的问题，我试图通过传递配置或更改库JavaScript文件来解决它。我开始对table.js（/tiny_mce/plugins/table/js/table.js）进行逆向工程。但是，没有运气。

所以，我去了table.htm（/tiny_mce/plugins/table/table.htm），这是表格插件的模态对话框的模板文件。注释掉预设选项{#not_set}形成选择控件。

<tr id="styleSelectRow">
    <td><label id="classlabel" for="class">{#class_name}</label></td>
    <td colspan="3">
        <select id="class" name="class" class="mceEditableSelect">
            <!--<option value="" selected="selected">{#not_set}</option>-->
        </select>
    </td>
</tr>

现在，当我们启动TinyMCE时，您应该始终将table_styles传递给初始配置。

var varTimyMCE = $("textarea").tinymce({
    table_styles : "Custom 1=classTable1",
});

这不是理想的解决方案，但它现在有效。我希望TinyMCE开发人员能够提供配置选项来控制未来版本中的选择控件。

Answer 5

如果您正在使用未经分析的tinyMCE.js，则可以编辑plugin.js（\ tinymce \ js \ tinymce \ plugins \ table \ plugin.js）。在当前版本中它是第1872行。我添加了使默认表样式响应。

html = '<div class="table-responsive"><table class="table"><tbody>';  // line 1882 or 1916
html += '</tbody></table></div>'; // line 1884 or 1928

在TinyMCE中拥有默认表格样式

5 个答案: