WordPressに「AddQuicktag」を導入してタグ入力を楽チンに！
2015/10/11
こんにちは、okutani(@okutani_t)です。WordPressで記事を書いていると、見出しでh2タグやh3タグ等をよく使うと思います。その際、いちいち手入力で<h2></h2>と打つのはめんどうだし、辛いですよね。
そんなときはAddQuicktagプラグインを導入してみましょう。ボタンひとつで設定したタグが簡単に記事内に挿入されて「非常」に便利です(本当に便利です)。
私はこのAddQuickTagがないと記事が書けないぐらい、かなり頻繁に使っています。
また、タグを挿入する以外にも＋αの機能があるので、本記事で合わせてご紹介したいと思います。
では、さっそくAddQuicktagを導入してみましょう。
スポンサーリンク
もくじ
AddQuicktagの導入
ダッシュボードから「プラグイン」→「新規追加」を選択します。
右上の検索バーに「AddQuicktag」と入力して検索、「いますぐインストール」をクリック。
インストールが完了したら「プラグインを有効化」を選択しましょう。
これでAddQuicktagの導入が完了しました。では、AddQuicktagに使いたいタグをどんどん設定していきましょう。
AddQuicktag設定方法
AddQuicktagを利用して、使いたいタグを設定していきます。
利用したいタグを設定する
管理画面から「設定」→「AddQuicktag」でAddQuickTagの設定画面を開きます。
「クイックタグの追加と削除」に設定を記述していきましょう。値は次のように入力します。
- ボタン名
- ラベル名
- 開始タグ＆終了タグ
- 順番
記事投稿時に表示される名前
タグの説明です。未入力でもOK
タグの開始と終了をそれぞれ入力します。開始タグのみでもOK
タグを表示する順番を入力
私は設定していませんが、「アクセスキー」はIEで使えるショートカットで、「Alt」+「アクセスキー」で簡単に入力できるようになります。お好みで設定してください。
h2タグを設定する場合は下記の通りです。入力が終わったら、一番右端のチェックをクリックします。
入力が終わったら「変更を保存」ボタンをクリックして反映させましょう。
設定の確認
設定が反映されたか確認してみます。記事作成画面を開きましょう。
h2ボタンを2回クリックすることで、h2タグをかんたんに記事内に入力することができました。
また、囲いたい文字を範囲指定してボタンを押すことで、先頭とおしりにまとめてタグを挿入することもできます。
既にあるタグボタンを非表示にする
AddQuicktagプラグインでは、既にWordPress側で用意してあるあるタグボタンを非表示にできる機能が備わっています。先ほどの設定画面にある「Remove Core Quicktag buttons」から設定してみましょう。
このように、削除したいタグの一番右端のチェックをクリックし、「変更を保存」ボタンを押せばデフォルトのタグを非表示にすることができます。
普段よく使うボタンだけを配置するようにすれば、今までより記事を書くスピードがアップすること間違いなしですね。
次の項目で、＋αのおまけ項目を設定してみましょう。
HTMLタグ変換ボタンを追加
記事内でHTMLタグをそのまま表示させたい場合があるかと思います。その際、入力文字がタグとして認識されてしまい、うまく表示できない場面に出くわします。
記事内でタグをそのまま表示できるように変換する機能が、AddQuicktagには備わっています。利用してみましょう。
先ほどの設定画面から「Enhanced Code Quicktag buttons」項目の「htmlentities」右端にチェック、「変更を保存」をクリックします。
記事作成画面を開いてみると、「HTML entities」「Decode HTML」ボタンが追加されています。
変換したいタグを範囲指定して、HTML entitesボタンを押すと、記事で表示できる形に変換されます。逆に、Decode HTMLボタンを押すと、元の形に変換してくれます。
投稿して確認してみます。
そのままでは表示できなかったHTMLタグが記事内で表示できました。タグの説明がしたい場合なんかに使えるのではないでしょうか。
AddQuicktagの導入と設定は以上です。お疲れ様でした。
まとめ
普段使うタグは積極的に追加して、いらないタグはどんどん非表示にしていきましょう。かなり使い勝手がよくなるかと思います。
HTMLタグの変換挿入は、地味に便利なので有効化しておくことをオススメします。
Web開発のお仕事を募集しています
フリーランスのエンジニアとして、Webシステム開発のお仕事依頼を随時募集しています（現在の業務量によってお受けできない場合もあります）。
「Ruby on Rails」「JavaScript（jQuery, Reactなど）」「HTML + CSS」を用いたシステム開発、「Heroku」等を用いたサーバー構築・運用、「Git」や「GitHub」を利用したソーシャルコーディングなどに対応しています。
ご依頼を検討している方は、下記リンク本ブログからのお問い合わせ、もしくはokutaniのポートフォリオからご連絡ください。
LINKお問い合わせ
スポンサーリンク
