1. 程式人生 > >Tinymce的配置、漢化、註釋及自定義樣式~!

Tinymce的配置、漢化、註釋及自定義樣式~!

版權宣告:原創作品,允許轉載,轉載時請務必以超連結形式標明文章 原始出處 、作者資訊和本宣告。否則將追究法律責任。http://opper.blog.51cto.com/628423/124385 參考:http://www.inpeck.com/TinyMceManual/ tiny中文手冊 Tinymce官方網站:[url]http://tinymce.moxiecode.com/[/url] Tinymce3.2漢化版:見附件,此漢化包並不完全 Tinymce3.2官方簡體中文漢化包:見附件 TinyMCE 是一個基於瀏覽器(例如MSIE或Mozilla)的強大的所見即所得的編輯器,它使使用者可以方便的編輯HTML內容。它非常靈活並且是為系統整合而設計的,比如在Intranets、CMS、LMS等系統中應用。 TinyMCE 由 Moxiecode Systems AB 開發,根據"LGPL"版權許可證發行, 請檢視版權協議以獲知更多細節。 特點 易於整合,只需要簡短几行程式碼。 支援主題和模板。 易於使用自定義程式碼擴充套件(外掛和回撥) 可定製HTML輸出。遮蔽元素和強制屬性。 國際語言支援(通過語言包)。 支援多種瀏覽器, 目前有 Mozilla (PC/Mac/Linux), MSIE (PC) 和 FireFox (PC/Mac/Linux)。 在呼叫頁面中加入 <. language="." type="text/." src="tiny_mce/tiny_mce.js"> <. language="." type="text/."> tinyMCE.init({ mode : "textareas", //定義顯示類別 theme : "advanced", //定義載入外掛 plugins : "safari,spellchecker,pagebreak,style,layer,table,save,advhr,advimage, advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media, searchreplace,print,contextmenu,paste,directionality,fullscreen, noneditable,visualchars,nonbreaking,xhtmlxtras,template, imagemanager,filemanager", //定義工具欄的位置 theme_advanced_toolbar_location : "top", //定義工具欄工具的對其方式 theme_advanced_toolbar_align : "left", //定義輸入框下方是否顯示狀態列,預設不顯示 theme_advanced_statusbar_location : "bottom", //定義是否可以改變輸入視窗大小 theme_advanced_resizing : true }); 可根據實際需要減少或者增加樣式~! tiny_mce檔案解釋 langs資料夾是所有標籤語言樣式 plugins 資料夾裡的子資料夾包含所有標籤的詳細定義,每個標籤資料夾裡包含 的langs資料夾可定義單個標籤的內部詳細語言.可以對其htm檔案進行更改配合 themes資料夾裡的分類 對editor_template.js進行的標註 //字型大小 font_size:['font_size','fontsizeselect'], //加粗 bold:['bold_desc','Bold'], //斜體 italic:['italic_desc','Italic'], //下劃線 underline:['underline_desc','Underline'], //貫穿線 strikethrough:['striketrough_desc','Strikethrough'], //左對齊 justifyleft:['justifyleft_desc','JustifyLeft'], //居中對齊 justifycenter:['justifycenter_desc','JustifyCenter'], //右對齊 justifyright:['justifyright_desc','JustifyRight'], //兩邊對齊 justifyfull:['justifyfull_desc','JustifyFull'], //專案符號列表 bullist:['bullist_desc','InsertUnorderedList'], //編號列表 numlist:['numlist_desc','InsertOrderedList'], //減少縮排 outdent:['outdent_desc','Outdent'], //增加縮排 indent:['indent_desc','Indent'], //剪下 cut:['cut_desc','Cut'], //複製 copy:['copy_desc','Copy'], //貼上 paste:['paste_desc','Paste'], //撤銷 undo:['undo_desc','Undo'], //重做 redo:['redo_desc','Redo'], //增加連結 link:['link_desc','mceLink'], //刪除連結 unlink:['unlink_desc','unlink'], //插入圖片 image:['image_desc','mceImage'], //清理程式碼 cleanup:['cleanup_desc','mceCleanup'], //幫助 help:['help_desc','mceHelp'], //程式碼檢視 code:['code_desc','mceCodeEditor'], //插入水平線 hr:['hr_desc','InsertHorizontalRule'], //清除樣式 removeformat:['removeformat_desc','RemoveFormat'], //顯示/隱藏物件 visualaid:['visualaid_desc','mceToggleVisualAid'], //下標 sub:['sub_desc','sub.'], //上標 sup:['sup_desc','super.'], //插入特殊符號 charmap:['charmap_desc','mceCharMap'], //字型顏色 forecolor:['forecolor_desc','ForeColor'], //前景色 forecolorpicker:['forecolor_desc','mceForeColor'], //背景色 backcolor:['backcolor_desc','HiliteColor'], //背景色食色板 backcolorpicker:['backcolor_desc','mceBackColor'], //插入編輯描點 anchor:['anchor_desc','mceInsertAnchor'], //新建空白文件 newdocument:['newdocument_desc','mceNewDocument'], //引用 blockquote:['blockquote_desc','mceBlockQuote'], //查詢替換 reply:['replace_desc','reply'], //查詢 search:['search_desc','searchreplace']}, stateControls:['search','blockquote','newdocument','anchor','backcolor', 'forecolorpicker','forecolor','font_size','bold','italic','underline', 'strikethrough','bullist','numlist','justifyleft','justifycenter','justifyright', 'justifyfull','sub','sup','blockquote'], init:function(ed,url){var t=this,s,v,o;t.editor=ed;t.url=url;t.onResolveName=new tinymce.util.Dispatcher(this); t.settings=s=extend({ theme_advanced_path:true,theme_advanced_toolbar_location:'bottom', theme_advanced_buttons1:"search,blockquote,newdocument,anchor, backcolor,forecolorpicker,forecolor,fontsizeselect,bold,italic,underline, strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|, styleselect,formatselect", theme_advanced_buttons2:"bullist,numlist,|,outdent,indent,|,undo, redo,|,link,unlink,anchor,image,cleanup,help,code", theme_advanced_buttons3:"hr,removeformat,visualaid,|,sub,sup,|, charmap",theme_advanced_blockformats:"p,address,pre,h1,h2,h3,h4, h5,h6", 對advanced中langs裡的en.js進行的標註 tinyMCE.addI18n('en.advanced',{ style_select:"/u6837/u5F0F", //字型大小 font_size:"/u5B57/u53F7", //加粗 bold_desc:"/u7C97/u4F53 (Ctrl+B)", //斜體 italic_desc:"/u659C/u4F53 (Ctrl+I)", //下劃線 underline_desc:"/u4E0B/u5212/u7EBF (Ctrl+U)", //貫穿線 striketrough_desc:"/u5220/u9664/u7EBF", //左對齊 justifyleft_desc:"/u9760/u5DE6/u5BF9/u9F50", //居中對齊 justifycenter_desc:"/u5C45/u4E2D", //右對齊 justifyright_desc:"/u9760/u53F3/u5BF9/u9F50", //兩邊對齊 justifyfull_desc:"/u5DE6/u53F3/u5BF9/u9F50", //專案符號列表 bullist_desc:"/u9879/u76EE/u7B26/u53F7/u5217/u8868", //編號列表 numlist_desc:"/u7F16/u53F7/u5217/u8868", //減少縮排 outdent_desc:"/u51CF/u5C11/u7F29/u8FDB", //增加縮排 indent_desc:"/u589E/u52A0/u7F29/u8FDB", //剪下 cut_desc:"/u526A/u5207 (Ctrl+X)", //複製 copy_desc:"/u590D/u5236 (Ctrl+C)", //貼上 paste_desc:"/u7C98/u8D34 (Ctrl+V)", //撤銷 undo_desc:"/u64A4/u9500 (Ctrl+Z)", //重做 redo_desc:"/u91CD/u505A (Ctrl+Y)", //增加連結 link_desc:"/u63D2/u5165//u7F16/u8F91/u94FE/u63A5", //刪除連結 unlink_desc:"/u5220/u9664/u94FE/u63A5", //插入圖片 image_desc:"/u63D2/u5165//u7F16/u8F91/u56FE/u7247", //清理程式碼 cleanup_desc:"/u6E05/u7406/u4EE3/u7801", //幫助 help_desc:"/u5E2E/u52A9", //程式碼檢視 code:"/u4EE3/u7801", //插入水平線 hr_desc:"/u63D2/u5165/u6C34/u5E73/u7EBF", //清除樣式 removeformat_desc:"/u6E05/u9664/u6837/u5F0F", //顯示/隱藏物件 visualaid_desc:"/u663E/u793A//u9690/u85CF/u5BF9/u8C61", //下標 sub_desc:"/u4E0B/u6807", //上標 sup_desc:"/u4E0A/u6807", //插入特殊符號 charmap_desc:"/u63D2/u5165/u7279/u6B8A/u7B26/u53F7", //字型顏色 forecolor_desc:"/u524D/u666F/u8272", //背景色 backcolor_desc:"/u80CC/u666F/u8272", //插入編輯描點 anchor_desc:"/u63D2/u5165//u7F16/u8F91/u951A/u70B9", //新建空白文件 newdocument_desc:"/u65B0/u5EFA", //引用 blockquote_desc:"/u5F15/u7528", //查詢 search_desc:"/u67E5/u627E", //查詢替換 replace_desc:"/u67E5/u627E//u66FF/u6362", fontdefault:"/u5B57/u4F53", block:"/u683C/u5F0F", paragraph:"/u6BB5/u843D", div:"/u5C42", address:"/u5730/u5740", pre:"/u9884/u5B9A/u4E49/u683C/u5F0F", h1:"/u6807/u98981", h2:"/u6807/u98982", h3:"/u6807/u98983", h4:"/u6807/u98984", h5:"/u6807/u98985", h6:"/u6807/u98986", blockquote:"/u5F15/u7528", samp:"/u4EE3/u7801/u8303/u4F8B", dt:"/u540D/u8BCD/u5B9A/u4E49", dd:"/u540D/u8BCD/u89E3/u91CA", code_desc:"/u4EE3/u7801/u89C6/u56FE", custom1_desc:"/u5728/u6B64/u8F93/u5165/u63CF/u8FF0", image_props_desc:"/u56FE/u7247/u5C5E/u6027", clipboard_msg:"/u590D/u5236/u3001/u526A/u5207/u548C/u7C98/u8D34/u529F/u80FD/u5728 Mozilla /u548C Firefox /u4E2D/u65E0/u6CD5/u4F7F/u7528/u3002/n/u4F60/u9700/u8981/u4E86/u89E3/u66F4/u591A/u4FE1/u606F/u5417/uFF1F", path:"/u8DEF/u5F84", newdocument:"/u786E/u5B9A/u8981/u5220/u9664/u6240/u6709/u5185/u5BB9/u5E76/u65B0/u5EFA/u4E00/u4E2A/u7A7A/u767D/u6587/u6863/u4E48/uFF1F", toolbar_focus:"/u5B9A/u4F4D/u5230/u5DE5/u5177/u680F - Alt+Q/uFF0C/u5B9A/u4F4D/u5230/u7F16/u8F91/u533A - Alt-Z/uFF0C/u5B9A/u4F4D/u5230/u5143/u7D20/u8DEF/u5F84 - Alt-X/u3002", more_colors:"/u66F4/u591A/u989C/u8272..." //自定義部分 }); 當然還是要根據自己的需要配置好最適合自己的tinymce,網上下的漢化版並不能適用於你,所以建議自己動手配置,不懂的再問我~! 本文出自 “開拓世界領先的WEB技術” 部落格,請務必保留此出處http://opper.blog.51cto.com/628423/124385 附件下載:   Tinymce3.2漢化版   Tinymce3.2官方簡體中文漢化包