TinyMCE多个CSS类

我一直在寻找一种方法来做到这一点。我有一个加载到TinyMCE中的样式表。样式表是通过基于活动模板的我的内容管理系统生成的。问题是我无法让TinyMCE让我选择多个CSS类到一个signle元素。这里有一个例子：TinyMCE多个CSS类

.left_round_thumb_small { 
    width:65px; 
    height:65px; 
    border-radius:35px; 
    -moz-border-radius:35px; 
    -webkit-border-radius:35px; 
    -khtml-border-radius:35px; 
    background:url(/skins/msc_2013/images/lines.png) repeat; 
    float:left; 
    margin:0 25px 0 0; 
} 
.center_round_thumb_large { 
    width:162px; 
    height:162px; 
    border-radius:85px; 
    -moz-border-radius:85px; 
    -webkit-border-radius:85px; 
    -khtml-border-radius:85px; 
    background:url(/skins/msc_2013/images/lines.png) repeat; 
    position:relative; 
    margin:0 25px 0 0; 
} 

.round_border_black {border:1px solid black;} 
.round_border_red {border:1px solid red;} 
.round_border_blue {border:1px solid #00aeef;} 
.round_border_green {border:1px solid #3cb64b;}

现在我知道我可以去和做这样的事情：

tinyMCE.init({ 
    style_formats : [ 
     {title: 'Left Thumb Black', classes: 'left_round_thumb_small round_border_black'}, 
     {title: 'Center Thumb Blue', classes: 'center_round_thumb_small round_border_blue'}, 
    ] 
});

现在看到的是加载到TinyMCE的这个样式表是基于CMS的活动模板生成。如果我要更改模板，我还必须更改样式代码。这将是未来的一大麻烦。

因此，任何人都知道风格选择器或插件的代码补丁，可以让我这样做吗？

来源

2013-07-17 Pyromanci

-1

基于名称classes - 复数和也对其他配置设置例如语法，我认为它应该是这个样子：

tinyMCE.init({ 
    style_formats : [ 
     {title : 'Style1', classes : {'left_round_thumb_small','round_border_black'} }, 
     {title : 'Style2', classes : {'center_round_thumb_small','round_border_blue'} }, 
    ] 
});

来源

2013-07-19 12:09:24

如果你看。我指出我知道我可以这样做，但是想避免这样做。并使用核心CSS选择器。无论哪种方式，我写了一个使用content_css值的插件。所以我不必为每个模板更改做这些更改。 – Pyromanci

Pyromanci，即时通讯在同样的问题下，你能帮我插件的东西吗？ – msqar

https://www.dropbox.com/s/we9mjqajicmxqxs/multistyleselector.rar?dl=0解包并上传到您的TinyMCE插件目录。然后将multistyleselector添加到您的插件列表和一个按钮行中。您可能需要使用它，甚至可能无法使用代码，因为它是为我的CMS专门编写的。所以它可能不适用于你的内容。 – Pyromanci

见下文content_css的使用率多个CSS文件

tinymce.init({ 
    selector: 'textarea', 
    height: 500, 
    theme: 'modern', 
    plugins: [ 
    'advlist autolink lists link image charmap print preview hr anchor pagebreak', 
    'searchreplace wordcount visualblocks visualchars code fullscreen', 
    'insertdatetime media nonbreaking save table contextmenu directionality', 
    'emoticons template paste textcolor colorpicker textpattern imagetools' 
    ], 
    toolbar1: 'insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image', 
    toolbar2: 'print preview media | forecolor backcolor emoticons', 
    image_advtab: true, 
    templates: [ 
    { title: 'Test template 1', content: 'Test 1' }, 
    { title: 'Test template 2', content: 'Test 2' } 
    ], 
    **content_css: [ 
    '//fast.fonts.net/cssapi/e6dc9b99-64fe-4292-ad98-6974f93cd2a2.css', 
    '//www.tinymce.com/css/codepen.min.css']** 
});

来源

2016-01-26 19:28:24 alex

TinyMCE多个CSS类

回答

相关问题