如何在TinyMCE版本4.0.10中使用importcss插件? (无法加载content_css并查看样式下拉列表)

时间:2013-11-19 05:38:25

标签: javascript jquery tinymce tinymce-4

我们正在使用最新的TinyMCE版本v 4.0.10

我们需要加载content_css并在styleselect菜单中查看样式下拉列表。

根据TinyMCE 4.x的文档,我们尝试使用importcss插件实现此功能。

但我们无法在styleselect菜单中看到样式下拉列表。

以下是相同的代码段:

theme: "modern",

menubar : false,

statusbar: false,

plugins: [
"advlist autolink lists autoresize link image charmap print preview hr anchor",

"searchreplace wordcount visualblocks visualchars code fullscreen pagebreak",

"insertdatetime media nonbreaking save table contextmenu directionality",

"emoticons paste textcolor spellchecker template noneditable importcss"

],

contextmenu: "cut copy paste | image inserttable",

toolbar1: button1,

toolbar2: button2,


toolbar_items_size: 'small',


content_css: "/CSS/user.css",


style_formats: [{title: 'Example 1', inline: 'span', classes: 'example1'}],


importcss_append: true

这里button1,button2在运行时获取值,正确显示工具栏菜单。

以下是user.css:

body {
background-color: #FFFFFF;
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: 11px;

}


td {
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: 10px;

}


pre {
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: 10px;

}


.example1 {
font-size: 14px;
font-weight: bold;

}


.example2 {
color: #FF0000;
font-size: 12px;
font-weight: bold;

}


.tablerow1 {
background-color: #BBBBBB;

}

我们期待的是:

类example1,example2,tablerow1应该在styleselect / Formats下拉菜单中动态加载而不是硬编码(通过在style_formats配置选项中定义它们)

如果我们遗漏了任何内容,请告诉我们。

提前致谢。

1 个答案:

答案 0 :(得分:1)

代码看起来很好。 除了CSS文件路径。 试试这个

content_css: "CSS/user.css" instead of content_css: "/CSS/user.css"