首页 > 经验 > 关键词 > WordPress投稿最新资讯 > 正文

WordPress投稿功能添加富文本编辑器

2012-09-27 10:30 · 稿源:ludou.org

在N年前,我写了一片教程:WordPress添加投稿功能,这篇教程目前的点击率已经快接近9000了,算是笔者博客最火的一篇文章了。这篇教程从发布到现在,不知道改过多少遍了,也不断收到读者各方面的需求,我也在留言中给他们一一回复了,所以文章中找不到你想要的东西,可以看看留言。

鉴于留言中我已经给很多读者指导怎么修改代码,如果现在再去修改文章中的代码,势必会导致代码所在行数的变化,等于毁了我之前给读者的所有回复。最近一段时间,我将再写几篇文章,告诉你怎么增强这个投稿功能。今天要讲的是如何给这个投稿功能添加一个富文本编辑器(也包括了图片上传功能),原来的代码只能实现一个简单的纯文本输入框,对于投稿者的输入体验不太好。

一、下载KindEditor

这里我们将使用KindEditor来作为我们的编辑器,点此下载KindEditor。下载后解压,将文件夹重命名为kindeditor,放到你当前主题文件夹下。

二、修改HTML页面

打开WordPress添加投稿功能,下面我们将对这篇文章中的代码进行修改。

将代码一中第41行的</form>改成:

</form>
<script charset="utf-8" src="<?php bloginfo('template_url'); ?>/kindeditor/kindeditor-min.js"></script>
<script charset="utf-8" src="<?php bloginfo('template_url'); ?>/kindeditor/lang/zh_CN.js"></script>
<script>
/* 编辑器初始化代码 start */
    var editor;
    KindEditor.ready(function(K) {
        editor = K.create('#tougao_content', {
        resizeType : 1,
        allowPreviewEmoticons : false,
        allowImageUpload : true, /* 开启图片上传功能,不需要就将true改成false */
        items : [
            'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
            'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
            'insertunorderedlist', '|', 'emoticons', 'image', 'link']
        });
    });
/* 编辑器初始化代码 end */
</script>

三、php代码小修改

代码二第37行代码改成:

$content =  isset( $_POST['tougao_content'] ) ? trim($_POST['tougao_content']) : '';
$content = str_ireplace('?>', '?&gt;', $content);
$content = str_ireplace('<?', '&lt;?', $content);
$content = str_ireplace('<script', '&lt;script', $content);
$content = str_ireplace('<a ', '<a rel="external nofollow" ', $content);

四、自定义编辑器功能

经过以上三步的修改,目前你的编辑器就可以正常使用了。但是对不同人来说,他们的需求可能不太一样,有人可能会觉得上面的编辑器太过简单。那么怎样自定义编辑器的功能呢?这里我就不讲编程了,简单点就找编辑器自带的样例来说就行了。

我们下载的kindeditor目录下有个examples文件夹,这里是部分演示,双击打开index.html可以看到所有演示。你是否看中某个演示呢?那就用文本编辑器打开它的html文件,查看里面的代码。这些html文件的代码中都可以看到类似代码:

<script charset="utf-8" src="../kindeditor-min.js"></script>
<script charset="utf-8" src="../lang/zh_CN.js"></script>
<script>
    ... 编辑器初始化代码
</script>

编辑器初始化代码那部分代码替换第三步中的编辑器初始化代码,然后将 'textarea[name="content"]' ,改成 '#tougao_content'即可。

好了,添加个编辑器就是这么简单。如果你会编程,或者懂看文档,动手能力强,可以看看KindEditor的文档,自己动手玩玩:KindEditor文档

