※このショートコードは、「ブロックエディタ」に対応済みです。ブロックエディタのほうを使ったほうがラクです。
セリフ、会話型コンテンツ用の吹き出しショートコードです。
もっとも汎用性の高い吹き出しデザイン
画像を小さくしているので、よほどの長文でない限り、スマホから見ても間延びした感じになりません。グレーの吹き出しカラーはどんなカラーのサイトにもマッチします。
コピペ用
[fukidasi color="gray" back_color="" avatar="https://hannya-builder.com/guide/wp-content/uploads/2019/01/kami.jpg" avatar_size="small" lr="l" name="" type="yoko" waku="" avatar_waku="maru"]
コメントコメントコメント
[/fukidasi]
吹き出しのカラーを変更する
青
コピペ用
[fukidasi color="blue" back_color="" avatar="https://hannya-builder.com/guide/wp-content/uploads/2019/01/kami.jpg" avatar_size="small" lr="l" name="" type="yoko" waku="" avatar_waku="maru"]
コメントコメントコメント
[/fukidasi]
ピンク
コピペ用
[fukidasi color="pink" back_color="" avatar="https://hannya-builder.com/guide/wp-content/uploads/2019/01/kami.jpg" avatar_size="small" lr="l" name="" type="yoko" waku="" avatar_waku="maru"]
コメントコメントコメント
[/fukidasi]
緑
コピペ用
[fukidasi color="green" back_color="" avatar="https://hannya-builder.com/guide/wp-content/uploads/2019/01/kami.jpg" avatar_size="small" lr="l" name="" type="yoko" waku="" avatar_waku="maru"]
コメントコメントコメント
[/fukidasi]
黒
コピペ用
[fukidasi color="black" back_color="" avatar="https://hannya-builder.com/guide/wp-content/uploads/2019/01/kami.jpg" avatar_size="small" lr="l" name="" type="yoko" waku="" avatar_waku="maru"]
コメントコメントコメント
[/fukidasi]
吹き出しの背景カラーを変更する
吹き出しカラー設定は無視されて、背景カラーが優先されます。
グレー
コピペ用
[fukidasi color="gray" back_color="light-gray" avatar="https://hannya-builder.com/guide/wp-content/uploads/2019/01/kami.jpg" avatar_size="small" lr="l" name="" type="yoko" waku="" avatar_waku="maru"]
コメントコメントコメント
[/fukidasi]
青
コピペ用
[fukidasi color="gray" back_color="aqua" avatar="https://hannya-builder.com/guide/wp-content/uploads/2019/01/kami.jpg" avatar_size="small" lr="l" name="" type="yoko" waku="" avatar_waku="maru"]
コメントコメントコメント
[/fukidasi]
黄緑
コピペ用
[fukidasi color="gray" back_color="yellow-green" avatar="https://hannya-builder.com/guide/wp-content/uploads/2019/01/kami.jpg" avatar_size="small" lr="l" name="" type="yoko" waku="" avatar_waku="maru"]
コメントコメントコメント
[/fukidasi]
ピンク
コピペ用
[fukidasi color="gray" back_color="pink" avatar="https://hannya-builder.com/guide/wp-content/uploads/2019/01/kami.jpg" avatar_size="small" lr="l" name="" type="yoko" waku="" avatar_waku="maru"]
コメントコメントコメント
[/fukidasi]
アイコン画像のカスタマイズ
右にアイコン、左に吹き出しを配置する
「lr=”r”」と指定します。
コピペ用
[fukidasi color="gray" back_color="light-gray" avatar="https://hannya-builder.com/guide/wp-content/uploads/2019/01/kami.jpg" avatar_size="small" lr="r" name="" type="yoko" waku="" avatar_waku="maru"]
コメントコメントコメント
[/fukidasi]
アイコン画像を四角くする
「avatar_waku=””」と空欄で指定します。
コピペ用
[fukidasi color="gray" back_color="light-gray" avatar="https://hannya-builder.com/guide/wp-content/uploads/2019/01/kami.jpg" avatar_size="small" lr="l" name="" type="yoko" waku="" avatar_waku=""]
コメントコメントコメント
[/fukidasi]
アイコン画像を大きくする
「avatar_size=”normal”」と指定します。
コピペ用
[fukidasi color="gray" back_color="light-gray" avatar="https://hannya-builder.com/guide/wp-content/uploads/2019/01/kami.jpg" avatar_size="normal" lr="l" name="" type="yoko" waku="" avatar_waku="maru"]
コメントコメントコメント
[/fukidasi]
スマホのときは、画像の下に吹き出しを表示する
「 type=”tate”」と指定します。
コピペ用
[fukidasi color="gray" back_color="light-gray" avatar="https://hannya-builder.com/guide/wp-content/uploads/2019/01/kami.jpg" avatar_size="small" lr="l" name="" type="tate" waku="" avatar_waku="maru"]
コメントコメントコメント
[/fukidasi]
スマホのときは、画像の上に吹き出しを表示する
「type=”tate2″」と指定します。
コピペ用
[fukidasi color="gray" back_color="light-gray" avatar="https://hannya-builder.com/guide/wp-content/uploads/2019/01/kami.jpg" avatar_size="small" lr="l" name="" type="tate2" waku="" avatar_waku="maru"]
コメントコメントコメント
[/fukidasi]
吹き出しの枠を表示しない
「 waku=”no”」と指定します。
コピペ用
[fukidasi color="gray" back_color="light-gray" avatar="https://hannya-builder.com/guide/wp-content/uploads/2019/01/kami.jpg" avatar_size="small" lr="l" name="" type="yoko" waku="no" avatar_waku="maru"]
コメントコメントコメント
[/fukidasi]
タイトル付きの吹き出し
コピペ用
[fukidasi title="タイトル付き" color="gray" back_color="" avatar="https://hannya-builder.com/guide/wp-content/uploads/2019/01/kami.jpg" avatar_size="small" lr="l" name="" type="yoko" waku="" avatar_waku="maru"]
コメントコメントコメント
[/fukidasi]
属性値
title=””
吹き出しのタイトル。
これを指定すると吹き出しの周りのボックスが表示されます。指定なしの場合、枠は表示されません。（初期値：なし）
color=”blue、green、pink、black”
titleを設定したときに表示される吹き出しを囲む枠の色（初期値：black）
back_color=”aqua、yellow-green、pink、light-gray”（初期値：light-gray）
吹き出しの背景色
avatar=””
吹き出しの横に表示される画像のURL
画像のサイズは100×100 pxになります。違うサイズの画像も強制的にこのサイズに拡大・縮小して表示されます。
avatar属性を指定しない場合は、ディスカッション設定で指定したアバターを表示します。このとき、ディスカッション設定で「アバターを表示する」のチェックを外すと何も表示されなくなるので注意してください。次のname属性が設定してあれば、名前だけが表示されます。
name=””
avatar画像の下に表示される名前
lr=”lまたはr”
アイコンと吹き出しの左右の配置を設定。
l：アイコンが左（left）、吹き出しが右
r：アイコンが右（right）、吹き出しが左
type=”yoko、tate、tate2″
スマホ表示でのアイコンと吹き出しの配置を設定。
yoko：アイコンの横に吹き出し
tate：アイコンの下に吹き出し
tate2：アイコンの上に吹き出し
waku=”no、wrap、空欄”
吹き出し枠を表示するかどうかを設定。
吹き出し枠を表示しない場合、スマホ表示での位置指定や吹き出し色の指定は無視されます。
no：吹き出し枠を表示しない
wrap：吹き出し枠なしで、テキストがアイコンの下に回り込む
指定なし：吹き出し枠を表示する
avatar_waku=”空欄、maru”
アイコン画像の形
指定なし：四角
maru：丸に切り抜き
atatar_size=”normal、small”
アイコン画像の大きさ。
normal 96×96px（初期値）
small 50×50px
以上、「吹き出しショートコード」でした。
←般若ビルダー専用ショートコード一覧に戻る
