上一篇的【更簡易使用的HTML Editor–CKEditor】,小喵提到這個簡單好用的HtmlEditor:CKEditor。其中要使用表情碼的時候,覺得內建的表情碼似乎少了些。心想如果能夠自己增減表情碼,對於使用上應該會更活潑生動。於是小喵來研究如何增減表情碼。他總共要修改兩個東西,一個是把使用的表情碼圖形放入指定的資料夾,另一個則是修改設定檔案。以下來詳細介紹如何處理。
緣起
上一篇的【更簡易使用的HTML Editor–CKEditor】,小喵提到這個簡單好用的HtmlEditor:CKEditor。其中要使用表情碼的時候,覺得內建的表情碼似乎少了些。心想如果能夠自己增減表情碼,對於使用上應該會更活潑生動。於是小喵來研究如何增減表情碼。他總共要修改兩個東西,一個是把使用的表情碼圖形放入指定的資料夾,另一個則是修改設定檔案。以下來詳細介紹如何處理。
表情碼來源
在介紹如何放表情碼之前,先來提一下一個不錯的表情碼收集網站。這網站中收集各式各樣的表情碼,並且分門別類的整理起來。有興趣的請參考以下的連結自行前往
圖檔存放位置
準備好要用的表情圖檔後,接著就來找存放的位置。這邊要特別說明一下,由於這些圖未來要在網頁中呈現,建議不要使用中文,請使用英數字來作圖檔的檔名。
表情碼的資料夾,是下載ckeditor解壓縮後,在ckeditor\plugins\smiley\images
因此要對表情碼做增減,第一件事就是把表情碼圖形放在這個資料夾中(要的放進去,不要的刪掉)
設定檔修改
除了要把表情碼圖形放上去之外,另外還要修改設定檔,這樣表情碼才會有作用,這個設定檔是:【ckeditor\ckeditor.js】這個檔案。
在檔案中,搜尋【i.smiley_images】,這個是設定有哪些表情碼的圖檔。把您剛剛留在【ckeditor\plugins\smiley\images】的檔名,一一的放在這裡面,如下的設定:
i.smiley_images = ['onion001.gif', 'onion002.gif', 'onion003.gif', 'onion004.gif', 'onion005.gif']
另外,還需要修改第二個變數的內容,請搜尋【i.smiley_descriptions】(應該在剛剛那個變數的隔壁。這裡面要放的是針對表情符號的描述。修改內容如下:
i.smiley_descriptions = ['微笑', '狂笑', '哭哭', '傷心', '我的天']
有了以上的設定後,就扣可以再次去CKEditor的畫面,使用表情符號試試看了。
以下是簽名:
- 歡迎轉貼本站的文章,不過請在貼文主旨上加上【轉貼】,並在文章中附上本篇的超連結與站名【topcat姍舞之間的極度凝聚】,感恩大家的配合。
- 小喵大部分的文章會以小喵熟悉的語言VB.NET撰寫,如果您需要C#的Code,也許您可以試著用線上的工具進行轉換,這裡提供幾個參考
Microsoft MVP Visual Studio and Development Technologies (2005~2019/6) | topcat Blog:http://www.dotblogs.com.tw/topcat |