【WordPress】会話形式の吹き出しプラグイン Word Balloon【公式ページ】

WEBサイトで見かける人物と吹き出しが表示され、
会話形式やインタビューの様に見えるやりとり。

これを簡単に作成出来るように
Wordpressで使えるプラグインを作ってみました。
2018年3月、Wordpress.orgへ公式に登録され、
累計12,000ダウンロード突破した無償のプラグインです。

Word Balloon (吹き出し) You will easy to add speech balloon in your post.
 ja.wordpress.org
名前は『Word Balloon』です。
やーまん
やーまん

このプラグインの特徴は

  • 画像の管理はWordpress標準のメディアアップローダーを使うので、
    FTPソフトを使用した画像のアップロードは不要。
  • 投稿画面でふきだしのプレビューを見ながら作成出来る。
  • ふきだしの色はCSSの知識0でカスタマイズ出来る。
  • アイコンや効果を使うと動きが出せておもしろい。
  • CSSは使用している吹き出しの種類によって個別に出力し、容量を最低限に抑える。
  • ブロックエディタ(Gutenberg)、ビジュアルエディタ、テキストエディタそれぞれに対応

クイックマニュアル

ここではクイックマニュアルとして
ザックリした内容です^^;

より詳しい使い方は次の項目になりますのでスクロールして
移動してください。

ビジュアルエディタ、テキストエディタで
投稿画面のWord Balloonボタンを押すとこの様な画面が表示されます。

各機能は下記の通り

①:セリフの記入
②:アバターの変更
③:アバターの位置変更
④:吹き出しの変更
⑤:投稿内に挿入

それぞれのオプション選択やセリフの入力が出来たら
挿入ボタンを選択してください。

記事内にショートコードが入力されます。

Ver2.0.0よりブロックエディタ(Gutenberg)にも対応しました。

デモ

吹き出し一覧やアイコンや効果を使ったデモページはこちら

【Word Balloon】公式デモ 吹き出し一覧 Word Balloonで使える吹き出し一覧です。 全て初期カラーです。 各吹き出しの色のカスタマイズは可能です。 セリフ この吹き出し作りから全ては始まりでした。 考え事 考え事は上の方に…
 back2nature.jp
【Word Balloon】公式デモ アイコンや効果を使った使用例 https://back2nature.jp/plugins/word-balloon/word-balloon-demo-1 https://back2nature.jp/plugins/word-balloon/word-balloon-demo-3 https://back2nature.jp/plugins/word-balloon
 back2nature.jp
【Word Balloon】公式デモ 壁紙を使った使用例 https://back2nature.jp/plugins/word-balloon/word-balloon-demo-1 https://back2nature.jp/plugins/word-balloon/word-balloon-demo-2 https://back2nature.jp/plugins/word-balloon
 back2nature.jp

使い方・説明書

Word Ballonはまだまだ開発途上のため、
仕様変更に伴いマニュアルと実際の画面が異なる場合があります。
予めご了承ください。

インストール

使ってみよう

登場人物(アバター)の位置変更

ふきだしの変更

登場人物(アバター)の変更

ステータスの使い方

ショートコードの属性一覧

復元機能の使い方

ブロックエディタでの使い方

設定

作者からのお願い

注意点としてアバターの登録情報は
WordPressのデータベースにWord Balloon専用で新規登録を行っていることです。
プラグインにデータベースを触られたく無い方は、
このプラグインのご使用はお控えください。

尚インストール済みプラグインのページから
Word Balloonを削除した際には、
プラグインで使用したデータベースとオプション部分は削除され、
クリーンアンインストール仕様となっています。

このプラグインを使用した事によって生じた
トラブルや障害などに対して作者は一切の責任を持たないものとします。
このプラグインの利用はすべて利用者の責任において行ってください。

Word Balloonを使用した投稿をチェックしているテーマは
Simple DaysとTwenty Nineteenのみです。

特定のテーマに依存する様な形では製作していませんので、
多くのテーマでご利用可能と思います。

但し、

お使いのテーマによっては、
Word Balloonが使用するdivタグやimgタグに
テーマ独自のスタイルが適応されます。
その際は作者が意図したアバターや吹き出しの配置になりません。
コンテンツ内のdivやimgタグにmarginが指定されているテーマだと絶望的です。
やーまん
やーまん

また今後のバージョンアップに伴い
突然仕様が変更になる場合もあります。
その際、旧バージョンと互換性が無くなる場合もあります。
アップデートされる場合は事前にテストサイト等で動作確認を行って下さい。
この点も予めご了承ください。

やーまん
やーまん
以上、作者からのお願いでした。

旧バージョンへのダウングレード

互換性維持のため旧バージョンもwordpress.orgにて配布しています。
下記リンク先より旧バージョンをダウンロードをして、
必要に応じてダウングレードを行ってください。

Word Balloon (吹き出し) You will easy to add speech balloon in your post.
 ja.wordpress.org

ダウングレードはFTPソフトを利用するか、
下記の記事を参照にアンインストーラのプログラムを作動させずに、
プラグインを削除、その後に再アップする方法があります。

【WordPress】プラグインのアンインストーラを作動させない方法 WordPressのプラグインを削除した際、 そのプラグインが保存してたデータを削除するシステムを導入する様に、 wordpress.orgは作者に対して推奨しています。 私もいくつかプラグインは…
 back2nature.jp

上記方法で行ったver1.0.xからver0.6.6へのダウングレードは
保存データを維持したまま可能です。

旧バージョンのサポートは基本的に行いません。
数多くのバージョンが存在するため、
各バージョンの内容を鮮明にこちらでは記憶していない為です。
お応えできる内容でしたら対応出来ますが、
失念してる場合もありますので、予めご了承ください。

バグ報告

もし不具合などありましたら、
下記Word Press公式サポートページよりお願いいたします。
英語表記ですが、もちろん日本語で投稿OKです。

やーまん
やーまん
むしろ日本語でお願いいたします^^;

[Word Balloon] Support | WordPress.org Support
 wordpress.org

アドオンプラグインの紹介

Word Balloonの機能を強化させるWord Balloon PROを
サブスクリプション方式で展開しています。
新規ご契約を現在募集中です。

【Word Balloon PRO】Word Balloonの追加アドオン【公式ページ】 Word Balloon PROはWord Balloonの各種設定を可能にするアドオンプラグインです。 最新のバージョンは Word Balloon PRO単体では動作しませんので、必ずWord Balloonもご用意下さい。 W…
 back2nature.jp

こちらもどうぞよろしくお願いいたします。

是非フォローしてください

最新の情報をお伝えします

  • やーまん
  • 山奥に移住し、自然に囲まれ暮らしています。
    日々の事で感じた事や考え方などを備忘録として残しています。