|
<b>[文章目录]</b>
<ul id="index-ul">
<li>一:首先下载这个比较好的编辑器</li>
<li>二:添加引入这个编辑器的一引起js文件</li>
<li>三:看下效果图吧</li>
</ul>
</div>
同学们大家好,今天<span style="font-size: 14pt; color: #ff0000;"><span style="color: #ff0000;"><strong>吾爱互联</strong></span></span>将与大家分享如何在投稿中添加丰富编辑器的功能
具体如何添加这个投稿功能,建议大家看下我之前写的文章<span style="color: #ff0000; font-size: 14pt;"><span style="color: #ff0000;"><strong>《WordPress 中如何添加投稿页面功能 》</strong></span></span>
那么这个编辑器的功能添加很简单
<h2 id="title-0">一:首先下载这个比较好的编辑器
它的名字是 KindEditor 下载地址:http://kindeditor.net/down.php 下载后解压,将文件夹重命名为kindeditor,放到你当前程序的根目录下
方便后续的调用路径
<h2 id="title-1">二:添加引入这个编辑器的一引起js文件
在你的page.php文件 <?php get_header();?> 这个下面添加如下代码
<div class="dp-highlighter">
<div class="bar"></div>
<ol class="dp-c" start="1">
<li class="alt"><script type=<span class="string">"text/javascript"</span> src=<span class="string">"http://localhost/demo/kindeditor/kindeditor-min.js"</span>></script></li>
<li><link rel=<span class="string">"stylesheet"</span> href=<span class="string">"http://localhost/demo/kindeditor/themes/simple/simple.css"</span> /></li>
<li class="alt"><script type=<span class="string">"text/javascript"</span> src=<span class="string">"http://localhost/demo/kindeditor/lang/zh_CN.js"</span>></script></li>
<li></li>
<li class="alt"><script type=<span class="string">"text/javascript"</span>></li>
<li></li>
<li class="alt">$(document).ready(<span class="keyword">function</span>(){</li>
<li></li>
<li class="alt"><span class="keyword">var</span> editor;</li>
<li></li>
<li class="alt">KindEditor.ready(<span class="keyword">function</span>(K) {</li>
<li></li>
<li class="alt">editor = K.create('textarea[name=<span class="string">"tougao_content"</span>]', {</li>
<li></li>
<li class="alt">allowFileManager : false,</li>
<li></li>
<li class="alt">allowImageUpload : false</li>
<li></li>
<li class="alt">});</li>
<li></li>
<li class="alt">});</li>
<li></li>
<li class="alt">});</li>
<li></li>
<li class="alt"></script></li>
</ol>
</div>
注意你的这个路径不能搞错了,否则会显示不出编辑器了
<h2 id="title-2">三:看下效果图吧
<img class="aligncenter size-full wp-image-757" src="http://www.wpjiaocheng.com/wp-content/uploads/2014/08/tougao.png" alt="wordpress中如何添加投稿功能中编辑器功能" width="701" height="539" />
如图中所示
好了,同学们自己去尝试下,就知道如何制作了,明白
|
|