本文地址:http://www.ludou.org/tougao-text-editor.html

  • 相关推荐
  • 大家在看
  • 有作品就show出来!快来明基摄影后期大赛投稿吧

    用实力证明自己,十六万大奖等着你! 2020 年首届明基摄影后期大赛于 6 月 1 号正式开启,现面向广大摄影师及摄影爱好者征集摄影作品,涵盖人文、人像、风光、商业、静物等多个类别。更有新疆精品摄影课程等你来参加,多位名师实地教学,带你完善专业摄影流程。精彩不止于此,精彩的,在后面!本届摄影后期大赛由明基专业摄影显示器主办,联合松下、摄影之友、数字尾巴等为摄影师提供展示交流的平台,通过分享优秀后期作品、摄影权

  • pdf怎么转换成word?这些pdf转word方法需要掌握

    pdf怎么转换成word?pdf文件的特点,大家多少会了解一些。虽然pdf格式的文件比较受小伙伴们的欢迎,但是很多的小伙伴对pdf文件的编辑操作有些苦恼,想要编辑pdf文件,可以通过文件转换的方式,将pdf转换为word文档,这样就可以编辑pdf的内容了。方法一:迅捷PDF转换器使用转换工具来完成pdf相关文件的转换是比较方便的。首先,我们需要在电脑中将转换工具给打开,然后找出对应的功能。如该软件默认的功能是“文件转word”,刚好可以?

  • 微信悄然加入新功能:朋友圈删除后可重新编辑

    近日,iOS版微信升级到7.0.13版本,带来了众所期待的微信号修改功能,隐藏的“拍一拍”也被网友玩坏。新版本中,双击好友头像,好友头像会首先“颤抖”一下,同时会在聊天

  • 微信朋友圈重新编辑功能怎么使用

    微信朋友圈上线了删除后重新编辑的功能,这个功能可以让已经被删除的朋友圈信息重新恢复,如何进行以下的操作呢,我们来看下朋友圈删除后具体的操作方法。

  • 微信再上线新功能!朋友圈删除后可重新编辑

    近日,有网友发现,除了“拍一拍”之外,微信还悄然在朋友圈上线了一项“删除朋友圈重新编辑”新功能。如用户对发布的朋友圈不满意可撤回重新编辑,原本发布的文字以及图片依然存在,方便用户再次发布,但该“重新编辑”按钮仅会存在 2 分钟。

  • 微信朋友圈删除后可重新编辑了 网友:这有啥用

    近日,有用户反映,微信朋友圈现已支持图文删除后重新编辑。iPhone用户更新至7.0.13版本后,可在发布新的朋友圈后删除,选择重新编辑再发布。对此,有网友认为,“这功能没啥用”,“直接删不就得了,开发一些有的没的功能有啥意思”。不少网友提出了自己想改善的功能,比如:朋友圈发视频最少一分钟、不能让添加的人拉我进群、希望删除对话框不会删除聊天记录,消息能够漫游等。近日,微信iOS更新至7.0.

  • 安卓版Chrome新功能来了:支持图片编辑

    6月25日消息,据XDA报道,谷歌在Android版Chrome上加入了图片编辑功能。XDA指出,Chrome内置了截图编辑器,用户截屏后可以在Chrome内完成编辑、分享等操作。据悉,谷歌已经将这项功能加

  • 美国将释放数百万基因编辑蚊子消除疟疾 专家:恐适得其反

    蚊子作为人类“第一杀手”,平均每年会导致725000人死亡,其中大约有66万人死于疟疾。而美国为了消灭疟疾,计划投放一种经过基因编辑的蚊子。6月8日,据外媒报道,今年夏天,美国为

  • 苹果新动作:Chrome插件可以移植到Safari浏览器了

    谷歌浏览器Chrome凭借急速的内核、简洁的界面以及与谷歌账号的深度融合,吸引了大批忠实用户。不过,Chrome最拿手的当属其Chrome Web Store,内含数不胜数的轻量级扩展程序,可以将Chrome浏览器

  • 郝景芳出任火星车科普百家号主编 全网招编辑

    【TechWeb】7月2日消息,百度宣布“中国第一辆火星车”独家入驻百度APP百家号,并邀请到雨果奖获得者郝景芳出任火星车科普百家号主编。郝景芳的小说《 北京折叠]》获得第74届雨果奖。同时,郝景芳联合中国探月工程面向全网招聘编辑团队。火星车科普百家号编辑的招聘要求主要有三条,包括拥有渊博的航天知识、有炙热的求知欲、文笔优秀等。应聘方式为在百度App搜索“郝景芳招募火星合伙人”话题,带话题发布应聘视频或图文简历。郝

  • 好莱客携手国际杂志编辑总监,解码2020家装趋势

    “我是一个装修小白,不知道家怎么装才好”,这是很多人的心声,怕装出来的效果不满意,也怕居住体验不理想……你是不是也被难哭了!?今天,好莱客特别邀请了国际权威家居杂志《ELLE DECORATION家居廊》首席内容官兼编辑总监孙信喜先生,为你解码家居生活的种种难题,快跟好莱客一起体验这场关于生活方式的头脑风暴吧。Get2020家装趋势打造健康潮流家装修前,你会了解家装趋势吗?其实了解家装趋势,才能更好地抓住潮流,最大程度

  • 微软用AI取代人工编辑,未来的新闻行业会由机器人统领吗?

    据西雅图时报报道,微软将于 6 月底进行裁员,裁员对象主要为记者和编辑,并将在未来加大力度使用AI技术取代人类新闻编辑。“新上岗”的AI算法将会代替人类编辑选取可报道的新闻事件、改写新闻标题、寻找文章配图等工作。相关负责人声称此次裁员并非疫情期间的“应急”之举,微软其实很早就开始探索将AI技术应用到新闻实践中,此次裁员只是正常战略调整。但是在广告投入预算不断缩减、新闻行业逐步自动化的大趋势下,这一消息无疑?

  • 西部数码年中钜惠:云服务器1.6折起,域名5元起,SSL证书5折购

    它来了它来了!西部数码的618年中大促带着满满的诚意和优惠终于来啦!不必等到6月18日,也不必计算复杂的满减折上折,活动规则简单明了,产品优惠实实在在。今天起,即可参与西部数码618云钜惠——超多爆款限量抢,2核2G云服务器3年仅需999元!买代金券获赠20%京东购物卡!活动时间:2020年6月5日—6月19日活动入口:https://www.west.cn/active/20618/爆款产品限时抢购区活动期间,新用户(从未购买过西部数码主机产品且完成实名?

  • 净水器哪个牌子好?可以自己更换滤芯的净水器

    现如今,多数家庭饮用水主要依靠自来水或者购买桶装水,但随着水污染的日益严重和黑心桶的曝光,越来越多的人对自来水和桶装水的安全性产生了质疑。水是生命之源,随着家用净水器的兴起,家庭饮用水污染问题有了救星,市面上的净水器多种多样,那么哪个牌子好?下面是国际净水协会评选的十大品牌: 净水器十大名牌:冰尊净水器在本次评选中,冰尊被授予“净水器十大排名品牌”,“净水器十大排名”荣誉称号!冰尊净水器获得净水器

  • 净水器哪个牌子好 靠谱的净水器怎么选择

    想要买到靠谱的净水器,就要知道怎么去选择净水器,只有知道选择净水器,才能买到靠谱的净水器产品。那如何选择净水器呢?首先一定要通过水质认证!即相关涉水批件。每一款合格的净水器都应该有卫生部颁发的对应其型号的《涉及饮用水卫生安全产品卫生许可批件》和国家指定涉水产品检测部门的《检测报告》。其次要符合国家标准要求。净水器厂家必须取得上级卫生监督部门的卫生许可证,经过技术监督部门鉴定,符合国家的《生活饮用水水

  • 净水器哪个牌子好?健康水质标杆的净水器

    在如今高速发展的社会,家用净水器已经成为了人们的必需用品,那么家用净水器分几种呢?现在就让小编来告诉大家吧!家用净水器一般分两种:一种是超滤机,适用于水质还行的地区,一般适合南方地区使用,这种净水器是不需要排废水的,保留矿物质的。另外一种是纯水机,纯水机是拥有RO反渗透的,可以彻底过滤水中一切杂质,只有剩下水,会有废水产生。市面上的净水器很多。哪些牌子的净水器比较好呢?净水器十大品牌有哪些呢?下列?

  • 净水器哪个牌子好?高端人士喜欢的净水器

    德国冰尊净水器再一次夺得冠军! 2020 年 4 月 1 日国际净水协会在美国拉斯维加斯举行,参与此次世界净水器十大排名评选的单位和组织有:世界环保组织(IUCN)、国际贸易中心(ITC)、世界卫生组织(WHO)、世界品牌实验室、全球环境基金秘书处(GEF)、国际标准化组织(ISO)等 32 个国际组织,现场对各净水器品牌进行评测,最终投票选出 2020 年世界净水器十大品牌排行榜: 净水器十大品牌:冰尊(BENSHION)净水器 2019 年冰尊净?

  • Serverless架构的前世今生

    一、Serverless简介云计算的不断发展,涌现出很多改变传统IT架构和运维方式的新技术,而以虚拟机、容器、微服务为代表的技术更是在各个层面不断提升云服务的技术能力,它们将应用和环境中很多通用能力变成了一种服务。但无论这些技术应用在哪里,帮助企业“降本增效”是技术变革永恒的主题。Serverless架构的出现,带来了跨越式的变革。Serverless下主机管理、操作系统管理、基础软件的部署运维、资源分配和扩缩容能力全部由云厂?

  • 三星Odyssey G9显示器上市!49寸/5K/240Hz/1000R超高曲率

    在今年的2020年国际消费电子展(CES 2020),三星发布了Odyssey系列游戏显示器。Odyssey G9更是让当时几乎所有坐在这款49英寸超高曲率显示屏前的人所折服,有人甚至称其最极端的超宽游戏显示器。

  • 和平精英SS8赛季手册寻宝行动全攻略 SS8赛季手册寻宝行动教程

    ​和平精英SS8赛季手册寻宝行动是新增的玩法,在其中可以获得非常多的奖励,但是一些玩家还不清楚怎么去玩寻宝行动,下面就来为大家分享一下和平精英SS8赛季手册寻宝行动全攻略。

  • 参与评论
文明上网理性发言,请遵守新闻评论服务协议

热文

  • 3 天
  • 7天