**在編輯文章時能夠以內嵌(embed)撥放器
Step 1:修改tiny_mce-plog.js
修改 tiny_mce-plog.js
在 extended_valid_elements : 後方加入 embed[EnableContextMenu|src|autostart|loop|width|height]
如下:
extended_valid_elements : "a[class|name|href|target|title|onclick],img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name],hr[class|width|size|noshade],font[face|size|color|style],span[class|align|style],embed[EnableContextMenu|src|autostart|loop|width|height]",
參考文章:
lifetype中文論壇文章
http://forum.lifetype.org.tw/index.php?topic=1445.msg8496#msg8496
Step 2:替換tiny_mce-plog-resourcelist.js
請參考lifetype中文論壇文章
http://forum.lifetype.org.tw/index.php?topic=1700.0
或james的文章
http://stu.dhjh.tp.edu.tw/plog/index.php?op=ViewArticle&articleId=978&blogId=3
範例:
http://hoher.idv.tw/plog/index.php?op=ViewArticle&articleId=1078&blogId=1
**為迴響區加入Tinymce的功能
我是參考lss的blog教學,如下:
http://blog.nlhs.tyc.edu.tw/post/2/63
Step 1:
系統調整設定,請參考lss的文章
Step 2:
在模版檔案commentform.template的最上面加入下面兩行
<script language="javascript" type="text/javascript" src="{$url->getBaseUrl()}/js/tinymce/jscripts/tiny_mce/tiny_mce.js"></script>
<script language="javascript" type="text/javascript" src="{$url->getBaseUrl()}/js/tinymce/jscripts/tiny_mce/tiny_mce-commentform.js"></script>
並將slime的plugin語法刪除,因為tinymce已經有內建表情符號,故我便把原來的表情符號plugin語法刪除
Step 3:
將下面內容存成 tiny_mce-commentform.js,並放在 /js/tinymce/jscripts/tiny_mce/ 目錄
(放置的路徑要與Step1的第二行相同)
tinyMCE.init({
mode : "textareas",
//theme : "advanced", // 這個是預設值,所以可以省略!
relative_urls : false, // 網址不使用相對路徑。
plugins : " emotions", // 啟用表情符號外掛。要加入其他外掛,則是用逗號分隔。請參考這裡。
theme_advanced_buttons1 : "" // 依序加入 粗/斜/底/刪/縮排/凸排/連結/取消連結/表情符號
+"bold,italic,underline,strikethrough,outdent,indent,link,unlink,emotions",
theme_advanced_buttons2 : "", // 第二工具列不要按鈕。
theme_advanced_buttons3 : "", // 第三工具列不要按鈕。
language : "zh_tw", // 使用繁體中文語系。請確認你有語系檔,我是自己做的中文化,沒做完。
theme_advanced_toolbar_location : "top", // 工具列靠上。
theme_advanced_toolbar_align : "left", // 工具列靠左。
force_p_newlines : false // 讓按 Enter 由 <p> (段落) 改成 <br> (換行) 。請參考這裡。
force_br_newlines : true // 但改好後發現在打文字時無法段行,才發現要另外加入
})
force_br_newlines : true 是後來發現無法斷行,在該篇文章的迴響區看到解決方法的!!!
language : "zh_tw", 我的則是改成 zh_tw_utf8(參考Step4)
theme_advanced_buttons1 : 增加功能 (參考Step6)
Step 4:將語系檔放置相對目錄
我的目錄為==>/js/tinymce/jscripts/tiny_mce/langs/
我在step2裡的設定為language : "zh_tw_utf8",故將原本舊版tinymce裡的語系檔
zh_tw_utf8.js 放到相對目錄,新版沒這個語系
Step 5: 修改表情符號(非必要步驟)
因為對於內建的表情符號覺得笑點不夠,所以自行到網路上的一些討論版抓取圖檔
把原把tinymce裡的表情符號皆修改掉,表情符號放置的路徑如下
/js/tinymce/jscripts/tiny_mce/plugins/emotions/images/
將下載下來的檔名修改成目錄裡的相對檔名即可
範例參考:下方迴響區
http://hoher.idv.tw/plog/index.php?op=ViewArticle&articleId=1080&blogId=1
Step6: 修改迴響區的功能選項(非必要)
我增加了插入圖片的功能,但這個功能是非必要,也有人建議不要增加
修改檔案 tiny_mce-commentform.js
如下
theme_advanced_buttons1 : "" // 依序加入 粗/斜/底/刪/縮排/凸排/連結/取消連結/表情符號
+"bold,italic,underline,strikethrough,outdent,indent,link,unlink,emotions",
在下方功能代碼加入要增加的功能,例如我加入插入圖片功能(image),修改如下
theme_advanced_buttons1 : "" // 依序加入 粗/斜/底/刪/縮排/凸排/連結/取消連結/表情符號
+"bold,italic,underline,strikethrough,outdent,indent,link,unlink,emotions,image",
如果還想加入更多的功能,你可以參考tiny_mce-plog.js裡的代碼來加入
****編輯區字體大小的調整
請參考阿駕零零壹的文章
http://twntwn.info/blog/ajer001/archives/553
修改時我是將所有font-size: 12px;
改成font-size: 14px;
以上感謝
lss http://blog.nlhs.tyc.edu.tw/2
James http://stu.dhjh.tp.edu.tw/plog/3
Jerome http://beb.anyday.com.tw/
阿駕零零壹 http://twntwn.info/blog/ajer001/
華龍國小Lifetype學習網 http://plog.hlps.tcc.edu.tw/plog/blog/2
阿杰老師的部落格實驗室
Step 1:修改tiny_mce-plog.js
修改 tiny_mce-plog.js
在 extended_valid_elements : 後方加入 embed[EnableContextMenu|src|autostart|loop|width|height]
如下:
extended_valid_elements : "a[class|name|href|target|title|onclick],img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name],hr[class|width|size|noshade],font[face|size|color|style],span[class|align|style],embed[EnableContextMenu|src|autostart|loop|width|height]",
參考文章:
lifetype中文論壇文章
http://forum.lifetype.org.tw/index.php?topic=1445.msg8496#msg8496
Step 2:替換tiny_mce-plog-resourcelist.js
請參考lifetype中文論壇文章
http://forum.lifetype.org.tw/index.php?topic=1700.0
或james的文章
http://stu.dhjh.tp.edu.tw/plog/index.php?op=ViewArticle&articleId=978&blogId=3
範例:
http://hoher.idv.tw/plog/index.php?op=ViewArticle&articleId=1078&blogId=1
**為迴響區加入Tinymce的功能
我是參考lss的blog教學,如下:
http://blog.nlhs.tyc.edu.tw/post/2/63
Step 1:
系統調整設定,請參考lss的文章
Step 2:
在模版檔案commentform.template的最上面加入下面兩行
<script language="javascript" type="text/javascript" src="{$url->getBaseUrl()}/js/tinymce/jscripts/tiny_mce/tiny_mce.js"></script>
<script language="javascript" type="text/javascript" src="{$url->getBaseUrl()}/js/tinymce/jscripts/tiny_mce/tiny_mce-commentform.js"></script>
並將slime的plugin語法刪除,因為tinymce已經有內建表情符號,故我便把原來的表情符號plugin語法刪除
Step 3:
將下面內容存成 tiny_mce-commentform.js,並放在 /js/tinymce/jscripts/tiny_mce/ 目錄
(放置的路徑要與Step1的第二行相同)
tinyMCE.init({
mode : "textareas",
//theme : "advanced", // 這個是預設值,所以可以省略!
relative_urls : false, // 網址不使用相對路徑。
plugins : " emotions", // 啟用表情符號外掛。要加入其他外掛,則是用逗號分隔。請參考這裡。
theme_advanced_buttons1 : "" // 依序加入 粗/斜/底/刪/縮排/凸排/連結/取消連結/表情符號
+"bold,italic,underline,strikethrough,outdent,indent,link,unlink,emotions",
theme_advanced_buttons2 : "", // 第二工具列不要按鈕。
theme_advanced_buttons3 : "", // 第三工具列不要按鈕。
language : "zh_tw", // 使用繁體中文語系。請確認你有語系檔,我是自己做的中文化,沒做完。
theme_advanced_toolbar_location : "top", // 工具列靠上。
theme_advanced_toolbar_align : "left", // 工具列靠左。
force_p_newlines : false // 讓按 Enter 由 <p> (段落) 改成 <br> (換行) 。請參考這裡。
force_br_newlines : true // 但改好後發現在打文字時無法段行,才發現要另外加入
})
force_br_newlines : true 是後來發現無法斷行,在該篇文章的迴響區看到解決方法的!!!
language : "zh_tw", 我的則是改成 zh_tw_utf8(參考Step4)
theme_advanced_buttons1 : 增加功能 (參考Step6)
Step 4:將語系檔放置相對目錄
我的目錄為==>/js/tinymce/jscripts/tiny_mce/langs/
我在step2裡的設定為language : "zh_tw_utf8",故將原本舊版tinymce裡的語系檔
zh_tw_utf8.js 放到相對目錄,新版沒這個語系
Step 5: 修改表情符號(非必要步驟)
因為對於內建的表情符號覺得笑點不夠,所以自行到網路上的一些討論版抓取圖檔
把原把tinymce裡的表情符號皆修改掉,表情符號放置的路徑如下
/js/tinymce/jscripts/tiny_mce/plugins/emotions/images/
將下載下來的檔名修改成目錄裡的相對檔名即可
範例參考:下方迴響區
http://hoher.idv.tw/plog/index.php?op=ViewArticle&articleId=1080&blogId=1
Step6: 修改迴響區的功能選項(非必要)
我增加了插入圖片的功能,但這個功能是非必要,也有人建議不要增加
修改檔案 tiny_mce-commentform.js
如下
theme_advanced_buttons1 : "" // 依序加入 粗/斜/底/刪/縮排/凸排/連結/取消連結/表情符號
+"bold,italic,underline,strikethrough,outdent,indent,link,unlink,emotions",
在下方功能代碼加入要增加的功能,例如我加入插入圖片功能(image),修改如下
theme_advanced_buttons1 : "" // 依序加入 粗/斜/底/刪/縮排/凸排/連結/取消連結/表情符號
+"bold,italic,underline,strikethrough,outdent,indent,link,unlink,emotions,image",
如果還想加入更多的功能,你可以參考tiny_mce-plog.js裡的代碼來加入
****編輯區字體大小的調整
請參考阿駕零零壹的文章
http://twntwn.info/blog/ajer001/archives/553
修改時我是將所有font-size: 12px;
改成font-size: 14px;
以上感謝
lss http://blog.nlhs.tyc.edu.tw/2
James http://stu.dhjh.tp.edu.tw/plog/3
Jerome http://beb.anyday.com.tw/
阿駕零零壹 http://twntwn.info/blog/ajer001/
華龍國小Lifetype學習網 http://plog.hlps.tcc.edu.tw/plog/blog/2
阿杰老師的部落格實驗室
全站熱搜
留言列表