strongタグ乱用防止「ダメ。ゼッタイ。」WordPressクイックタグのbボタンに気をつけろ!【後編】~Quicktags API~

wp-quicktag-b-btn-top

どーも、dice(@dice_dDtea)です。

WordPressで記事を書く上で、
クイックタグの「b」ボタンと「i」ボタンにはSEO的に危険を秘めています。

前回は、その解決法の一つとして、
Wordpressプラグインの「AddQuicktag」を用いた解決方法を解説しました。

今回はプラグインを使わない方法を解説したいと思います。
function.php に記述するだけの方法です。
サイトを重くしたくないので、余計なプラグインを避けたがるユーザーはコッチが良いでしょう。

おしながき

・Quicktags APIで、プラグインを使わず function.php に書き込んでなんとかする
・不要なデフォルトのボタンを非表示にする

【前回の記事】
・強調系htmlタグのおさらいというか認識の確認
・プラグイン「AddQuicktag」でなんとかする

スポンサード リンク

プラグインを使わず function.php でなんとかしたい!

Quicktags API

Quicktags API ってのを使います。
QuickTime(.mov)じゃないです、Quicktags です。

解説を探したんですが英語のソースしか見当たらないですね・・・。
どーも、diceは英語を「読む」のはなんか腰が引けて避けてしまいます、だってメンド臭ェもん(苦笑)

The Quicktags API allows you to include additional buttons in the Text (HTML) mode of the WordPress editor.
出典: Quicktags API « WordPress Codex

WordPress上のエディターの、HTMLを編集する「テキストモード」
そのモードの「クイックタグボタン」を管理できるAPIだそうです。

わざわざ「the Text (HTML) mode」と名指しなんで、
WYSIWYG編集な「ビジュアルモード」は範疇外なようですね。

Quicktags API の書式

QTags.addButton( id, display, arg1, arg2, access_key, title, priority, instance );

Quicktags API の引数は全部で8つ

・id
【必須項目】【文字列】
The html id for the button.
よーは、ID

・display
【必須項目】【文字列】
The html value for the button.
よーは、ボタンのラベル

・arg1
【必須項目】【文字列】
Either a starting tag to be inserted like “<span>” or a callback that is executed when the button is clicked.
よーは、開始タグ

・arg2
【オプション】【文字列】
Ending tag like “</span>”. Leave empty if tag doesn’t need to be closed (i.e. “<hr />”).
終了タグ(閉じタグがない<br>とか<hr>とかの場合、ここは省略する項目)
初期値:None

・access_key
【オプション】【文字列】
Shortcut access key for the button.
よーは、ショートカットの割り当て(っぽいね)
初期値:None

・title
【オプション】【文字列】
The html title value for the button.
よーは、ロールオーバーした時の表示名(だろうね)
初期値:None

・priority
【オプション】【数値(整数)】
A number representing the desired position of the button in the toolbar. 1 – 9 = first, 11 – 19 = second, 21 – 29 = third, etc.
よーは、表示位置を指定するところに使う引数。
ここだけは文字列ではなく、整数である数値を指定。
初期値:None

・instance
【オプション】【文字列】
Limit the button to a specific instance of Quicktags, add to all instances if not present.
よーは、引数に指定したインスタンスに制限する・・・、
なるほどよくわからん!詳しく調べたら加筆しますね。
初期値:None

Quicktags API でボタンを追加

とりあえず、Quicktags API を使って、

function add_my_quicktag(){ 
?>
	<script type="text/javascript">
		QTags.addButton(
			'ID',
			'ボタンのラベル',
			'開始タグ',
			'終了タグ'
		);
	</script>
<?php
}

add_action('admin_print_footer_scripts','add_my_quicktag');

これが基本形です。
これを function.php のどっかに仕込めばボタンが追加されます。

<b>タグと<i>タグのボタンを追加する

それでは、<b>タグのボタンと、
<i>タグのボタンを追加してみましょう。

function add_my_quicktag(){ 
?>
	<script type="text/javascript">
		QTags.addButton('b_tag','bタグ','<b>','</b>');
		QTags.addButton('i_tag','iタグ','<i>','</i>');
	</script>
<?php
}

add_action('admin_print_footer_scripts','add_my_quicktag');

これを function.php の好きなところに追加します。

そうすると・・・、
wp-quicktag-b-btn21
見事追加成功!

動作確認します・・・、
wp-quicktag-b-btn22

はい、問題なく追加できました!
それでは、いらないボタンも消しましょうか?

使わないデフォルトのボタンを非表示にしたい

下記のソースコードをが基本形です。

function default_quicktags($qtInit) {
	$qtInit['buttons'] = 'b,em,link,b-quote,del,ins,img,ul,ol,li,code,more,close';
	return $qtInit;
}
add_filter('quicktags_settings', 'default_quicktags', 10, 1);

これを適宜いじって、function.php に書き加えてください。

キモはココです。2番目の行。

$qtInit['buttons'] = 'b,em,link,b-quote,del,ins,img,ul,ol,li,code,more,close';

表示させたい項目を残し、
いらないものを消します。

最初の基本形のソースの状態では、デフォルト全て表示します。
なのでこのまま function.php に加えても何も変化がないはずです。

「bボタン」と「iボタン」を非表示にする

それでは、「bボタン」と「iボタン」を消しましょう。

「b」と「em」を消したモノが以下の通りです。

function default_quicktags($qtInit) {
	$qtInit['buttons'] = 'link,b-quote,del,ins,img,ul,ol,li,code,more,close';
	return $qtInit;
}
add_filter('quicktags_settings', 'default_quicktags', 10, 1);

これを function.php に書き加えれば、「bボタン」と「iボタン」を非表示になります。
結果がこれです。
wp-quicktag-b-btn23
はい、見事に消えましたね。

使わないボタンはこの際、非表示にする

ついでに、この際ですから使わないものを消していきましょう!

diceは、
「リンク」「delタグ」「insタグ」「imgタグ」「more」「タグを閉じる」だけ残し、
他を非表示にさせたいと思います。

function default_quicktags($qtInit) {
	$qtInit['buttons'] = 'link,del,ins,img,more,close';
	return $qtInit;
}
add_filter('quicktags_settings', 'default_quicktags', 10, 1);

これが結果です。
wp-quicktag-b-btn24
随分スッキリしました!

みなさんも自分仕様にカスタマイズして使い勝手を良くしていきましょうね!!

function.phpを弄る のメリットとデメリット

メリットは、
・ブラックボックス的な内部のよく分からないところにゴミが残らないので、気軽にやめることもできる。
・バージョンアップしても基本的に大勢に影響は無し。
・Wordpress仕様変更しても自分次第でいつでも対応ができる。
・PHPやfunction.phpの理解も深まり、プラグインが作れる自信が湧く。

デメリットは、
・PHPを勉強しないといけない。
・Wordpress仕様変更に対して自分で対処しないと動かなくなるし、自己責任。
・なのでメンドクサがりはちとメンドウ


コメント

Facebookコメント

※コメントしたけど表示されてない方へ

パーマリンクを変えてしまったおかげで表示されなくなってしまいました。
折角コメントいただいたのにスイマセンm(__)m
パーマリンク変更しても何とか表示できる方法を現在模索中です。

“Facebookコメント”じゃないコメントを残す

このコメント欄は一時的に且つ試験的に復活させ実装させています。スパムが増加すると廃止します。なのでできるだけFacebookのコメントでコメントをお願いします。m(__)m
なお、メールアドレスは公開されることはありません。

コメントを残す