目錄
[需求]
我希望在發(fā)表出的文章上方右側放置一個(gè)與本文內容有關(guān)的圖片,這樣別人看了圖片就知道是關(guān)于哪方面的了。當然,是希望能夠為每篇文章方便的添加一張代表性的圖片。
[分析]
1、要實(shí)現圖片和文字的混排,且圖片浮動(dòng)在右側。這一點(diǎn)很容易,只要設置一下圖片的Style為float:right就可以了
2、寫(xiě)文章時(shí)要能方便的添加這樣的圖片。如果每次都需要手動(dòng)設置img src=之類(lèi)的話(huà)是比較麻煩的,更何況還要記住圖片地址。簡(jiǎn)單點(diǎn)的方法就是為默認的編輯器上的quickTags添加幾個(gè)按鈕(我用的編輯器不是可視化編輯器,所以顯示的是quicktags,不是tinymce的編輯按鈕)。添加了按鈕后希望點(diǎn)擊按鈕就可以自動(dòng)插入圖片代碼。
[實(shí)現]
1、修改當前模板的style.css,添加如下代碼
CSS Code:
- .content_img{
- clear:both;
- float:right;
- }
2、打開(kāi)\wp-includes\js\quicktags.js,在133行左右,也就是以下代碼
javascript Code:
- edButtons[edButtons.length] =
- new edButton('ed_more'
- ,'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'
- ,'<img src="http://4nothing.net/blog/thumbnail/'+tmpPicArry[i].pic+'" alt="'+tmpPicArry[i].title+'" class="content_img" />'
- ,''
- ,''
- ,-1
- );
- }
3、將相關(guān)圖片上傳至blog根目錄/thumbnail/目錄下
[效果圖]
點(diǎn)擊下圖可在本窗口中放大觀(guān)看
這里面增加的有關(guān)于
FlashPlayer、
Google、
Microsoft、
Yahoo!等的圖片。
[擴展和資源下載]如果你使用的
tinymce的編輯器,則可能需要修改
\wp-includes\js\tinymce\tiny_mce_gzip.php文件。
本站僅提供存儲服務(wù),所有內容均由用戶(hù)發(fā)布,如發(fā)現有害或侵權內容,請
點(diǎn)擊舉報。