当前位置:首页 > 源码分享 > 技术教程 > 正文内容

百度UEditor编辑器自定义标题样式修改教程

zjsn1年前 (2023-03-17)技术教程598

因为自己运营的某个网站后台编辑器使用的是百度UEditor,用这个编辑器自带功能给文章可以加四个自带标题样式,但这个标题样式令人难以满意,故决定自己动手修改。从网上搜索教程,发现可能涉及到两个文件的修改,一个是该编辑器目录下editor/ueditor.config.js另一个是lang/zh-cn/zh-cn.js文件。经过测试发现,不用修改zh-cn.js文件,只需要修改ueditor.config.js文件即可。找到如下代码

       //,'customstyle':[
        //    {tag:'h1', name:'tc', label:'', style:'border-bottom:#ccc 2px solid;padding:0 4px 0 0;text-align:center;margin:0 0 20px 0;'},
        //    {tag:'h1', name:'tl',label:'', style:'border-bottom:#ccc 2px solid;padding:0 4px 0 0;margin:0 0 10px 0;'},
        //    {tag:'span',name:'im', label:'', style:'font-style:italic;font-weight:bold'},
        //    {tag:'span',name:'hi', label:'', style:'font-style:italic;font-weight:bold;color:rgb(51, 153, 204)'}
        //]

uedit.jpg

上面代码就是这四行标题样式,自己可以在这里任意修改和增加样式,本人也搞不懂为什么这些地方都是注释掉的(或许哪里默认的?),修改后必须去掉注释代码,然后上传覆盖文件,清理浏览器缓存即可生效。

        ,'customstyle':[
           {tag:'span', name:'tc', label:'titlecenter', style:'border-bottom:#ccc 2px solid;padding:0 4px 0 0;text-align:center;margin:0 0 20px 0;'},
           {tag:'span', name:'tl',label:'titleleft', style:'border-bottom:#ccc 2px solid;padding:0 4px 0 0;margin:0 0 10px 0;'},
           {tag:'span',name:'im', label:'titleblack', style:'font-style:italic;font-weight:bold'},
           {tag:'span',name:'hi', label:'titleblue', style:'font-style:italic;font-weight:bold;color:rgb(51, 153, 204)'},
        {tag:'span',name:'wsy', label:'titlewsy', style:'font-weight:bold;color:rgb(51, 153, 204)'}
        ]

223.jpg

这里lable我都改为英文了,如果用中文,则前台这个标题内联css样式中会出现恶心的中文。

版权声明:本文由指尖十年发布,如需转载请注明出处,如有问题可在下面留言。

本站提供的一切软件、教程和内容信息来自网络收集整理,版权争议与本站无关,仅限用于学习和研究目的;不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。您必须在下载后的24个小时之内,从您的电脑或手机中彻底删除上述内容。如果您喜欢该程序和内容,请支持正版,购买注册,得到更好的正版服务。我们非常重视版权问题,如有侵权请邮件与我们联系

本文链接:https://www.zjsn.net/?id=59

分享给朋友:

“百度UEditor编辑器自定义标题样式修改教程” 的相关文章

 pbootcms多语言建站常见问题(转载)

pbootcms多语言建站常见问题(转载)

一、如何搭建多语言站?多语言/区域建站用于使用同一个后台建立多语言网站。1、使用步骤1)在后台”系统管理>数据区域”添加相应的区域,具体参考默认区域;2)将多语言的模板放入模板目录,不同语言的模板均放在template目录下;3)在后台选择语言切换到不同语言,分别设置:站点信息(注意选择模板)...

PbootCMS模板主题可用标签大全(PbootCMS仿站必备标签)

PbootCMS模板主题可用标签大全(PbootCMS仿站必备标签)

以下为PbootCMS网站模板可用标签收集整理大全,免费分享1、公司信息标签适用范围:全站任意地方均可使用。标签作用:用于调取网站与公司相关的信息,对应后台的“基础内容>公司信息”。{pboot:companyname}公司名称{pboot:companyaddress}公司地址{pboot:...

全国各地优势产业大全一览(原产地特产)

全国各地优势产业大全一览(原产地特产)

无论你是做电商,微商,直播带货,都需要知道各地的优势产业,下面为大家分享全国各个产业带产地搜索省流助手:羽绒服:共青城、吴江、常熟睡  衣:汕头、佛山、揭阳、普宁、中山袜  子:诸暨、江阴羊毛衫:海阳(山东)羊绒衫:清河(河北)羊绒大衣:大连泳  装:葫芦岛手 ...

http和https带www不带www四个网址如何统一为一个

http和https带www不带www四个网址如何统一为一个

很早以前,站长做网站只需要http访问即可,这几年随着企业和用户对安全问题的重视,许多网站都已改为https加密访问。随之也可能出现这种情况,同一个页面内容,可以有四个不同的网站,分别是http访问,https访问,带www访问,不带www访问,作为一个SEOer,页面统一入口也成为一个不大不小的问...

百度收录网站带缩略图最新规则,如何让网站收录带缩略图

百度收录网站带缩略图最新规则,如何让网站收录带缩略图

许多站长关注自己网站的百度收录情况,可能有人和我一样每天要site:www.zjsn.net 好几次。有的人会问,为什么别人网站百度收录到的页面带缩略图,而自己的网站没带缩略图呢,如何才让自己网站也在百度内带上缩略图?就这个问题,本人做下解释什么样的网站百度收录带缩略图?通常是网站建立时间...

Win10系统22H2版本如何关闭讨厌的热门搜索推荐栏

Win10系统22H2版本如何关闭讨厌的热门搜索推荐栏

本人电脑以前是win10系统21H1版本,已经手动关闭了系统自带所有广告提示,今天电脑自动升级到了22H2版本,居然在使用本地搜索功能时出现一个热门搜索栏。里面显示乱七八糟的推荐内容,一旦点击,就会跳转到Edge浏览器中Bing搜索结果页面。作为一个精神洁癖和强迫症双重患者,怎堪忍受如此行径。在系统...

发表评论

访客

看不清,换一张

◎欢迎参与讨论,请在这里发表您的看法和观点。