どうも、サブロー(@saburo_design)です。

皆さんはWordPressで記事を書く時に『ビジュアルリッチエディター』『テキストエディター』どちらを使っていますか?

私は意図しないHTMLタグが挿入されるのが嫌でいつも『テキストエディター』を使っています。

自分の思ったとおりのレイアウトが出来る反面、HTMLタグをいちいち打たなければならず、大した文字量ではないですが、英語に強くない人だとHTMLタグをそらで打てなかったり、記述ミスでレイアウトが総崩れしたりなど、若干面倒くさいところがあります。

そこで今回は、ワードプレスの投稿画面でよく使うHTMLタグを登録しておけるプラグイン『AddQuicktag』をご紹介したいと思います。このプラグインがあれば記述ミスも無くなりブログを書く作業効率が一気に上がります。

プラグインをインストールして有効化する

【管理画面】→【プラグイン】→【新規追加】で『AddQuicktag』で検索します。そして『AddQuicktag』をインストールして有効化。

『AddQuicktag』をインストールして有効化
『AddQuicktag』をインストールして有効化

【管理画面】→【設定】に『AddQuicktag』という項目が追加されます。

『AddQuicktag』にHTMLタグを登録する

【管理画面】→【設定】→【AddQuicktag】でタグの登録画面に進みます。。

『AddQuicktag』のHTMLタグの登録画面
『AddQuicktag』のHTMLタグの登録画面

①ボタン名。自分が分かりやすい名前を付けておけばいい。(例:見出しh2など)
②開始タグ(例: <h2>など)
③終了タグ(例: </h2>など)
④このタグを呼び出すボタンを表示する投稿タイプ。基本全てにチェックを入れる。

入力できたら『変更を保存』ボタンをクリック。これでタグの登録は完了です。簡単ですね。続いて投稿画面で実際に使ってみます。

先ほど登録したHTMLタグのボタンが記事投稿画面に追加される
先ほど登録したHTMLタグのボタンが記事投稿画面に追加される

投稿画面を見てみると先ほど登録したHTMLタグを呼び出すボタンが追加されています。

見出しにしたい文章をドラッグし、追加したボタンをクリックすると、
見出しにしたい文章をドラッグし、追加したボタンをクリックすると、
このように見出しタグで囲ってくれます。
このように見出しタグで囲ってくれます。

もちろん単一のHTMLタグだけでなく、クラスを付与したHTMLタグも登録可能です。

私がよく使うHTMLタグ

私が『AddQuicktag』に登録しているHTMLタグ
私が『AddQuicktag』に登録しているHTMLタグ

私がブログを書く上でよく使うタグはh2やh3といった見出しタグにpタグをはじめ、文字を強調表示するstrongタグ、赤の強調表示青の強調表示文字を蛍光ペンでなぞったように見せるハイライト表示などなど…CSSであらかじめ装飾しておき、『AddQuicktag』でいつでも呼び出せるようにしております。

こんな感じで文字を大きくするタグも登録しています。

サブロー
サブロー
LINEのような会話型のフキダシも、
サブロー
サブロー
このようにボタンひとつで簡単に呼び出せるようにしています。
サブロー
サブロー
凄く便利!

pタグぐらい打てよと思われるかもしれませんが、何百何千回と打つHTMLタグだからこそ、たった数秒の時間短縮が今後の作業効率に大きく響いてきます。

ダミー画像
ダミー画像

↑私はこれを『ダミー画像』と呼んでいるのですが、このimgタグも登録しております。記事の中の画像や写真を配置する予定の箇所にあらかじめこの『ダミー画像』を配置しておいて、あとからちゃんとした写真に差し替えるというやり方を行っています。

↓他にも画像を横に2つ並べるタグや、

  • ダミー画像
    ダミー画像
  • ダミー画像
    ダミー画像

↓3つ並べるのもタグの呼び出しでパパッと出来てしまいます。

  • ダミー画像
    ダミー画像
  • ダミー画像
    ダミー画像
  • ダミー画像
    ダミー画像

登録したタグのエクスポートインポート

『AddQuicktag』には登録したタグのエクスポート機能とインポート機能があります。このブログで登録したタグを他のブログでもインポートして使うことが出来るようになります。

【管理画面】→【設定】→【AddQuicktag】で下のほうに行くと『エクスポート』という項目があります。そこの【エクスポートファイルのダウンロード】ボタンを押すとJSONファイルがダウンロードされます。

登録したタグのエクスポートとインポート
登録したタグのエクスポートとインポート

このJSONファイルを『AddQuicktag』が有効化されている他のブログでインポートすると登録したタグが使えるようになります。複数ブログを運営している人には便利な機能ですね。

まとめ

このプラグインを使う前は、わざわざ過去の記事で同じタグを探してきてコピペするというかなり無駄な作業をしていましたが、『AddQuicktag』のおかげで記事を書く時間が相当簡略化されました。(記事を更新するペースは相変わらず遅いですが)

ブログを書く時によく使うタグがある、定型文をすぐに呼び出したいという方はぜひ一度このプラグインをお試しください。今のところ私が手放せないプラグインのひとつになっています。