平社員日記

【超便利】WordPressテーマ(Affinger)ショートコード貼り付けページ【初心者】【作業用】

WordPressテーマの良く使うショートコードを実際のレイアウトを見ながら、コピペできるようにしました。
ショートコードの先頭文字「[」はエスケープするため「」に変換しています。
貼り付けた後「[」に直してください。

目次@toc]

この記事はこんな方におすすめ

おすすめ黒板

  1. おすすめその1の方
  2. おすすめその2の方
<div class="st-blackboard">
<p class="st-blackboard-title-box"><span class="st-blackboard-title">この記事はこんな方におすすめ</span></p>
<ol class="st-blackboard-list st-no-ck-off">
 	<li>おすすめその1の方</li>
 	<li>おすすめその2の方</li>
</ol>
</div>
@

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

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

  • ダミーテキスト
  • ダミーテキスト
@st-mybox title="チェックリスト(番号なし)" fontawesome="fa-file-text-o" color="#757575" bordercolor="#f3f3f3" bgcolor="" borderwidth="3" borderradius="5" titleweight="bold" title_bordercolor="#757575" fontsize="" myclass="st-mybox-class st-title-under st-list-border st-list-check" margin="25px 0 25px 0"]
ダミーテキスト
ダミーテキスト
@/st-mybox]
@

 

簡単な流れ(番号あり)

簡単な流れ(番号あり)

  • ダミーテキスト
  • ダミーテキスト
@st-mybox title="簡単な流れ(番号あり)" fontawesome="fa-list-ol" color="#757575" bordercolor="#f3f3f3" bgcolor="" borderwidth="3" borderradius="5" titleweight="bold" title_bordercolor="#757575" fontsize="" myclass="st-mybox-class st-title-under st-list-no st-list-border" margin="25px 0 25px 0"]
<ul>
 	<li>ダミーテキスト</li>
 	<li>ダミーテキスト</li>
</ul>
@/st-mybox]
@

ボックス

薄赤ボックスです yellow gray もあるよ

<div class="redbox">
薄赤ボックスです
</div>
@

マーカー

これは黄マーカー(細)-s外すと太 r gもあるよ

<span class="ymarker-s">黄マーカー(細)</span>
@

アイコン&背景ありボックス

(メモ)ここから背景色ありアイコンです

@st-cmemo fontawesome="fa-file-text-o" iconcolor="#919191" bgcolor="#fafafa" color="#000000" iconsize="100"]
(メモ)ここから背景色ありアイコンです
@/st-cmemo]
@


(外部リンク)ダミーテキストです

@st-cmemo fontawesome="fa-external-link" iconcolor="#BDBDBD" bgcolor="#fafafa" color="#757575" iconsize="100"]
(外部リンク)ダミーテキストです
@/st-cmemo]
@


(ブックマーク)ダミーテキストです

@st-cmemo fontawesome="fa-bookmark" iconcolor="#BDBDBD" bgcolor="#fafafa" color="#757575" iconsize="100"]
(ブックマーク)ダミーテキストです
@/st-cmemo]
@


(おしらせ)ダミーテキストです

@st-cmemo fontawesome="fa-bullhorn" iconcolor="#FFEB3B" bgcolor="#FFFDE7" color="#000000" iconsize="100"]
(おしらせ)ダミーテキストです
@/st-cmemo]
@


(はてな)これはダミーです

@st-cmemo fontawesome="fa-question-circle" iconcolor="#4FC3F7" bgcolor="#E1F5FE" color="#000000" iconsize="100"]
(はてな)これはダミーです
@/st-cmemo]
@


(コメント)これはダミーです

@st-cmemo fontawesome="fa-comments" iconcolor="#F48FB1" bgcolor="#FCE4EC" color="#000000" iconsize="100"]
(コメント)これはダミーです
@/st-cmemo]
@


(コード)これはダミーです

@st-cmemo fontawesome="fa-code" iconcolor="#919191" bgcolor="#fafafa" color="#000000" iconsize="150"]
(コード)これはダミーです
@/st-cmemo]
@


(ポイント)これはダミーです

@st-cmemo fontawesome="fa-lightbulb-o" iconcolor="#FFA726" bgcolor="#FFF3E0" color="#000000" iconsize="100"]
(ポイント)これはダミーです
@/st-cmemo]
@


(ユーザー)これはダミーです

@st-cmemo fontawesome="fa-user" iconcolor="#4FC3F7" bgcolor="#E1F5FE" color="#000000" iconsize="150"]
(ユーザー)これはダミーです
@/st-cmemo]
@

(初心者)これはダミーです

@st-cmemo fontawesome="st-svg-bigginer_l" iconcolor="#9CCC65" bgcolor="#F1F8E9" color="#000000" iconsize="100"]
(初心者)これはダミーです
@/st-cmemo]
@

(注意文グレー)これはダミーです

@st-cmemo fontawesome="fa-exclamation-circle" iconcolor="#919191" bgcolor="#fafafa" color="#000000" iconsize="100"]
(注意文グレー)これはダミーです
@/st-cmemo]
@


(注意文)ここまで背景色ありアイコンです

@st-cmemo fontawesome="fa-exclamation-circle" iconcolor="#ef5350" bgcolor="#ffebee" color="#000000" iconsize="100"]
(注意文)ここまで背景色ありアイコンです
@/st-cmemo]
@

ステップ

「購入の流れ」などステップを使用したい場合のデザインに便利です。

step
1
お湯を入れる

@st-step step_no="1"]お湯を入れる@/st-step]
手順1本文
@st-step step_no="2"]3分待つ@/st-step]
手順2本文
@

step
2
3分待つ


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

箇条書きボックス

ポイント

@st-mybox title="ポイント" fontawesome="fa-check-circle" color="#FFD54F" bordercolor="#FFD54F" bgcolor="#FFFDE7" borderwidth="2" borderradius="5" titleweight="bold"]
ダミーです
@/st-mybox]
@

注意ポイント

@st-mybox title="注意ポイント" fontawesome="fa-exclamation-circle" color="#ef5350" bordercolor="#ef9a9a" bgcolor="#ffebee" borderwidth="2" borderradius="5" titleweight="bold"]
ダミーです
@/st-mybox]
@

はてな

@st-mybox title="はてな" fontawesome="fa-question-circle" color="#03A9F4" bordercolor="#B3E5FC" bgcolor="#E1F5FE" borderwidth="2" borderradius="5" titleweight="bold"]
ダミーです
@/st-mybox]
@

見出し

見出し(全角15文字)

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

@st-midasibox title="見出し(全角15文字)" fontawesome="" bordercolor="" color="" bgcolor="" borderwidth="" borderradius="" titleweight="bold"]
これはダミーのテキストです
@/st-midasibox]
@

見出し(全角15文字)

これはタイトル幅を100%にしたデザインです

@st-midasibox-intitle title="見出し(全角15文字)" fontawesome="" bordercolor="" color="" bgcolor="" borderwidth="" borderradius="" titleweight="bold"]
これはタイトル幅を100%にしたデザインです
@/st-midasibox-intitle]
@

-平社員日記

Copyright© ナカログ , 2020 All Rights Reserved.