【サイト機能追加】吹き出しで会話調の記事が書けるようになりました。

いいね! この記事が「いいね!」と思ったら押して下さい!
読み込み中...

お知らせ

一部のメンバーから需要がありましたので、会話調で日記が書ける機能を追加しました。
吹き出しの色辺り後程修正すると思われます。(左右の色を統一させる予定です。)

こんな感じです

ラッピーA
吹き出しでの会話が実装したっきゅ♪
ラッピーB
まだ色々調整あるのは黙っておこう・・・きゅ♪

用意するもの

左用の画像と右用の画像1枚ずつ(同じ画像でも可)
サイズは幅120px、高さ180px ※異なるサイズだと伸縮がずれるのでこのサイズでお願いします。

【重要】画像は事前にこちらで設定しないと使えませんので、必ず画像の用意&提供をお願いします。

画像ファイル名のルール(画像形式がjpgの場合)

左用画像:[自分の名前]_l01.jpg
右用画像:[自分の名前]_r01.jpg
※複数キャラの画像を用いる場合は01の部分を02~にして下さい。
《例》
shine_l01.jpg ※シャイン1キャラ目左画像
shine_r01.jpg ※シャイン1キャラ目右画像
yui_l01.jpg ※唯さん1キャラ目左画像
yui_r01.jpg ※唯さん1キャラ目右画像
yui_l02.jpg ※唯さん2キャラ目左画像
yui_r02.jpg ※唯さん2キャラ目右画像

画像の加工ができない方は

シャインorヨッキさんまでにお渡しいただければPhotoshopで加工します。
キャラ以外はトリミングしますので、シャインor唯さんのマイルームにあるスクリーンを使ったSSでご用意お願いします。
↓↓こんな状態でご用意お願いします↓↓

記事への書き方

【】は実際には[]になります。

【speech_bubble type=”drop” subtype=”R1″ icon=”sample_r.jpg” name=”名前”】ここにメッセージ【/speech_bubble】

タイプ変更

typeの所は基本形状を変更できます。以下の値を入れることが可能です。
drop・std・ fb・ fb-flat・ln・ ln-flat・ pink・ rtail

吹き出しの位置:尻尾変更

subtypeの所は吹き出しの位置・尻尾部分を変更することが可能です。
L1 : 左側通常吹き出し
R1 : 右側通常吹き出し
L2 : 左側もわもわ吹き出し
R2 : 右側もわもわ吹き出し

キャラアイコンの変更

iconの所は自分で用意した画像のファイル名を指定します。

名前の変更

nameの所は画像・吹き出しに書かれる名前を記載します。

各種設定サンプル

ドロップシャドウ

ラッピーA
type:drop subtype:L1
ラッピーA
type:drop subtype:R2

シンプル

ラッピーA
type:std subtype:L1
ラッピーA
type:std subtype:R2

Facebook調①

ラッピーA
type:fb subtype:L1
ラッピーA
type:fb subtype:R2

Facebook調②

ラッピーA
type:fb-flat subtype:L2
ラッピーA
type:fb-flat subtype:R1

LINE調①

ラッピーA
type:ln subtype:L2
ラッピーA
type:ln subtype:R1

LINE調②

ラッピーA
type:ln-flat subtype:L2
ラッピーA
type:ln-flat subtype:R1

ピンク

ラッピーA
type:pink subtype:L1
ラッピーA
type:pink subtype:R1

ライトブルー

ラッピーA
type:rtail subtype:L2
ラッピーA
type:rtail subtype:R2

 

こんな感じで書かれてはOK

 

 

 

 

もっと簡単に書く方法(最後に書くなよというツッコミは無しで!)

文章にしたい文字を範囲選択して

右上にあるセレクトボックス(Quicktags)から吹き出し【左側】を選択

 

これでデフォルトの値(type=”std” / subtype=”L1″ / icon=”sample_l01.jpg” / name=”ラッピーA”)の入力ができます。

コメント

  • コメント (2)

  • トラックバックは利用できません。

    • 星乃華
    • 2017年 7月 14日

    せんせー!何回やっても画像がひび割れたマークが入って表示されませーん!
    今度相談させてくださーい!!!

    • ヨッキ
    • 2017年 7月 11日

    対応ありがとうございまーす!
    スマホの吹き出しの部分が
    縦画面だとずれるので横推奨に
    なりそうですね‥

画像を追加する(JPEGのみ)