ものづくり推進部

WINGのタグ機能一覧 ②ボックスデザイン編

2020年4月12日

WINGのタグ機能一覧 ②ボックスデザイン編
きのぷー
「WING」の記事作成で使えるタグ機能紹介 第2回は「ボックスデザイン」の一覧です。

販売元サイト

ボックスデザイン

バナー風ボックス

[st-flexbox url="リンク先URL" rel="nofollow" target="リンクを新しく開く(target)" fontawesome="Webアイコン" title="タイトル" width="幅(%)" height="高さ(px)" color="文字色" fontsize="文字サイズ(%)" radius="角丸(px)" shadow="タイトルの影色" bordercolor="枠線カラー" borderwidth="枠線の太さ(px)" bgcolor="背景色" backgroud_image="背景画像のURL" blur="背景画像のぼかし" left="左寄せ(on)" margin_bottom="下の余白(px)"]
ここに自由なテキスト
[/st-flexbox]

基本

タイトル


 

背景なし(高さ400px)

タイトル


 

左寄せ

タイトル


 

マイボックス

[st-mybox title="見出し" fontawesome="Webアイコン" color="見出し色" bordercolor="枠線カラー" bgcolor="背景色" borderwidth="枠線の太さ(px)" borderradius="角丸(px)" titleweight="見出しの太さ(bold)" fontsize="見出しのフォントサイズ" myclass="オリジナルクラス" margin="マージン"]
ここにテキスト
[/st-mybox]

基本

ポイント


 

しかく(枠のみ)


 

まるみ


 

参考

参考


 

関連

関連


 

メモ

メモ


 

ポイント

ポイント


 

注意ポイント

注意ポイント


 

はてな

はてな


 

+ミニふきだし

ふきだしテキスト


 

shortcode


 

マイボックス(+CSSクラス)

メモ

メモ


 

メモ(下線のみ)

メモ


 

メモ(枠のみ)

メモ


 

メモ(枠・下線あり)

メモ


 

注意(下線のみ)

ここに注意


 

必要なモノ

必要なモノ

  • ダミーテキスト
  • ダミーテキスト
  • ダミーテキスト

必要なモノ(ドット下線)

必要なモノ

  • ダミーテキスト
  • ダミーテキスト
  • ダミーテキスト

チェックリスト

チェックリスト

  • ダミーテキスト
  • ダミーテキスト
  • ダミーテキスト

チェックリスト(ドット下線)

チェックリスト

  • ダミーテキスト
  • ダミーテキスト
  • ダミーテキスト

簡単な流れ

簡単な流れ

  • ダミーテキスト
  • ダミーテキスト
  • ダミーテキスト

簡単な流れ(ドット下線)

簡単な流れ

  • ダミーテキスト
  • ダミーテキスト
  • ダミーテキスト

見出し付きフリーボックス

基本

見出し(全角15文字)


 

注意

注意


 

はてな

はてな


 

ポイント

ポイント


 

メモ

メモ


 

基本(タイトル幅100%)

見出し(全角15文字)


 

注意(タイトル幅100%)

注意


 

はてな(タイトル幅100%)

はてな


 

ポイント(タイトル幅100%)

ポイント


 

メモ(タイトル幅100%)

メモ


 

メモボックス

メモ

テキスト

スライドボックス

[st-slidebox fontawesome="" text="+ クリックして下さい" bgcolor="" color="#1a1a1a" margin_bottom="20"]]
<p>クリックで開かれる内容です</p>
[[/st-slidebox]

チェックボックス(番号なしリスト)

テキスト1
テキスト2

こんな方におすすめ(v)

こんな方におすすめ

  • これはダミーのテキストです
  • これはダミーのテキストです

こんな方におすすめ[v]

こんな方におすすめ

  • これはダミーのテキストです
  • これはダミーのテキストです

ガイドマップメニュー

pre

 html
<p></p>

pre: terminal

 command
<p></p>

pre: shortcode

 shortcode
<p></p>

この記事が気に入ったら
いいね ! しよう

  • この記事を書いた人
  • 最新記事

きのぷー

2010年南三陸町初訪問。震災後もボランティア活動等を通じて地元との交流を重ね、2012年4月より「いいね!南三陸町」をスタート。町内各地を訪ねて見つけた町の魅力を伝えます。

-ものづくり推進部
-, ,