WordPressで、サーバーがXサーバーならSpeech Bubbleを導入しやすのでおすすめよ、って話をしたいもやし嫁です。
アフィ専業になることになったもやし嫁は稼げるようになるまでしめじアイコンを封印されました。
うちはテンプレートにAffinger4を使っているので、テンプレートにふきだし機能がついていますが、Affinger4以外でもテーマに左右されずに会話が出せるので、テーマ変更する可能性があるならSpeech Bubbleおすすめです。
Speech Bubbleのインストール
WordPressのプラグインからインストールできます。
プラグイン→新規追加→Speech Bubbleで検索→インストール→有効化
コレだけです。
アイコン画像インストール方法(Xサーバーの場合)
アイコン画像はプラグイン内のimgフォルダに直接入れないと会話に出てきません。ここがちょっと面倒。ですが、XサーバーはFFFTPを使わなくてもサーバー内のフォルダを操作できるのでSpeech Bubbleを比較的導入しやすいと感じました。
XサーバーでのSpeech Bubbleの画像アップロード方法
Xサーバーにログインするとこの画面が出てきます。
ファイルマネージャをクリック。
Speech Bubbleをインストールしたサイトのドメイン名をクリック。ここから会話を挿入したいサイトのフォルダに入っていきます。
public_htmlをクリック。
wp-contentをクリック。
pluginをクリック。プラグインのフォルダに入ります。
インストールされたプラグインの一覧が出てきますので、speech-bubbleをクリック。
imgをクリック。このimgフォルダに画像をインストールするとふきだしに絵が出せるようになります。
ファイルを選択をクリックし、ふきだしに使いたい画像を選択しアップロードをクリックします。一度に5つのファイルまで同時にアップロード出来ます。
ちなみに、このときアップした画像のファイル名は会話プラグインでも使用します。完結でわかりやすい英数字ファイル名がおすすめ。
Speech Bubbleの挿入コード(タグ)
Speech Bubbleはインストールしても挿入ボタンなどは現れません。
文字をコードで挟むと会話のふきだしになるのですが、私に特殊文字をHTMLでここに表示する技術がないので、私が参考にした下記のサイト様よりコードを頂いてください。
参考 【Speech Bubble】会話形式の吹き出しが使えるプラグイン 『WordPress』
全部で「drop」「std」「fb」「fb-flat」「ln」「ln-flat」「pink」「rtail」「think」の9種類のふきだしがあります。
ふきだしの色などはプラグインCSSで変更できる
ふきだしの色を変えたい場合はプラグインのファイルを直接編集します。(コードがかければAffinger4の追加CSSでも調整できそう)
プラグイン→Speech Bubble→編集と進みます。
コードが出てきます。
ふきだしの形ごとにphpファイルが組んであるので、ふきだしのコードのtype=”rtail“の赤字の部分の文字が書いてあるファイルを開きましょう。
色の変更なら”#~~“から始まる部分を探して変更しましょう。
(#~~をコピーして、Googleで検索すると色が出てきますので確認できますよ)