AddQuickTag 簡単設定と上手な活用方法を解説します

AddQuickTag は、エディターに機能追加するための WordPress用プラグインです。

よく使うタグをプラグインにセットするだけでテキストエディターやビジュアルエディターから使いたいコードを一発で呼び出せる。

今やブログを更新するのに欠かせないプラグインの設定方法と使い方、またどのように効率化を図っているのかを一部公開して解説します。

プラグインの特徴

AddQuickTag を上手く活用すれば記事作成時間の大幅な短縮が見込めます。逆にいえば、活用できなければ意味がないとも言える。そんなユーザーの活用方法が問われるのも特徴です。

タグが簡単に挿入できるという働きを持つプラグインの、主な機能はこんな感じ。

  • タグやコードをボタンやリスト化
  • 開始タグと終了タグを一度で挿入
  • ボタン表示をカスタマイズ
  • 設定内容のインポートやエクスポート
  • タグに限らず記事丸ごと設定も可能

こんな感じでプラグインの機能は、とてもシンプルです。どちらかというと、どのような活用ができるのかが重要です。

 

プラグインの活用

ただ単純によく使うタグを設定してボタンやリストにしておくだけでも十分価値はあるけど、他のブログの印象的な装飾を一度設定しておけば、いつでも記事に反映させることができる。

面倒なタグ打ちがなくなった分、装飾にも手がかけられるというわけです。

 

たとえば。。。

  • マーカーやラベルなどの文字装飾
  • オリジナルフォントやアイコンフォント
  • 画像付きリンク
  • ショートコード
  • 画像付き定型文

こんな感じで使い方はさまざま。ただ、こうしてブログを簡単にアレンジできることでユーザーに見やすいサイト作りが可能になります。

 

プラグインの設定

きいりん

このマークを見かけたら
クリックしてね

まずはプラグインの確認から

このプラグインのインストールとプラグインが有効化になっている必要があります。設定はそれから、まずはプラグインの確認をしよう。

プラグインリストの確認

サイドバーからプラグイン
インストール済みプラグイン

リストにプラグインを確認

停止になっているのを確認

もし停止ではなく有効化だったらプラグインは停止状態なのでプラグインを有効化にします。

有効化 停止になったらOK
プラグインは有効化されました

きいりん
次は設定の手順に進みます
あかん
リストにないんだけどぉ

 

プラグインを新たに追加したいとき

下記の手順でプラグインをインストールする必要があります。プラグインのインストール方法を詳しく確認したいときは、下記の関連記事からプラグインインストール方法を確認下さい。

❶ サイドバーからプラグイン   新規追加

プラグインのインストール有効化

WordPress STORK プラグインセットアップのまとめ

2017.02.22

 

プラグインの設定手順

プラグインの設定に移動

サイドバーから設定  AddQuickTag

 

タグの登録

エディタの表示名を入力

アイコン
  アイコンリストからアイコンを選択

❸❹ 開始タグと終了タグを入力

1 」を入力

ビジュアルエディター
  post  page

変更を保存

きいりん
設定は完了です
 カスタマイズの詳細

  • 表示名は 「H3見出し
  • 好みのアイコンが表示される
  • 開始タグに <h3>
  • 終了タグに </h3>
  • タグの順番指定
  • 登録タグは固定ページと投稿ページのビジュアルテキストエディター共に使用可能
太字やアイコンは、ほんの一例です

登録タグの表示は、ビジュアルエディターが「リスト」でテキストエディターは「ボタン」になります。

アイコンの設定は、タグの種類を区別するのに使用してますが、空白のままでも設定を完了します。また、アイコンが表示されるのはビジュアルエディターのみです。

あとは、この設定作業を繰り返して複数のタグを登録します。

画像や動画、リンク先などよく使うコードを丸ごと登録できるのはとても便利です。

ただ開始タグや終了タグが必要ない場合の登録は、開始タグにコードをコピペして終了タグとタグの順番を空白にするばOK。

 

プラグインの使い方

このプラグインは、記事を作成するためのビジュアルエディターかテキストエディターで使用しますが、それぞれに使い方が異なります。

ビジュアルエディター

ビジュアルエディターでは、表示が可能なショートコードの挿入方法となります。

ショートコードを開始と終了タグまとめて挿入する方法

囲いたいテキストを全て選択

Quicktags

❸ リストから  タグを選択

 

きいりん
ショートコードの挿入は完了です

テキストエディター

タグまとめて挿入するのは、テキストエディターも同様ですが、さらにタグを別々に挿入する方法も可能です。

開始と終了タグを別々に挿入する場合

❶ 挿入したい箇所に  カーソルを移動

登録済みボタンを選択

❸ 次に終了タグを挿入したい箇所に
カソールを移動

❹ 開始タグから終了タグに変化した
同じボタンを選択

きいりん
タグの挿入は完了です

解説が少しややこしくなりましたが、それぞれに表示される箇所が違うこと、タグの挿入方法には2つの方法があるということです。

通常は、タグを表示するテキストエディターで使うのが一般的なので、まずはテキストエディターで使ってみるとわかりやすいです。

以前までは、段落タグの<P>を表示しない設定にしてたけど、ビジュアルエディターに切り替えて使っていると文字が勝手に消されることが多々ありました。

なので TinyMCE Advanced プラグインの設定で段落タグの<P>の表示するように設定変更しています。

最初は、あまりのタグの多さにとても違和感があったけど、空白の改行を入れて見やすくすることで解消しています。気になる方は関連記事からプラグインの設定を確認下さい。

TinyMCE Advanced 簡単設定と追加機能の一覧

2017.03.06

 

さいごに

このプラグインを使っていて気づくことがあります。それは登録するタグにルールを持たせることです。

ひたすら記事を書きまくるのにこだわる人は別ですが、過去の記事にも修正や変更を施している人には是非、上手なプラグインの活用をしてほしいです。

 

  • ただ単によく使うタグを記憶させて取り出す
  • だから、なんでもかんでも記憶させる

それにスタイルタグをやたらと使ってない?

 

ブログやサイトの記事が毎回違う装飾だと、とても見づらいため、どのページもある程度共通するパターンが施されています。最初は手間がかかるけど、作業を重ねて効率化を図る。

そこで先ほどのスタイルタグなんですが、個別に指定するスタイルタグよりもCSSを使う。過去の同じCSSを使用した記事の装飾をまとめて変更することが可能になります。

そうして、このプラグインと上手に連携することで、本来の意味のある使い方になるのではないかと思います。

 

今回は、そうした内容を記事にすることができなかったけど、いずれCSSやショートコードにAddQuickTagの上手な使い方なんてのも書けたらと思ってます。

あかん
最後まで乙です
いつもポチポチ ありがと

ブログランキング・にほんブログ村へ

 


カンファレンスバナー


2 件のコメント

    • コメントありがとうございます。
      すごく励みになります。
      ブログにまた訪問されていただきますね。
      では。。またね (^^)v

  • コメントを残す

    メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

    *

    ABOUTこの記事をかいた人

    きいりん

    今やワードプレスはモバイルファーストって
    初心者ながらにそうやってブログが今よりもっと楽しくやれるように日々奮闘しています。
    皆さんに少しでもためになるような記事ができたらと思うのでこれからも応援をよろしくお願いします。 (^^)v