百度编辑器 Ueditor 如何增加模板 ？
简介：
Ueditor 是百度出的开源富文本编辑器，非常符合国人习惯！模板功能很好用，但不能直接自定义，
下面就告诉大家如何增加模板。
查找模板在源代码中的位置：
已经知道其它模板的关键字，比如有：键入文档标题
grep'键入文档标题'-rdir/ueditor/
|
结果：
[[email protected]]#grep'键入文档标题'-r*dialogs/template/config.js:"html":'<h1class="ue_t"label="Titlecenter"name="tc"style="border-bottom-color:#cccccc;border-bottom-width:2px;border-bottom-style:solid;padding:0px4px0px0px;text-align:center;margin:0px0px20px;"><spanstyle="color:#c0504d;">[键入文档标题]< |
定义自己的模板：
1.先用Ueditor编辑好一个模板
点左上角的HTML 就会出现 html 源代码
2.把模板代码写入模板文件
把上步的源代码整理成一行，替换dialogs/template/config.js 中的第一个空模板内容。比如：
vartemplates=[{
"pre":"pre0.png",
'title':lang.blank,
'preHtml':'<pclass="ue_t"> 欢迎使用UEditor！</p>',
'html':'<p><spanclass="ue_t"style="font-family:幼圆;font-size:22px;color:green;">简介：</span><br/></p><pclass="ue_t"style="text-indent:2em;">这是文章的简单内容，几行字了事～</p><p><br/></p><p><spanclass="ue_t"style="font-family:幼圆;font-size:22px;color:green;">如何Debug源代码:</span><br/><br/></p><p><spanclass="ue_t"style="font-size:16px;">1.学习源代码</span><br/></p><pclass="ue_t"style="text-indent:2em;font-size:14px;">优秀的源代码是很好的学习资源，可以让你快速成长！</p><p><br/></p><p><spanclass="ue_t"style="font-size:16px;">2.找出源代码问题</span><br/></p><pclass="ue_t"style="text-indent:2em;font-size:14px;">了解架构与设计思想，才能更快的去Debug！</p><p><br/></p><p><spanclass="ue_t"style="font-family:幼圆;font-size:22px;color:green;">如何增加插件:</span><br/><br/></p><p><spanclass="ue_t"style="font-size:16px;">1.学会安装使用插件</span><br/></p><pclass="ue_t"style="text-indent:2em;font-size:14px;">在“开始”选项卡上，通过从快速样式库中为所选文本选择一种外观，还是使用某种直接指定的格式。</p><p><br/></p><p><spanclass="ue_t"style="font-size:16px;">2.了解插件的开发流程</span><br/></p><pclass="ue_t"style="text-indent:2em;font-size:14px;">在“开始”选项卡上，通过从快速样式库中为所选文本选择一种外观，还是使用某种直接指定的格式。</p><p><br/><spanstyle="font-family:幼圆;font-size:22px;color:rgb(192,0,0);">问题：</span></p><p><br/><spanclass="ue_t"style="font-size:16px;">1.编译报错Errors</span><br/></p><pclass="ue_t"style="text-indent:2em;font-size:14px;">原因：</p><p><br/><spanclass="ue_t"style="font-size:16px;">2.编译报错Errors</span><br/></p><pclass="ue_t"style="text-indent:2em;font-size:14px;">原因：</p><p><br/><br/><spanclass="ue_t"style="font-family:幼圆;font-size:22px;color:green;">结束语:</span></p></p><pclass="ue_t"style="text-indent:2em;font-size:14px;">对于“插入”选项卡上的库，在设计时都充分考虑了其中的项与文档整体外观的协调性。您可以使用这些库来插入表格、页眉、页脚、列表、封面以及其他文档构建基块。您创建的图片、图表或关系图也将与当前的文档外观协调一致。</p><p><br/><spanclass="ue_t"style="font-family:幼圆;font-size:22px;color:green;">参考资料:</span><br/><br/></p><ulclass="list-paddingleft-2"style="list-style-type:disc;"><li><p>a</p></li></ul>'
},
|
结果：