WordPressの投稿作成画面にタグボタン（クイックタグ）を追加する
公開:
WordPressカスタム
WordPressの投稿記事を作成や編集する画面にあるクイックタグは便利ですが正直もう少し色々欲しいところ、「ここによく使うタグやショートコードがあれば便利なのに」と思ったりします。
そんな訳でプラグイン無しでクイックタグを追加する方法を調べたのでメモします。
プラグインを使ってクイックタグを追加する方法はページ下にある関連リンクを参照下さい。
スポンサーリンク
正直、私はプログラミングに関しては初心者かそれ以下なのでコードの書き換え・追加は自己責任でお願いします。
クイックタグを追加する方法
function.phpに以下を追記することでクイックタグが追加されます。
|
1 2 3 4 5 6 7 8 9 |
//クイックタグ function add_my_quicktag() { ?> <script type="text/javascript"> QTags.addButton('ID', 'ボタンのラベル', '開始タグ', '終了タグ'); </script> <?php } add_action('admin_print_footer_scripts','add_my_quicktag'); |
(‘ID’, ‘ボタンのラベル’, ‘開始タグ’, ‘終了タグ’)
- IDは任意で作成。
- ラベルはボタンに表示される文字。
- 開始・終了はボタンに記憶させたいタグ。
具体的にきん猫の場合以下のものを追加していますが、コピペオンリーなきん猫にはかなり役に立っています。
実際のコードは以下。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
//クイックタグ function add_my_quicktag() { ?> <script type="text/javascript"> //QTags.addButton('ID', 'ボタンのラベル', '開始タグ', '終了タグ'); QTags.addButton('ads0','アド','[adsense]\n',''); QTags.addButton('kakoi0','背景灰','<kakoi>','</kakoi>\n'); QTags.addButton('blue','太','<b>','</b>'); QTags.addButton('mojigi','文字変','<span style="font-size: 14px; color: #888;">','</span>'); QTags.addButton('smooth0','アンカー発','<a href="#smoothplay0">','</a>'); QTags.addButton('smooth1','アンカー着','<p id="smoothplay0">','</p>'); </script> <?php } add_action('admin_print_footer_scripts','add_my_quicktag'); |
- 「アド」はアドセンス用のショートコードで終了タグは無いので無記入。
- 「背景灰」はCSSに追記したスタイルID名。
- 「太」は強調（strong）ではないただの太字。
- 「文字変」は文字の大きさと色のスタイル。
- 「アンカー発・着」はページ内リンク用。
こんな感じで追加しています。
使っているWordPressテーマ（STINGER3）のfunction.phpの最後（php終了タグの前）に追記しただけで問題なく機能していますが、くれぐれも自己責任でお願いします。
関連リンク
今回のクイックタグ追加はウェブシュフさんのブログ「web shufu」内記事「WordPress投稿画面のボタンの使い方、ボタンを追加・削除してカスタマイズする方法」を参考（そのまま？）にして書いています。
上のページにはクイックタグの使い方やプラグインを使ってクイックタグを追加する方法も書かれています。
ad
関連記事
-
-
WordPressのJetpack共有に追加したSNSボタンの高さを合わせる
この記事は個人的なメモです。 プラグインJetpackの更新で追加した共有ボタンの高さが合わな
-
-
プラグイン無しでスムーズスクロール stinger3
スムーズスクロールはこんな感じのやつです。 スムーズスクロールを体験する
-
-
タグクラウドの文字サイズ調整 stinger3
stinger3のカスタムという訳ではありませんがWordPressのウィジ
-
-
404エラーページ編集 stinger3
とくにメモ記事にするほどの事ではありませんがメモしときます。 &nbs
-
-
スマホページにヘッダー画像を入れる stinger3
スマホページにヘッダー画像を入れる 外観→テーマ編集→smart.css
