▶ Amazon 今日の【在庫処分】セール会場へ
スポンサーリンク

ページにプロモーションが含まれる場合があります。

【簡単装飾】コード登録ツール|AddQuicktagの使い方

スポンサーリンク
初心者
初心者

WordPressで文字を装飾するコード挿入ってもっと楽にならない?

よしてっく
よしてっく

コードの挿入はプラグインで効率化できます。

ブログの記事に装飾は必須です。

よしてっく
よしてっく

外部のサイトからもらってきたオリジナルの装飾用コード(タグ)などは、コピペで使いまわしてる人もいるかもしれませんね。

良く使うコードはAddQuicktagで登録してボタンですぐに呼び出せるようにしておくと作業効率が良くなります。

今回は、WordPressの定番プラグインAddQuicktag(アドクイックタグ)の使い方をご紹介します。

 

AddQuicktagの特徴

  • HTMLタグ(コード)を登録できる
  • 登録したタグをボタン1発で挿入できる
  • 混合タグも登録可(太字+赤+…など)

 

ちなみに私が登録しているのは、

太字【<b>タグ版】
太字+赤
太字+イエローマーカー、など

この他、標準メニューに無い囲い枠箇条書きなどを登録してます。

 
注意点としては、AddQuicktagの機能を使うにはエディター環境に条件があります。

■AddQuicktagの使用条件

  • クラシックエディター
  • ブロックエディターのクラシックブロック

 

よしてっく
よしてっく

今回の解説はクラシックエディターの画面で進めますがご了承下さい。

 

AddQuicktagのインストール

AddQuicktagインストール手順

 

(1)WordPress管理画面(ダッシュボード)のプラグイン新規追加をクリックします。

WP_プラグイン_新規追加

 

(2)検索ボックスにAddQuicktagと入力して今すぐインストール有効化します。

AddQuicktagのインストール

 

(3)インストール済みプラグイン一覧にAddQuicktagが追加されました。

プラグイン一覧のAddQuicktag

 

(4)投稿画面を確認します。エディターコマンドにはQuicktagsというメニューが追加されます。

エディターにQuicktagsメニュー

 

info
AddQuicktagのインストールをしても
エディタに「Quicktags」のメニューが表示されない場合は下記を参照ください。
関連 AddQuicktagメニューが消えた|Chromeキャッシュ削除で復活

 

AddQuicktag:コード(タグ)の登録と使い方

AddQuicktagコード登録と使い方

★AddQuicktagの使い方は2ステップ。

  1. コード(タグ)の登録(ボタン追加)
  2. テキスト選択してQuicktagsからボタンを選ぶ

 

使い方❶:コードの登録(ボタン追加)

 

(1) 左メニューの設定⇒AddQuicktagをクリック。

設定のAddQuicktag

 

(2) 各ボックスに必要な項目を入力します。

AddQuicktag設定項目

 

✔入力項目
  1. ボタン名:自分がわかるような名前
  2. ラベル名:マウスオーバー時の表示
  3. ダッシュアイコン:ボタン名の前にアイコンを追加
  4. 開始タグ:HTMLの開始タグ
  5. 終了タグ:HTMLの終了タグ
  6. アクセスキー:入力不要
  7. 並び順:番号付けで表示順番を調整可

※❶ボタン名と❹開始タグは入力必須の項目。

 

ボタン名

自分でどんな機能かが見て解るようなボタン名を付けます。(入力必須)

例:太字、イエローマーカー、赤字、など…

 

ラベル名

マウスオーバー時ポップアップの中身の表示です。❶のボタン名と同じで可。未設定でもOK。

 

❸ダッシュアイコン

ボタン名の前にアイコンを追加して、ぱっと見で選びやすくなります。未設定でもOK。

 

開始タグ

装飾を反映するテキストの前方に挿入したいHTMLコード(タグ)を入力します。(入力必須)

 

❺終了タグ

装飾を反映するテキストの後方に挿入したいHTMLコード(タグ)を入力します。

 

アクセスキー

入力不要です。現状Internet Explorerだけにしか対応してないので。

※chrome環境で入力してみたらエディターのAddQuicktagメニューが消えたりと不具合が出ました。

 

並び順

0~番号を付けると0がボタン一覧の最上部となり順番の調整ができます。未入力でもOK。

 

 

(3)入力が完了したら一番右のチェックボックスをクリックして全部のチェックを有効にします。

AddQuicktag全チェック有効

 

(4)最後に変更を保存をクリック。

WP_変更を保存

 

これで登録完了です。

他にも登録したいコードがあれば下に続けて追加して下さい。

 

使い方❷:テキスト選択してQuicktagsからボタンを選ぶ

 

(1)投稿画面でタグを反映させたい文字列をマウスのドラッグ操作などで選択状態にします。

aiueo

 

(2)エディターのQuicktagsのメニューをクリック⇒一覧から目的のボタンを選びます。

Quicktagsメニュー展開

 

(3)文字列にタグの効果が反映しました。

あいうえおマーカー

 

テキスト(HTML)モードで反映したタグが確認できます。

タグの反映確認

 

応用パターン:全体登録

AddQuicktagもっと便利に使う

AddQuicktagは登録したタグを呼び出すツールなので、自分でカスタムした装飾タグなどを登録しておけばボタンひとつで使うことができます。

よしてっく
よしてっく

というか、そのためにあるツールだと思います。

よく使う装飾済の文章広告リンク文章ごとHTMLの状態で登録できるので、他のページからコピペする必要もなくなります。

全体を開始タグに登録

 

その場合、AddQuicktag登録項目の、❹開始タグのボックスに文章も込みの全てのHTMLタグを入力し、❺終了タグは空欄でOKです。

AddQuicktag設定項目

❺終了タグは空欄でOK

 

文章の部分は貼り付け後に修正すれば良いので、文章ごと登録するのもオススメです。

 

まとめ:AddQuicktagは便利すぎる定番プラグイン

今回は、HTMLタグやショートコードを登録してボタン化できるAddQuicktagのをご紹介しました。

よしてっく
よしてっく

AddQuicktagはWordPressでは超定番のプラグインです。

特にサイトのカスタマイズやブログ作業の時短には欠かせないツールですので、必ずインストールしましょう。

コメント

タイトルとURLをコピーしました