[wordpress]为写文章编辑器添加quicktag | 技术人生

来源：百度文库编辑：神马文学网时间：2024/05/02 07:21:35

[wordpress]为写文章编辑器添加quicktag

目录
需求分析实现效果图扩展和资源下载
[需求]
我希望在发表出的文章上方右侧放置一个与本文内容有关的图片，这样别人看了图片就知道是关于哪方面的了。当然，是希望能够为每篇文章方便的添加一张代表性的图片。
[分析]
1、要实现图片和文字的混排，且图片浮动在右侧。这一点很容易，只要设置一下图片的Style为float:right就可以了
2、写文章时要能方便的添加这样的图片。如果每次都需要手动设置img src=之类的话是比较麻烦的，更何况还要记住图片地址。简单点的方法就是为默认的编辑器上的quickTags添加几个按钮(我用的编辑器不是可视化编辑器，所以显示的是quicktags，不是tinymce的编辑按钮)。添加了按钮后希望点击按钮就可以自动插入图片代码。
[实现]
1、修改当前模板的style.css,添加如下代码
CSS Code:
.content_img{ clear:both; float:right; }
2、打开\wp-includes\js\quicktags.js,在133行左右，也就是以下代码
javascript Code:
edButtons[edButtons.length] = new edButton('ed_more' ,'more' ,'' ,'' ,'t' ,-1 );
的下方添加如下代码
javascript Code:
var tmpPicArry = [{title:"Google",pic:"google_cn.gif"},{title:"Microsoft",pic:"microsoft.gif"},{title:"AS3",pic:"as3.gif"},{title:"AS2",pic:"as2.gif"},{title:"baidu",pic:"baidu.gif"},{title:"Yahoo",pic:"yahoo_en.gif"},{title:"symantec",pic:"symantec.gif"},{title:"sony",pic:"sony.gif"},{title:"sohu",pic:"sohu.gif"},{title:"telcom",pic:"telcom.gif"},{title:"unicom",pic:"unicom.gif"},{title:"intel",pic:"intel.gif"},{title:"360safe",pic:"360safe.gif"},{title:"alibaba",pic:"alibaba.gif"},{title:"amd",pic:"amd.gif"},{title:"dell",pic:"dell.gif"},{title:"qq",pic:"qq.gif"},{title:"gome",pic:"gome.gif"},{title:"mobile",pic:"mobile.gif"},{title:"Adobe",pic:"adobe.gif"},{title:"AIR",pic:"air.gif"},{title:"wordpress",pic:"wordpress-logo.png"},{title:"AdobeFlashPlayer",pic:"flashplayer_225x50.jpg"}] var tpLen = tmpPicArry.length; for(var i = 0; i < tpLen; i++) { edButtons[edButtons.length] = new edButton('ed_'+tmpPicArry[i].title ,tmpPicArry[i].title+'Pic' ,'

' ,'' ,'' ,-1 ); }
3、将相关图片上传至blog根目录/thumbnail/目录下
[效果图]
点击下图可在本窗口中放大观看

这里面增加的有关于FlashPlayer、Google、Microsoft、Yahoo!等的图片。
[扩展和资源下载]
如果你使用的tinymce的编辑器，则可能需要修改\wp-includes\js\tinymce\tiny_mce_gzip.php文件。

[wordpress]为写文章编辑器添加quicktag | 技术人生为wordpress添加mp3播放器 Wordpress自动为文章加入关键字网络编辑如何为文章写标题 WordPress JS Quicktags 编辑器升级 >> Snow and Bodh... 10个Wordpress增强型编辑器 | 可能吧写博客文章时添加标签（Tags）的一些技巧写博客文章时添加标签（Tag）有什么技巧？美化博客（图片上飘动的文字，图片上写文章，图片上添加FLASH） - ... 美化博客（图片上飘动的文字，图片上写文章，图片上添加FLASH） - ... 图片上飘动的文字，图片上写文章，图片上添加FLASH）图说人生，总有一句是为你而写！随意添加的文章写文章请以“挤”为话题，写一篇文章。 html文本编辑器 - liyunqiangyq - JavaEye技术网站 wordpress 简单几步为wordpress加上留言板为文件夹添加背景音乐为文件夹添加背景音乐为文件夹添加背景音乐为文件夹添加背景音乐为文件夹添加背景音乐为文件夹添加背景音乐