WordPress カスタムクイックタグの追加

WordPress QuickTags API を使用すると、WordPress 管理者テキストエディターにボタンを追加できます。正直に言うと、テキストエディターはおそらくリッチエディターほど使用されていません。ちなみに、クイックタグを追加すると、同じタスクを頻繁に繰り返す場合に非常に役立ちます。

WordPress で提供されるデフォルトのクイックタグのリストは次のとおりです。

ご覧のとおり、さまざまなタイプのボタンを作成し、それぞれにアクセスキーを割り当て、独自のカスタムコードを簡単に定義できます。

クイックタグを追加するには、カスタム関数を admin_print_footer_scripts フックにフックする必要があります。基本的に、管理フッター内にカスタム JavaScript コードを追加するというアイデアです。クイックタグ API には、addButton という組み込み関数が用意されています。

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

この関数は 8 つの引数を受け取ります。

id: (文字列) (必須) ボタンの HTML ID
display: (string) (必須) ボタンの HTML 値
arg1: (string) (必須) 「<span>」のような挿入される開始タグ、またはボタンがクリックされたときに実行されるコールバックのいずれか
arg2: (文字列) (オプション) 「」のような終了タグ。タグを閉じる必要がない場合は空のままにしておきます（つまり、「
」）
access_key: (文字列) (オプション) ボタンのショートカットアクセスキー
title: (文字列) (オプション) ボタンの HTML タイトル値
優先度: (int) (オプション) ツールバー内のボタンの希望の位置を表す数値。 1 ～ 9=1 番目、11 ～ 19=2 番目、21 ～ 29=3 番目など
インスタンス: (文字列) (オプション) ボタンをクイックタグの特定のインスタンスに制限し、存在しない場合はすべてのインスタンスに追加します

WPExplorer リンクをエディターに追加する完全なスニペットを次に示します。

// Add buttons to html editor
add_action('admin_print_footer_scripts','rc_quicktags');
function rc_quicktags() { ?>
	<script language="javascript" type="text/javascript">
		/* Adding Quicktag buttons to the editor WordPress ver. 3.3 and above
		* - Button HTML ID (required)
		* - Button display, value="" attribute (required)
		* - Opening Tag (required)
		* - Closing Tag (required)
		* - Access key, accesskey="" attribute for the button (optional)
		* - Title, title="" attribute (optional)
		* - Priority/position on bar, 1-9 = first, 11-19 = second, 21-29 = third, etc. (optional)
		*/
		QTags.addButton( 'WPexplorerlove', 'WPexplorerlove', '<a href="http://wpexplorer.com" target="_blank">', '</a>', 'w' );
	</script>
<?php
}

結果は次のとおりです。

このクイックタグを使用するには、タグを 1 回クリックすると、<a> タグの先頭が挿入され、テキストが追加され、ボタンをもう一度クリックすると、終了タグが追加されます。それでおしまい！

ご質問やご提案がございましたら、コメントを残してください。