ブログ運用

AddQuicktag導入で吹き出しのショートコード入力を最速化

AddQuicktag導入で吹き出しのショートコード入力を最速化

ブログでよく見る吹き出しの会話。

ねずみん
ねずみん
ねずきちくん、こんにちは!元気?
ねずきち
ねずきち
やあ!僕は元気だよ♪

あなたは使ったことがありますか?

WordPressのテーマ「JIN」では、この吹き出しの機能が備わっています。

私は初めの頃、毎回ショートコードを入力して改変していました。

黄色の部分を毎回変えていた

[chat face=”画像情報” name=”キャラクター名” align=”配置” border=”枠の色” bg=”背景色“] 吹き出しの内容 [/chat]

これでは効率が悪すぎる!!!!!

ねずみん
ねずみん
コードを記憶させておいて、一瞬で表示させる夢のような機能があったらなぁ~
ねずきち
ねずきち
「AddQuicktag」を知らないの?これを使えば毎回入力しなくてもいいんだよ!
この記事で分かること
  • プラグイン「AddQuicktag」にショートコードを登録して使用する方法
  • WordPressテーマ「JIN」の吹き出しを「AddQuicktag」に登録して使用する方法

WordPressテーマ「JIN」をお使いでない方も、プラグイン「AddQuicktag」によく使うショートコードを登録しておくことで、作業を効率化できます!

プラグイン「AddQuicktag」をインストール

まずはプラグイン「AddQuicktag」をインストールしましょう。

  1. WordPress管理画面から「プラグイン」→「新規追加」
  2. 「AddQuicktag」を検索し、「今すぐインストール」→「有効化
AddQuicktagをインストール後、有効化画面

これで準備完了です!

「AddQuicktag」にショートコードを登録する方法

プラグインを有効化したことで、Wordpress管理画面の左バー「設定」の中に

「AddQuicktag」が登録されたと思います。さっそく開いてみましょう。

AddQuicktagにショートコードを設定させる方法

ショートコードの登録方法は、

  1. ボタン名(自分が分かる名前にします)を入力
  2. 開始タグを入力
  3. 終了タグを入力
  4. チェックを入れる(するとすべてにチェックがされます)
  5. 変更を保存ボタンを押す

以上で完了です!!

実践してみないと分かりづらいと思うので、吹き出しを例に、ショートコードを登録してみます。

WordPressテーマ「JIN」吹き出しの登録方法

「JIN」の吹き出しのショートコードは下記です。

[chat face=”画像情報” name=”キャラクター名” align=”配置” border=”枠の色” bg=”背景色”] 吹き出しの内容 [/chat]

画像情報は、登録したい画像の「ファイル名」を入れます。(〇〇〇.jpgなど)

ファイル名は、管理画面左バーの「メディア」→「ライブラリ」から登録したい画像を開くと、表示されます。(今回の場合は『ねずみんJPG.jpg』)

ねずみん
ねずみん
この吹き出しを例に説明するよ

上記の吹き出しのコードはこのようになっています▼

[chat face=”ねずみんJPG.jpg” name=”ねずみん” align=”left” border=”none” bg=”yellow” style=”maru”] [/chat]

AddQuicktag設定方法アップver

①~④に、次のように入力します。

  1. ボタン名 表示させたい名前を入力。(ねずみん左黄色)
  2. 開始タグ [chat face=”ねずみんJPG.jpg” name=”ねずみん” align=”left” border=”none” bg=”yellow” style=”maru”]
  3. 終了タグ [/chat]
  4. チェックする(するとすべてにチェックがされます)
  5. 変更を保存

これで登録は完了です!

吹き出しの色、枠の色、配置などをそれぞれ変更して、作りたい吹き出しを複数パターン登録しておくと便利です。

それでは、さっそく投稿画面で呼び出してみましょう♪

投稿画面でAddQuicktagを呼び出す方法

投稿画面に行くと、【Quicktags▼】が表れたと思います。

AddQuicktag投稿画面表示

フルダウン▼をおすと、先ほど登録した表示名が出るようになっています。

AddQuicktag使用方法
  1. 吹き出しの中に入れたい文字を選択する
  2. 【Quicktags▼】をクリック
  3. 先ほど登録した表示名から好きなものを選ぶ

これで完了です!投稿画面では吹き出しは表示されないので、プレビューを押して確認してみましょう。

正しく入力できていれば、吹き出しが表示されているはずです。

吹き出しが表示されない場合は、恐らくコードの何かが違うと思います。

失敗経験談としては、半角スペースが抜けていたり、本来半角スペースが空くところになかったりしたことが原因でした。

1度プレビュー画面で吹き出しが表示されることを確認してから、AddQuicktagにコピペで登録することをおすすめします!

AddQuicktagは、今回ご説明した「吹き出し」以外にも、様々なショートコードに使えます!

良く使うショートコードは登録して、ぜひ作業を効率化させましょう。

ねずきち
ねずきち
この記事がお役に立てたら嬉しいです!
【JIN】トップページと関連記事のカテゴリを非表示にする方法ブログテーマ「JIN」では、アイキャッチの上にカテゴリが自動的に表示されるようになっています。 とても優れた機能ですが、スマホで見...
WordPressは難しい?初心者が壁にぶち当たりまくっている話
WordPressは難しい?初心者が壁にぶち当たりまくっている話WordPressを開設して2週間が過ぎ、今日は16日目です。 記事は固定ページ(プロフィール、プライバシーポリシー、免責事項)を...
ブログで稼ぎたい人向けの書籍
関連記事