AddQuicktagの使い方と設定方法について〜ブログ運営には必須のプラグイン〜

こんにちは、テンテンです。

先日、こんなご相談を受けました。

今回はそんな方の為にWordPressで必須プラグインの一つといっても過言でない、AddQuicktagの設定方法と使い方について解説します。

ブログ運営初心者の方でも簡単にわかるように画像付きで解説させていただきます。

AddQuicktagをインストールしよう

すでにプラグインをインストールする方法をご存知の方は、読み飛ばしていただいて問題ございません。

①WordPressの管理画面から「プラグイン」→「新規追加」に進みます

②右上の赤枠の箇所に「AddQuicktag」と入力して、「今すぐインストール」を行い、「有効化」します。

※画像では「有効」となっておりますが、当ブログではすでにインストール済みな為です。

これでインストールは完了です。簡単ですよね！

AddQuicktagの初期設定と使い方について

まずAddQuicktagの初期設定についてですが、特別な初期設定は必要ありませんので、使い方について解説をしていきます。

使い方を解説する前に、使いたいタグを探しましょう。

例として、囲み枠でおしゃれなデザインを探したいとします。その場合、Googleで「囲み枠 CSS」で検索してみます。

こんな感じで、たくさん引っかかってくると思います。

これらのサイトは、ブログ運営初心者の方でも簡単にブログデザインができるように、サンプルコードなどを載せています。

HTMLやCSSについての知識がない方は、こういったところから使わせてもらった方が良いです。
※もちろん無料で使えますよ！

個人的にオススメなのが、サルワカです。HTMLやCSSについても初心者の方でもわかりやすく学ぶことができるサWebサイトです。

基本的には、ここじゃないとダメということはないので、自分の好みにあったモノをお探しください。

早速、AddQuicktagの使い方の解説に入ります。

AddQuicktagの使い方について

①「設定」→「AddQuicktag」に進みます。

②主な入力箇所は4つ（ボタンのラベル、開始タグ、終了タグ、一番右の四角い枠）

基本的にこの4項目の入力だけで問題ないです。
※アクセスキーの下に順番とあるが、これはタグの順番です。特に気にしない人は入力しなくても良いです。その場合、保存をすると自動で０になります。

早速、聞きなれない言葉、（HTMLの開始タグとHTMLの終了タグ）が出てきましたね。わかりやすく解説していくのでご安心ください！

HTMLの開始タグと終了タグはどこ!?

仮に上記のHTMLコードがあるとします。この場合、悩むのが、どこがHTMLの開始タグで終了タグなのかよくわからない点です。

この知識を理解したら、AddQuicktagの設定画面に戻りましょう。

下記の画像のように、ボタンのラベル、HTMLの開始タグ、終了タグを入力して、最後にチェックを入れます。

これでAddQuicktagの設定は完了です。

次はCSSのコードを入力していく必要があります。

CSSのコードを入力しよう！

次にCSSのコードを入力していく必要があります。

少しわかりくい表現になるかもしれませんが、HTMLというのはあくまでも骨組みです。実際のデザインはCSSが担当します。

つまり、現在のここまでの設定は、AddQuicktagにHTMLコードを入力しただけなので、デザインまでは反映しません。

早速、CSSのコードを入れていきましょう！

ここではブログ初心者の方でもわかりやすいように、「追加CSS」にコードを入力する方法をご紹介します。

①「外観」→「カスタマイズ」に進みます。

②「追加CSS」に進みます。

③画像のようにCSSのコードをコピー＆ペーストします。

最後に保存して完了です。

では、早速試してみましょう！！

①WordPressの管理画面で適当な記事を開き、赤枠で囲っているQuicktagをクリックします。

②Quicktagをクリックすると、自分が登録したタグの情報が一覧で表示されます。

最後に、デザインをしたい文字を指定して、登録したタグを選択するだけです。

③プレビューで確認しよう！

④完成

今回は黄色のアンダーバーで登録したので、このような表示になっています。

以上でAddQuicktagの使い方の解説は以上です。

最後まで読んでいただき、ありがとうございました。