為WordPress迴響表單添加Quicktags按鈕

以前分享過 WordPress TinyMCE 編輯器增強技巧大全 和 WordPress 添加自定義編輯按鈕的外掛：AddQuicktag，都提到瞭 Quicktags，但那都是添加到後臺剪輯器的，今天主要分享下WordPress迴響表單添加Quicktags按鈕的方法。

如果你不會折騰代碼，安裝 Basic Comment Quicktags 或 Comment Form Quicktags 外掛即可。

如果你會折騰代碼，不妨試試 @zwwooooo 大師的方法：

1. 在主題目錄裡建立個文件：my_quicktags.js，內容如下

1
2
3
4
5
6
7
8
9

//設置quicktags
quicktags({
	id: "comment", //迴響框的ID，一般為 comment，根據自己主題設置
	buttons: "strong,em,del,link,code" //內置有這些，根據自己需求選吧: strong,em,link,block,del,ins,img,ul,ol,li,code,more,spell,close
});
//默認的引用（block）插入很蛋疼，所以自己定義瞭一個
QTags.addButton('quote','quote','<blockquote>','</blockquote>','quote');
//另外定義瞭個“下劃線”，其它舉一反三
QTags.addButton('U','U','<u>','</u>','U');

//設置quicktags
quicktags({
id: "comment", //迴響框的ID，一般為 comment，根據自己主題設置
buttons: "strong,em,del,link,code" //內置有這些，根據自己需求選吧: strong,em,link,block,del,ins,img,ul,ol,li,code,more,spell,close
});
//默認的引用（block）插入很蛋疼，所以自己定義瞭一個
QTags.addButton(‘quote’,’quote’,'<blockquote>’,'</blockquote>’,’quote’);
//另外定義瞭個“下劃線”，其它舉一反三
QTags.addButton(‘U’,’U’,'<u>’,'</u>’,’U’);

2. 加載 jQuery 庫和js文件，在主題文件 functions.php 加入如下代碼：

1
2
3
4
5
6
7
8

if ( comments_open() && is_singular() ) {
	function zfunc_print_script() {
		wp_enqueue_script( 'jquery' ); //加載jQuery庫，如果主題已經加載瞭jQuery庫，可以不用這一行
		wp_enqueue_script( 'quicktags' ); //加載js quicktags
		wp_enqueue_script( 'my_quicktags', get_template_directory_uri() . '/my_quicktags.js', array('my_quicktags','jquery'), '1.0', 1,true); //加載第1步建立的my_quicktags.js文件
	}
	add_action('wp_enqueue_scripts', 'zfunc_print_script');
}

if ( comments_open() && is_singular() ) {
function zfunc_print_script() {
wp_enqueue_script( ‘jquery’ ); //加載jQuery庫，如果主題已經加載瞭jQuery庫，可以不用這一行
wp_enqueue_script( ‘quicktags’ ); //加載js quicktags
wp_enqueue_script( ‘my_quicktags’, get_template_directory_uri() . ‘/my_quicktags.js’, array(‘my_quicktags’,’jquery’), ‘1.0’, 1,true); //加載第1步建立的my_quicktags.js文件
}
add_action(‘wp_enqueue_scripts’, ‘zfunc_print_script’);
}

這樣就可以啦！