本文作者:sushengmiyan 

本文地址:http://blog.csdn.net/sushengmiyan/article/details/47866905

上一节我们将开发环境搭建完成,我们会发现发布帖子的编辑器比较简单,格式支持比较少,现在我们将一个开源编辑器 ckeditor 替换。

1.下载ckeditor

http://ckeditor.com/ 免费的开源编辑器。

2.加入到我们项目中。

现在使用ckeditor特别简单,将下载到的包,解压到项目根目录,webroot下。然后在templates\default.htm文件中,头部加入如下引入js

<script src="${contextPath}/ckeditor/ckeditor.js"></script>

然后在约357行,标有teatarea注释的地方,嘎栋为如下:

<!-- Textarea -->
<tr>
<td valign="top">
<textarea name='editor1' id='editor1'class="message" onkeyup="storeCaret(this);" onclick="storeCaret(this);" onselect="storeCaret(this);" tabindex="3" name="message" rows="15" cols="35"><#if post?exists><#if quote?exists>[quote=${quoteUser}]${post.text?html}[/quote]<#else>${post.text?html}</#if></#if></textarea>
<script>
// Replace the <textarea id="editor1"> with a CKEditor
// instance, using default configuration.
CKEDITOR.replace( 'editor1' );
</script>
</td>
</tr>

重新刷新项目,新发布文章的时候,ckeditor已经在起作用了,如下图:



好的,到此,已经将编辑器纳入为我们的项目了。现在需要做的就是融合了,大家各显神通的时候到啦。

[BBS]搭建开源论坛之JForum富文本编辑器更换的更多相关文章

  1. [BBS]搭建开源论坛之JForum安装使用札记

    本文作者:sushengmiyan 本文地址:http://blog.csdn.net/sushengmiyan/article/details/47761303 目录 目录 BBS搭建开源论坛之JF ...

  2. [BBS]搭建开源论坛之Jforum搭配开源CKEDITOR

    本文作者:sushengmiyan 本文地址:http://blog.csdn.net/sushengmiyan/article/details/47946065 使用默认的编辑器的时候,格式都无法保 ...

  3. 「newbee-mall新蜂商城开源啦」 页面优化,最新版 wangEditor 富文本编辑器整合案例

    大家比较关心的新蜂商城 Vue3 版本目前已经开发了大部分内容,相信很快就能够开源出来让大家尝鲜了,先让大家看看当前的开发进度: 开源仓库地址为 https://github.com/newbee-l ...

  4. Quill – 可以灵活自定义的开源的富文本编辑器

    Quill 的建立是为了解决现有的所见即所得(WYSIWYG)的编辑器本身就是所见即所得(指不能再扩张)的问题.如果编辑器不正是你想要的方式,这是很难或不可能对其进行自定义以满足您的需求. Quill ...

  5. PHP如何搭建百度Ueditor富文本编辑器

    本文为大家分享了PHP搭建百度Ueditor富文本编辑器的方法,供大家参考,具体内容如下 下载UEditor 官网:下载地址 将下载好的文件解压到thinkphp项目中,本文是解压到PUBLIC目录下 ...

  6. bbs项目富文本编辑器实现上传文件到media目录

    media目录是在project的settings中设置的,static目录是django自己使用的静态文件的上传目录,media目录是用户自定义上传文件的目录 # Django用户上传的文件都放在m ...

  7. 在Asp.Net Core中配置使用MarkDown富文本编辑器实现图片上传和截图上传(开源代码.net core3.0)

    我们的富文本编辑器不能没有图片上传尤其是截图上传,下面我来教大家怎么实现MarkDown富文本编辑器截图上传和图片上传. 1.配置编辑器到html页 <div id="test-edi ...

  8. 在Asp.Net或.Net Core中配置使用MarkDown富文本编辑器有开源模板代码(代码是.net core3.0版本)

    研究如何使用Markdown你们可能要花好几天才能搞定,但是看我的文章或者下载了源码,你搞定一般在10分钟之内.我先给各位介绍下它: Markdown 是一种轻量级标记语言,它允许人们使用易读易写的纯 ...

  9. wangEditor-基于javascript和css开发的 Web富文本编辑器, 轻量、简洁、易用、开源免费(2)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. 常见Linux网卡配置范例

    一.RHEL/CentOS系 参考链接:RHEL6网络配置 RHEL7网络配置 文件路径:/etc/sysconfig/network-scripts/ifcfg-eth0 DEVICE=eth0 B ...

  2. 两个activity的3D翻转动画.md

    一.业务需求 这里在公司项目设计时,用到了一个小的需求,就是点击一个按钮然后整个activity的页面进行3d翻转; 二.设计思路 由于是2个activity的之间的翻转动画,就意味着前90度是A页面 ...

  3. 如何在jenkins的maven项目中,用mvn命令行指定findbugs的黑名单规则文件

    一:问题背景 最近在研究jenkins的过程中,针对maven项目,打算添加findbugs进行静态检查,但我不太想在项目的pom中进行修改,最好可以只修改jenkins的job配置,即配置外部化. ...

  4. ios11,弹出层内的input框光标错位 键盘弹出时,输入信息,光标一直乱跳

      之前开发了一个微信项目,维护期中苹果手机突然出现光标错位现象,经过排查,发现是最新的ios11系统的锅. 具体情况:弹出层使用position: fixed:弹出层内附带input/textare ...

  5. Python系列之 - 字符编码问题

    1.内存和硬盘都是用来存储的. CPU:速度快 硬盘:永久保存 2.文本编辑器存取文件的原理(nodepad++,pycharm,word) 打开编辑器就可以启动一个进程,是在内存中的,所以在编辑器编 ...

  6. JavaScript数组操作总结

    以前特别相信自己的大脑,后来,再也不相信了!大脑是虚无的,重要的东西一定要让它有一个物质的具体的副本.事无巨细! 1.创建数组: new Array(); new Array(size); new A ...

  7. MySQL的安全机制

    MySQL的安全机制: 1.MySQL登录 mysql -u账户 -p密码 -h127.0.0.1 -P端口 数据库名 mysql -h hostname|hostIP -p port -u user ...

  8. jdk1.7中的常量池

    在探究jdk1.7中的常量池,我们可以先看看以下的这段代码 public static void main(String[] args) throws Throwable { List<Stri ...

  9. Centos常用命令之:ln

    在linux中[ln]这个命令用来创建连接文件. 共有两种连接文件:一种是类似与Windows的快捷方式(软链接),另一种就是通过文件系统的inode来产生的新的文件名(硬链接). 这里解释下什么叫i ...

  10. [BZOJ 4919]大根堆

    Description 题库链接 给定一棵 \(n\) 个节点的有根树,每个点有一个权值 \(val_i\) .你需要选择尽可能多的节点,使得:对于任意两个点 \(i,j\) ,如果 \(i\) 在树 ...