LINE 風のふきだし文字にチャレンジ

ふきだし文字にチャレンジするぞ

ネットサーフィンしていた時に行きあたったWordPressのサイトでLINEのように吹き出し文字に出来るよ！って事を知り試してみようかなと軽い気持ちでチャレンジしてみました。

 

1.プラグインを入れる

2.プラグインなしで頑張ってみる

 

最初この二通りの選択肢ができ無謀にも 2.プラグインなしにチャレンジ ⇒ 撃沈！

（ダッシュボードへログインも出来なくなりその失敗談と復帰方法は最後に）

 

という事で1のプランに変更「Speech Bubble（スピーチバブル）」を導入して見事（？）成功しました。

 

ふきだしってどんな感じになる？

 

 

Speech Bubble（スピーチバブル）導入

※WordPressでブログサイトを作っている方用の話です

それでは最初に…

 

　① WordPressダッシュボード内の プラグイン 新規追加

　② キーワードに　Speech Bubble　と入力して数秒間って下さい

　③ 画面が変わって下記のようになったら「今すぐインストール」

 

 

 

インストールが終わるのを待ち

④ 有効化 を行ってください。

 

基本以上で成功しているはずです。

では投稿の新規追加で試してみましょう

 

 

⑤ さっそく試してみる！　文字を入力（下記をコピペして下さい）

 

「speech_bubble type=”drop” subtype=”L1″ icon=”1.jpg” name=”太郎”」 こんにちは！ 「/speech_bubble」
「speech_bubble type=”drop” subtype=”R1″ icon=”2.jpg” name=”花子”」 はじめまして！「/speech_bubble」

 

↑ここを修正　「　⇒[　,　」⇒]　　全角の「」を　半角の[]　に変えて下さい。合計8か所有ります

▼ 修正箇所を画像で確認 ▼

⑥プレビューで確認して下さい

以上で Speech Bubble（スピーチバブル）の基本形の導入は成功！

 

こんな感じで青と赤のシルエット２種類！

今度はこれを、あなたのオリジナル画像に変えようと思います。

 

オリジナル画像に変える

※元になる画像の準備はお願いしますね

① FTPソフトでアップする ( FFFTP 左右分割型の日本語FTPクライアント 無料 ）

② 画像をアップ場所を分かりやすく

 

 

subtype=”R1″　⇒　右から通常吹き出し　　左からの時は L1 と変えて下さい

subtype=”R2″　⇒　右から○吹き出し（心の中？）　左からの時は L2 と変えて下さい

 

type=”○○”　⇒　① drop ② std ③ rtail ④ pink ⑤ fb ⑥ fb-flat ⑦ ln ⑧ ln-flat

8種類あります。ここで使っているのは　ln　ってタイプです。

 

 

もう少し簡単にできないかなぁ？

 

TinyMCE Templates を導入してみる。

ながれはプラグインSpeech Bubbleと同じなので

「プラグイン ⇒ 新規追加 ⇒ インストール ⇒ 有効化」 まで完了しておいて下さい

 

TinyMCE Templates の有効化できましたか？　それでは説明に入りますね

有効化するとダッシュボード（左側のメニュー）

テンプレート項目が出来ます。

①テンプレート ⇒ 新規追加

 

 

④新規登録を必要なだけしておく　（①~③の繰り返し）

 

⑤実際に投稿で利用してみよう

 

 

プラグインなしで挑戦！での失敗談

 

style.css と functions.php を書き加えるやり方でした。

説明されていたサイトでは簡単にできそうだったのでチャレンジ！

書き加えて 保存 がなかなか確定してれない！？

 

そのうち切り替わり バグ画面 に、私パニックで戻るボタンで復帰…

あきらめてその日は終了。　で、翌日…

 

 

ユーザー名・パスワード入力ログイン　⇒　エラー: 入力内容を確認の上、もう一度送信してください。

ユーザー名・パスワード入力ログイン　⇒　エラー: 入力内容を確認の上、もう一度送信してください。

　の繰り返し　間違っているはずないのに何で？？

 

SiteGuard WP Plugin を 入れているのでログインしましたのメールの山が！！

ログインできてるのにダッシュボード画面に切り替わらない状態でした。

 

この2日前FTPでバックアップしていたので最悪そこまでは戻れるけど3~4記事書いてたので全てリストアするのは最後の手段に取っておくことにしました。

 

書き加えた、style.css と functions.php だけバックアップのファイルをアップしてみたらそれでログインができ一安心。

 

バックアップは大切！でトラブル時、心に余裕が出来る！

 

テーマの中にあるので自分が使っているテーマの修正等していなかったらデフォルトを上げても復帰できたと思います。

 

場所は「wp-content」-「themes」 – 「使用中のテーマ」 に、なります。

 

皆さんも定期的なバックアップを忘れずに！