このサイトおよび、配信するメールマガジンは以下の者に帰属します。
運営者：Ayako Terada
住所：お問い合わせいただければ、24時間以内にご対応いたします
（こちらのメールアドレスへの特定電子メールの送付を拒否いたします）
※お問い合わせはメールにてお願いいたします。
作成者別アーカイブ: はる
記事作成パーツ確認用ダミーページ
テーマで用意されているスタイルやショートコードによるタグなどのデザイン確認用ページです。
スタイル
テキスト
これは太字です。
これは赤字です。
これは大文字です。
これは小文字です
これはドット線です。
参考これは参考マークです（例：参考という文字を記入してから使用）
必須これは必須マークです（例：必須という文字を記入してから使用）
これは打消しです。
これはcodeなどに使用します
アニメーション
(^ _ ^)45°揺れ
(^ _ ^)ベル揺れ
(^ _ ^)横揺れ
(^ _ ^)縦揺れ
(^ _ ^)点滅
(^ _ ^)バウンド
(^ _ ^)回転
(^ _ ^)ふわふわ
(^ _ ^)大小
(^ _ ^)シェイク
(^ _ ^)シェイク（強）
(^ _ ^)拡大（ゆれ）
(^ _ ^)過ぎる
(^ _ ^)戻る
(^ _ ^)バースト
アイコン
アイコンマークは「カスタマイザー」の「オプション」でカラーを設定できます。※通常エディタ上では表示されません
これは「はてな」マークです
これは「注意」マークです
これは「人物」マークです
これは「チェック」マークです
これは「メモ」マークです
これは「王冠」マークです
これは「初心者」マークです
見出し
キャッチコピー
こんな風にキャッチコピー見出しタグのテキストなど
見出しタグのテキストなどこんな風にキャッチコピー
記事タイトル
記事タイトル、h2〜h5風はPタグに見出しタグと同じデザインを設定します
まとめ
カウント
カウントは設定したテキストや見出し（hタグ）などに自動で番号を振付けます。手動で番号を付けるよりも簡易であるのはもちろん、テキスト自体ではなくCSSで数字を付与するため目次などにも反映されないなどのメリットがあります。
クイックボタンの「CT」でも付与できます。
これはダミーのテキストです
これはダミーのテキストです
これはダミーのテキストです
これは「まとめ」用の見出しです
通常の見出しタグとは別に「まとめ」用のデザインをカスタマイザーの「各テキストとhタグ（見出し）」で設定できます
ランキング(AFFINGER又はEX版のみ）
ランキング1位
ランキング2位
ランキング3位
ランキング4位以下
マーカー
これは黄マーカーです。
これは黄マーカー（細）です。
これは赤マーカーです。
これは赤マーカー（細）です。
これは青マーカーです。
これは青マーカー（細）です。
これは鼠マーカーです。
これは鼠マーカー（細）です。
写真
写真枠
写真に「枠線」を付与します。境界が曖昧な写真などにとくに有効です（クイックボタン「写真枠」でも使用できます）
キャプションあり
キャプションを追加できます
ポラロイド風
写真をポラロイド風にデザインします
ボックス
黄色ボックスです
薄赤ボックスです
グレーボックスです
引用風のボックスです
ワイド
幅一杯の背景を設定するEX限定デザインです
これはダミーのテキストですこれはダミーのテキストですこれはダミーのテキストです
これはダミーのテキストですこれはダミーのテキストですこれはダミーのテキストです
これはダミーのテキストですこれはダミーのテキストですこれはダミーのテキストです
ショートコードタグでは背景色や画像も設定できます
[st-wide-background myclass=”” backgroud_image=”” bgcolor=”#FFF9C4″ align=””]
これはダミーのテキストですこれはダミーのテキストですこれはダミーのテキストです
[/st-wide-background]
[st-wide-background myclass=”” backgroud_image=”” bgcolor=”#F8BBD0″ align=”l”]
これはダミーのテキストですこれはダミーのテキストですこれはダミーのテキストです
[/st-wide-background]
[st-wide-background myclass=”” backgroud_image=”” bgcolor=”#B3E5FC” align=”r”]
これはダミーのテキストですこれはダミーのテキストですこれはダミーのテキストです
[/st-wide-background]
リスト
ドット下線（リスト）
- これはダミーのリストです
- これはダミーのリストです
- これはダミーのリストです
マル（リスト）
- これはダミーのリストです
- これはダミーのリストです
- これはダミーのリストです
マル+ドット下線（リスト）
- これはダミーのリストです
- これはダミーのリストです
- これはダミーのリストです
簡易チェック（リスト）
- これはダミーのリストです
- これはダミーのリストです
- これはダミーのリストです
簡易チェック+ドット下線（リスト）
- これはダミーのリストです
- これはダミーのリストです
- これはダミーのリストです
チェックボックス（番号なしリスト）
ulタグの番号なしリストを囲むとチェックボックス風のデザインになります。
- これはダミーのリストです
- これはダミーのリストです
- これはダミーのリストです
チェックリスト（番号なしリスト）
ulタグの番号なしリストを囲むとチェック風のデザインになります。「テキストモード」でするか、「チェック（ulタグ）」を適応してから「番号なしリスト」を適応すると便利です。
※カスタマイザーの「オプション」でカラー変更が可能です
- これはダミーのリストです
- これはダミーのリストです
- これはダミーのリストです
ナンバリング（番号付きリスト）
olタグの番号付きリストを囲むとチェック風のデザインになります。「テキストモード」でするか、「ナンバリング（olタグ）」を適応してから「番号付きリスト」を適応すると便利です。
※カスタマイザーの「オプション」でカラー変更が可能です
- これはダミーのリストです
- これはダミーのリストです
- これはダミーのリストです
ナンバリング四角（リスト）
- これはダミーのリストです
- これはダミーのリストです
- これはダミーのリストです
ナンバリング四角+ドット下線（リスト）
- これはダミーのリストです
- これはダミーのリストです
- これはダミーのリストです
レイアウト
回り込み解除
<div class="clearfix"> </div>で囲み、floatを解除します
センター寄せ
要素をセンター寄せにします。
下に余白
要素の下に「10px」の余白を付けます
カードスタイル
※記事ID2で設定されています（ない場合は適宜変更して下さい）
ブログカードに別のデザインを設定します（全サイズで縦型）
[st-card id=2 label=”” name=”” bgcolor=”” color=”” readmore=”on”]
カードスタイルB
ブログカードに別のデザインを設定します（PC、タブレット閲覧時のみ縦型）
[st-card id=2 label=”” name=”” bgcolor=”” color=”” readmore=”on”]
ランキングボックス(AFFINGER又はEX版のみ）
「ランキング一覧背景色」と同じスペースを設定します
width100%リセット
max-width: initial; display: inline;を設定してmax-widthをリセットします。
imgインラインボックス
display: inline;を指定します。
テーブル
テーブル（表の作成）には「TinyMCE Advanced」プラグインが便利です。
横スクロール
スマートフォン閲覧時など横幅がはみ出る場合にtableタグを<div class=”scroll-box”></div>で囲むことで横スクロールに対応させます。
| これはダミーのテキストです | これはダミーのテキストです | これはダミーのテキストです | これはダミーのテキストです |
| これはダミーのテキストです | これはダミーのテキストです | これはダミーのテキストです | これはダミーのテキストです |
中央配置
table内のテキストを上下左右の中央に配置します。
| テキスト | テキスト | テキスト | テキスト |
| テキスト | テキスト | テキスト | テキスト |
装飾なし
テーマで用意されたデフォルトデザインを解除します。
| これはダミーのテキストです | これはダミーのテキストです | これはダミーのテキストです | これはダミーのテキストです |
| これはダミーのテキストです | これはダミーのテキストです | これはダミーのテキストです | これはダミーのテキストです |
※設定が上手くできない（tableタグを囲めない）場合は「テキストモード」での作業をお勧めします
タグ
デザイン
クリップメモ
ショートコードで作成するデザインです。以下はデフォルトで用意されているデザインですが、自分でカスタマイズすることも可能です。
[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]
ミニふきだし
ショートコードで作成するデザインです。以下はデフォルトで用意されているデザインですが、自分でカスタマイズすることも可能です。
[st-minihukidashi bgcolor=”#f3f3f3″ color=”#000000″ margin=”0 0 20px 0″]（基本）これはダミーです[/st-minihukidashi]
[st-minihukidashi bgcolor=”#FFB74D” color=”#fff” margin=”0 0 20px 0″]（オレンジ）これはダミーです[/st-minihukidashi]
[st-minihukidashi bgcolor=”#F48FB1″ color=”#fff” margin=”0 0 20px 0″]（ピンク）これはダミーです[/st-minihukidashi]
[st-minihukidashi bgcolor=”#4FC3F7″ color=”#fff” margin=”0 0 20px 0″]（ブルー）これはダミーです[/st-minihukidashi]
[st-minihukidashi bgcolor=”#7CB342″ color=”#fff” margin=”0 0 20px 0″]（グリーン）これはダミーです[/st-minihukidashi]
[st-minihukidashi bgcolor=”#f44336″ color=”#fff” margin=”0 0 20px 0″]（レッド）これはダミーです[/st-minihukidashi]
複合
[st-minihukidashi fontawesome=”” fontsize=”80″ fontweight=”” bgcolor=”#FFC107″ color=”#fff” margin=”0 0 0 -6px”]自由なメモ[/st-minihukidashi]
[st-cmemo fontawesome=”fa-file-text-o” iconcolor=”#FFC107″ bgcolor=”#FFFDE7″ color=”#000000″ iconsize=”200″]
これはダミーです
[/st-cmemo]
[st-minihukidashi fontawesome=”” fontsize=”80″ fontweight=”” bgcolor=”#3F51B5″ color=”#fff” margin=”0 0 0 -6px”]ココがポイント[/st-minihukidashi]
[st-cmemo fontawesome=”fa-hand-o-right” iconcolor=”#3F51B5″ bgcolor=”#E8EAF6″ color=”#000000″ iconsize=”200″]
これはダミーです
[/st-cmemo]
[st-minihukidashi fontawesome=”” fontsize=”80″ fontweight=”” bgcolor=”#3F51B5″ color=”#fff” margin=”0 0 0 -6px”]ココがおすすめ[/st-minihukidashi]
[st-cmemo fontawesome=”fa-thumbs-o-up” iconcolor=”#3F51B5″ bgcolor=”#E8EAF6″ color=”#000000″ iconsize=”200″]
これはダミーです
[/st-cmemo]
[st-minihukidashi fontawesome=”” fontsize=”80″ fontweight=”” bgcolor=”#3F51B5″ color=”#fff” margin=”0 0 0 -6px”]ココがダメ[/st-minihukidashi]
[st-cmemo fontawesome=”fa-thumbs-o-down” iconcolor=”#3F51B5″ bgcolor=”#E8EAF6″ color=”#000000″ iconsize=”200″]
これはダミーです
[/st-cmemo]
[st-minihukidashi fontawesome=”” fontsize=”80″ fontweight=”” bgcolor=”#ef5350″ color=”#fff” margin=”0 0 0 -6px”]ココに注意[/st-minihukidashi]
[st-cmemo fontawesome=”fa-exclamation-circle” iconcolor=”#ef5350″ bgcolor=”#ffebee” color=”#000000″ iconsize=”200″]
これはダミーです
[/st-cmemo]
[st-minihukidashi fontawesome=”” fontsize=”80″ fontweight=”” bgcolor=”#66BB6A” color=”#fff” margin=”0 0 0 -8px”]さらに詳しく[/st-minihukidashi]
[st-cmemo fontawesome=”fa-search” iconcolor=”#66BB6A” bgcolor=”#E8F5E9″ color=”#000000″ iconsize=”200″]
これはダミーです
[/st-cmemo]
[st-minihukidashi fontawesome=”” fontsize=”80″ fontweight=”” bgcolor=”#F06292″ color=”#fff” margin=”0 0 0 -9px”]◯才女性[/st-minihukidashi]
[st-cmemo fontawesome=”fa-user” iconcolor=”#F06292″ bgcolor=”#FCE4EC” color=”#000000″ iconsize=”200″]
これはダミーです
[/st-cmemo]
[st-minihukidashi fontawesome=”” fontsize=”80″ fontweight=”” bgcolor=”#42A5F5″ color=”#fff” margin=”0 0 0 -9px”]◯才男性[/st-minihukidashi]
[st-cmemo fontawesome=”fa-user” iconcolor=”#42A5F5″ bgcolor=”#E3F2FD” color=”#000000″ iconsize=”200″]
これはダミーです
[/st-cmemo]
複合（アイコンなし）
[st-minihukidashi fontawesome=”fa-file-text-o” fontsize=”90″ fontweight=”bold” bgcolor=”#FFC107″ color=”#fff” margin=”0 0 0 0″]自由なメモ[/st-minihukidashi]
[st-mybox title=”” fontawesome=”” color=”#757575″ bordercolor=”” bgcolor=”#FFFDE7″ borderwidth=”0″ borderradius=”5″ titleweight=”bold” fontsize=””]
これはダミーです
[/st-mybox]
[st-minihukidashi fontawesome=”fa-hand-o-right” fontsize=”90″ fontweight=”bold” bgcolor=”#3F51B5″ color=”#fff” margin=”0 0 0 0″]ココがポイント[/st-minihukidashi]
[st-mybox title=”” fontawesome=”” color=”#757575″ bordercolor=”” bgcolor=”#E8EAF6″ borderwidth=”0″ borderradius=”5″ titleweight=”bold” fontsize=””]
これはダミーです
[/st-mybox]
[st-minihukidashi fontawesome=”fa-circle-o” fontsize=”90″ fontweight=”bold” bgcolor=”#3F51B5″ color=”#fff” margin=”0 0 0 0″]ココがおすすめ[/st-minihukidashi]
[st-mybox title=”” fontawesome=”” color=”#757575″ bordercolor=”” bgcolor=”#E8EAF6″ borderwidth=”0″ borderradius=”5″ titleweight=”bold” fontsize=””]
これはダミーです
[/st-mybox]
[st-minihukidashi fontawesome=”fa-times” fontsize=”90″ fontweight=”bold” bgcolor=”#3F51B5″ color=”#fff” margin=”0 0 0 0″]ココがダメ[/st-minihukidashi]
[st-mybox title=”” fontawesome=”” color=”#757575″ bordercolor=”” bgcolor=”#E8EAF6″ borderwidth=”0″ borderradius=”5″ titleweight=”bold” fontsize=””]
これはダミーです
[/st-mybox]
[st-minihukidashi fontawesome=”fa-exclamation-circle” fontsize=”90″ fontweight=”bold” bgcolor=”#ef5350″ color=”#fff” margin=”0 0 0 0″]ココに注意[/st-minihukidashi]
[st-mybox title=”” fontawesome=”” color=”#757575″ bordercolor=”” bgcolor=”#ffebee” borderwidth=”0″ borderradius=”5″ titleweight=”bold” fontsize=””]
これはダミーです
[/st-mybox]
[st-minihukidashi fontawesome=”fa-search” fontsize=”90″ fontweight=”bold” bgcolor=”#66BB6A” color=”#fff” margin=”0 0 0 0″]もっと詳しく[/st-minihukidashi]
[st-mybox title=”” fontawesome=”” color=”#757575″ bordercolor=”” bgcolor=”#E8F5E9″ borderwidth=”0″ borderradius=”5″ titleweight=”bold” fontsize=””]
これはダミーです
[/st-mybox]
[st-minihukidashi fontawesome=”fa-question-circle” fontsize=”90″ fontweight=”bold” bgcolor=”#03A9F4″ color=”#fff” margin=”0 0 0 0″]つまづきポイント[/st-minihukidashi]
[st-mybox title=”” fontawesome=”” color=”#757575″ bordercolor=”” bgcolor=”#E1F5FE” borderwidth=”0″ borderradius=”5″ titleweight=”bold” fontsize=””]
これはダミーです
[/st-mybox]
まるもじ（小）
丸い背景の文字を作成します。見出しタグの前などに使用するとポイントになりお薦めです。以下はデフォルトで用意されているデザインですが、自分でカスタマイズすることも可能です。
[st-marumozi fontawesome=”” bgcolor=”#f3f3f3″ color=”#000000″ radius=”30″ margin=”0 10px 10px 0″]（基本）これはダミーです[/st-marumozi]
[st-marumozi fontawesome=”” bgcolor=”#FFB74D” color=”#fff” radius=”30″ margin=”0 10px 10px 0″]（オレンジ）これはダミーです[/st-marumozi]
[st-marumozi fontawesome=”” bgcolor=”#F48FB1″ color=”#fff” radius=”30″ margin=”0 10px 10px 0″]（ピンク）これはダミーです[/st-marumozi]
[st-marumozi fontawesome=”” bgcolor=”#4FC3F7″ color=”#fff” radius=”30″ margin=”0 10px 10px 0″]（ブルー）これはダミーです[/st-marumozi]
[st-marumozi fontawesome=”fa-exclamation-circle” bgcolor=”#ffebee” color=”#ef5350″ radius=”30″ margin=”0 10px 10px 0″]（うすい注意）これはダミーです[/st-marumozi]
[st-marumozi fontawesome=”fa-exclamation-circle” bgcolor=”#ef5350″ color=”#fff” radius=”30″ margin=”0 10px 10px 0″]（注意）これはダミーです[/st-marumozi]
[st-marumozi fontawesome=”” bgcolor=”#FFB74D” color=”#fff” radius=”30″ margin=”0 10px 0 0″]ポイント[/st-marumozi]これは見出しに使用したサンプル
まるもじ（大）
丸い背景の大きめの文字を作成します。以下はデフォルトで用意されているデザインですが、自分でカスタマイズすることも可能です。
[st-marumozi-big fontawesome=”” bgcolor=”#f3f3f3″ color=”#000000″ radius=”30″ margin=”0 10px 10px 0″]基本：これはダミーです[/st-marumozi-big]
[st-marumozi-big fontawesome=”” bgcolor=”#FFB74D” color=”#fff” radius=”30″ margin=”0 10px 10px 0″]（オレンジ）これはダミーです[/st-marumozi-big]
[st-marumozi-big fontawesome=”” bgcolor=”#F48FB1″ color=”#fff” radius=”30″ margin=”0 10px 10px 0″]（ピンク）これはダミーです[/st-marumozi-big]
[st-marumozi-big fontawesome=”” bgcolor=”#4FC3F7″ color=”#fff” radius=”30″ margin=”0 10px 10px 0″]（ブルー）これはダミーです[/st-marumozi-big]
[st-marumozi-big fontawesome=”fa-question-circle” bgcolor=”#4FC3F7″ color=”#fff” radius=”30″ margin=”0 10px 10px 0″]（はてな）これはダミーです[/st-marumozi-big]
[st-marumozi-big fontawesome=”fa-check-circle” bgcolor=”#FFB74D” color=”#fff” radius=”30″ margin=”0 10px 10px 0″]（チェック）これはダミーです[/st-marumozi-big]
[st-marumozi-big fontawesome=”fa-check-circle” bgcolor=”#FFB74D” color=”#fff” radius=”30″ margin=”0 10px 10px 0″]（うすい注意）これはダミーです[/st-marumozi-big]
[st-marumozi-big fontawesome=”fa-exclamation-circle” bgcolor=”#ef5350″ color=”#fff” radius=”30″ margin=”0 10px 0 0″]（注意）これはダミーです[/st-marumozi-big]
カスタムフォント
カスタムフォントはショートコードでフォントをカスタマイズできます
[st-designfont myclass=”” fontawesome=”” fontsize=”150″ fontweight=”bold” color=”#000″ textshadow=”” webfont=”” margin=”0 0 20px 0″]これはダミーです[/st-designfont]
[st-designfont myclass=”” fontawesome=”” fontsize=”150″ fontweight=”bold” color=”#fff” textshadow=”#424242″ webfont=”on” margin=”0 0 20px 0″]これはダミーです[/st-designfont]
ステップ
「購入の流れ」などステップを使用したい場合のデザインに便利です。カラーなどがカスタマイザーの「オプション」で変更できます
[st-step step_no=”1″]お湯を入れる[/st-step]
これはダミーのテキストです
[st-step step_no=”2″]3分待つ[/st-step]
これはダミーのテキストです
[st-step step_no=”3″]完成です[/st-step]
これはダミーのテキストです
ポイント
[st-point fontsize=”” fontweight=”bold” bordercolor=””]これはダミーのテキストです[/st-point]
ラベル
[st-label label=”おすすめ” bgcolor=”#FBC02D” color=”#FFFFFF”]
[/st-label]
PC（960px以上）Tab（955px〜600px）のレスポンシブ表示となります
※コンテンツ内容は「バナーショートコード」で作成しています
流れる文字
これはダミーですこれはダミーですこれはダミーですこれはダミーですこれはダミーですこれはダミーですこれはダミーですこれはダミーですこれはダミーですこれはダミーです
バナー風ボックス
flexボックスを使用した様々なデザインを作成できます。背景画像を指定することでバナーのようなボタンを作成することも可能です。
[st-flexbox url=”” fontawesome=”” title=”タイトル” width=”” height=”” color=”#fff” fontsize=”200″ radius=”0″ shadow=”#424242″ bordercolor=”#ccc” borderwidth=”1″ bgcolor=”#ccc” backgroud_image=”” blur=”on” left=”” margin_bottom=”10″]
これはダミーのテキストです
[/st-flexbox]
サンプル例
[st-flexbox url=”” fontawesome=”fa-info-circle” title=”詳しい御案内はこちら” height=”” color=”#fff” fontsize=”150″ radius=”0″ shadow=”#424242″ bordercolor=”#ccc” borderwidth=”1″ bgcolor=”” backgroud_image=”https://uploader.xzy.pw/upload/20180627174715_85e84826_447237556d.jpg” blur=”on” left=”” margin_bottom=”10″]料金プランやサービスについて[/st-flexbox] [st-flexbox url=”” fontawesome=”” title=”泣ける！
漫画ランキング” width=”280″ height=”250″ color=”#fff” fontsize=”200″ radius=”5″ shadow=”#424242″ bordercolor=”#ccc” borderwidth=”1″ bgcolor=”” backgroud_image=”https://uploader.xzy.pw/upload/20180627174715_85e84826_447237556d.jpg” blur=”” left=”” margin_bottom=”10″]本屋さんが選んだ泣けるマンガランキング1位は？[st-mybutton url=”#” title=”今すぐCHECK” rel=”” fontawesome=”” target=”” color=”#fff” bgcolor=”#FFD54F” bgcolor_top=”#ffdb69″ bordercolor=”#FFEB3B” borderwidth=”1″ borderradius=”5″ fontsize=”90″ fontweight=”bold” width=”80″ fontawesome_after=”fa-angle-right” shadow=”#FFB300″ ref=”on”][/st-flexbox]
マイボックス
様々なボックスデザインを作成します。以下はデフォルトで用意されているデザインですが、自分でカスタマイズすることも可能です。
[st-mybox title=”ポイント” fontawesome=”fa-check-circle” color=”#757575″ bordercolor=”#BDBDBD” bgcolor=”#ffffff” borderwidth=”2″ borderradius=”5″ titleweight=”bold”]
（基本）これはダミーです
[/st-mybox]
[st-mybox title=”” fontawesome=”” color=”#757575″ bordercolor=”#ccc” bgcolor=”#ffffff” borderwidth=”2″ borderradius=”2″ titleweight=”bold”]
（しかく枠のみ）これはダミーです
[/st-mybox]
[st-mybox title=”” fontawesome=”” color=”#757575″ bordercolor=”#BDBDBD” bgcolor=”#f3f3f3″ borderwidth=”0″ borderradius=”5″ titleweight=”bold”]
（まるみ）これはダミーです
[/st-mybox]
[st-mybox title=”参考” fontawesome=”fa-file-text-o” color=”#757575″ bordercolor=”” bgcolor=”#fafafa” borderwidth=”0″ borderradius=”5″ titleweight=”bold” fontsize=”” myclass=”st-mybox-class” margin=”25px 0 25px 0″]
（参考）これはダミーです
[/st-mybox]
[st-mybox title=”関連” fontawesome=”fa-file-text-o” color=”#757575″ bordercolor=”” bgcolor=”#fafafa” borderwidth=”0″ borderradius=”5″ titleweight=”bold” fontsize=”” myclass=”st-mybox-class” margin=”25px 0 25px 0″]
（関連）これはダミーです
[/st-mybox]
[st-mybox title=”メモ” fontawesome=”fa-file-text-o” color=”#757575″ bordercolor=”” bgcolor=”#fafafa” borderwidth=”0″ borderradius=”5″ titleweight=”bold” fontsize=”” myclass=”st-mybox-class” margin=”25px 0 25px 0″]
（メモ）これはダミーです
[/st-mybox]
[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]
マイボックス（+CSSクラス）
見出し部分を中に変更したデザインです
[st-mybox title=”メモ” fontawesome=”fa-file-text-o” color=”#727272″ bordercolor=”#ff0000″ bgcolor=”#FAFAFA” borderwidth=”0″ borderradius=”5″ titleweight=”bold” title_bordercolor=”” fontsize=”” myclass=”st-mybox-class st-title-under” margin=”25px 0 25px 0″]
これはダミーです
[/st-mybox]
[st-mybox title=”メモ” fontawesome=”fa-file-text-o” color=”#727272″ bordercolor=”#ff0000″ bgcolor=”#FAFAFA” borderwidth=”0″ borderradius=”5″ titleweight=”bold” title_bordercolor=”#757575″ fontsize=”” myclass=”st-mybox-class st-title-under” margin=”25px 0 25px 0″]
これはダミーです
[/st-mybox]
[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-circle” margin=”25px 0 25px 0″]
- ダミーテキスト
- ダミーテキスト
- ダミーテキスト
[/st-mybox]
[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″]
- ダミーテキスト
- ダミーテキスト
- ダミーテキスト
[/st-mybox]
見出し付きフリーボックス
[st-midasibox title=”見出し（全角15文字）” fontawesome=”” bordercolor=”” color=”” bgcolor=”” borderwidth=”” borderradius=”” titleweight=”bold”]
これはダミーのテキストです
[/st-midasibox]
[st-midasibox-intitle title=”見出し（全角15文字）” fontawesome=”” bordercolor=”” color=”” bgcolor=”” borderwidth=”” borderradius=”” titleweight=”bold”]
これはタイトル幅を100%にしたデザインです
[/st-midasibox-intitle]
メモボックス
メモ
ここに本文を記述
スライドボックス
[st-slidebox text=”+ クリックして下さい” bgcolor=”” color=”#1a1a1a” margin_bottom=”20″]
クリックで開かれる内容です
[/st-slidebox]
チェックボックス（番号なしリスト）
[st-square-checkbox bgcolor=”” bordercolor=”” fontweight=”” borderwidth=”3″]
- これはダミーのテキストです
- これはダミーのテキストです
- これはダミーのテキストです
[/st-square-checkbox]
こんな方におすすめ（v）
サイトで効果の高い「こんな方におすすめ」リストも簡単に作成できます。カスタマイザーの「オプション」でカラー変更も可能です。
こんな方におすすめ
- これはダミーのテキストです
- これはダミーのテキストです
- これはダミーのテキストです
<ul class="st-blackboard-list st-no-ck-off">のst-no-ck-offをst-no-ckとすることでアイコンを消せます
本日のメニュー
- これはダミーのテキストです
- これはダミーのテキストです
- これはダミーのテキストです
「番号付きリスト（olタグ）」にも対応
今日のやることリスト
- これはダミーのテキストです
- これはダミーのテキストです
- これはダミーのテキストです
こんな方におすすめ[v]
こんな方におすすめ
- これはダミーのテキストです
- これはダミーのテキストです
- これはダミーのテキストです
ガイドマップメニュー
カスタムボタン
自由なボタンを作成します。幅や色、アイコンなどボタンごとに自由なカスタマイズが可能です。
ノーマル
基本
[st-mybutton url=”#” title=”ボタン” rel=”” fontawesome=”” target=”” color=”#000000″ bgcolor=”#FFF” bgcolor_top=”” bordercolor=”#CCC” borderwidth=”3″ borderradius=”0″ fontsize=”” fontweight=”” width=”100″ fontawesome_after=”” shadow=”” ref=””]
詳しくはコチラ（オレンジ）
[st-mybutton url=”#” title=”詳しくはコチラ” rel=”” fontawesome=”” target=”” color=”#fff” bgcolor=”#FFD54F” bgcolor_top=”#ffdb69″ bordercolor=”#FFEB3B” borderwidth=”1″ borderradius=”5″ fontsize=”” fontweight=”bold” width=”” fontawesome_after=”fa-angle-right” shadow=”#FFB300″ ref=”on”]
詳しくはコチラ（レッド）
[st-mybutton url=”#” title=”詳しくはコチラ” rel=”” fontawesome=”” target=”_blank” color=”#fff” bgcolor=”#e53935″ bgcolor_top=”#f44336″ bordercolor=”#e57373″ borderwidth=”1″ borderradius=”5″ fontsize=”bold” fontweight=”bold” width=”” fontawesome_after=”fa-angle-right” shadow=”#c62828″ ref=”on”]
詳しくはコチラ（グリーン）
[st-mybutton url=”#” title=”詳しくはコチラ” rel=”” fontawesome=”” target=”_blank” color=”#fff” bgcolor=”#43A047″ bgcolor_top=”#66BB6A” bordercolor=”#81C784″ borderwidth=”1″ borderradius=”5″ fontsize=”bold” fontweight=”bold” width=”” fontawesome_after=”fa-angle-right” shadow=”#388E3C” ref=”on”]
詳しくはコチラ（ブルー）
[st-mybutton url=”#” title=”詳しくはコチラ” rel=”” fontawesome=”” target=”_blank” color=”#fff” bgcolor=”#039BE5″ bgcolor_top=”#29B6F6″ bordercolor=”#4FC3F7″ borderwidth=”1″ borderradius=”5″ fontsize=”bold” fontweight=”bold” width=”” fontawesome_after=”fa-angle-right” shadow=”#039BE5″ ref=”on”]
お問合せ
[st-mybutton url=”#” title=”お問合せ” rel=”” fontawesome=”fa-envelope” target=”” color=”#fff” bgcolor=”#03A9F4″ bgcolor_top=”#14b4fc” bordercolor=”#039BE5″ borderwidth=”1″ borderradius=”5″ fontsize=”” fontweight=”” width=”90″ fontawesome_after=”” shadow=”#039BE5″ ref=”on”]
もっと詳しく（オレンジ）
[st-mybutton url=”#” title=”もっと詳しく” rel=”” fontawesome=”” target=”” color=”#fff” bgcolor=”#FFD54F” bgcolor_top=”#ffdb69″ bordercolor=”#FFEB3B” borderwidth=”1″ borderradius=”30″ fontsize=”85″ fontweight=”” width=”90″ fontawesome_after=”fa-angle-right” shadow=”” ref=”on”]
もっと詳しく（ピンク）
[st-mybutton url=”#” title=”もっと詳しく” rel=”” fontawesome=”” target=”” color=”#fff” bgcolor=”#F48FB1″ bgcolor_top=”#f6a6c1″ bordercolor=”#F48FB1″ borderwidth=”1″ borderradius=”30″ fontsize=”85″ fontweight=”” width=”90″ fontawesome_after=”fa-angle-right” shadow=”” ref=”on”]
もっと詳しく（ブルー）
[st-mybutton url=”#” title=”もっと詳しく” rel=”” fontawesome=”” target=”” color=”#fff” bgcolor=”#4FC3F7″ bgcolor_top=”#67cbf8″ bordercolor=”#4FC3F7″ borderwidth=”1″ borderradius=”30″ fontsize=”85″ fontweight=”” width=”90″ fontawesome_after=”fa-angle-right” shadow=”” ref=”on”]
人気ランキング
[st-mybutton url=”#” title=”人気ランキング” rel=”” fontawesome=”st-svg-oukan” target=”” color=”#fff” bgcolor=”#FBC02D” bgcolor_top=”#fbc846″ bordercolor=”#FBC02D” borderwidth=”1″ borderradius=”5″ fontsize=”110″ fontweight=”bold” width=”90″ fontawesome_after=”” shadow=”” ref=”on”]
ランキングはコチラ(AFFINGER又はEX版のみ）
[st-mybutton class=”” url=”#ranking” title=”ランキングはコチラ” rel=”” fontawesome=”fa-angle-double-down” target=”” color=”#1a1a1a” bgcolor=”#fdef4e” bgcolor_top=”” bordercolor=”#fceb1c” borderwidth=”1″ borderradius=”” fontsize=”95″ fontweight=”” width=”” fontawesome_after=”” shadow=”” ref=””]
ミニ
基本
[st-mybutton-mini url=”#” title=”ボタン” rel=”” fontawesome=”” target=”” color=”#000000″ bgcolor=”#f3f3f3″ bgcolor_top=”” borderradius=”3″ fontsize=”” fontweight=”” fontawesome_after=”” shadow=”#BDBDBD” ref=””]
詳しくはコチラ（オレンジ）
[st-mybutton-mini url=”#” title=”詳しくはコチラ” rel=”” fontawesome=”” target=”” color=”#fff” bgcolor=”#FFB74D” bgcolor_top=”” borderradius=”5″ fontsize=”” fontweight=”” fontawesome_after=”fa-angle-right” shadow=”#FFB300″ ref=””]
詳しくはコチラ（レッド）
[st-mybutton-mini url=”#” title=”詳しくはコチラ” rel=”” fontawesome=”” target=”_blank” color=”#fff” bgcolor=”#ef5350″ bgcolor_top=”” borderradius=”5″ fontsize=”” fontweight=”” fontawesome_after=”fa-angle-right” shadow=”#f44336″ ref=””]
詳しくはコチラ（グリーン）
[st-mybutton-mini url=”#” title=”詳しくはコチラ” rel=”” fontawesome=”” target=”_blank” color=”#fff” bgcolor=”#9CCC65″ bgcolor_top=”” borderradius=”5″ fontsize=”” fontweight=”” fontawesome_after=”fa-angle-right” shadow=”#8BC34A” ref=””]
詳しくはコチラ（ブルー）
[st-mybutton-mini url=”#” title=”詳しくはコチラ” rel=”” fontawesome=”” target=”_blank” color=”#fff” bgcolor=”#4FC3F7″ bgcolor_top=”” borderradius=”5″ fontsize=”” fontweight=”” fontawesome_after=”fa-angle-right” shadow=”#03A9F4″ ref=””]
MCボタン(AFFINGER又はEX版のみ）
[st-mcbutton url=”#” title=”今すぐ申し込む” rel=”” fontawesome=”” target=”” color=”#fff” bgcolor=”#e53935″ bgcolor_top=”#f44336″ bordercolor=”#e57373″ borderwidth=”1″ borderradius=”5″ fontweight=”bold” fontsize=”120″ width=”90″ fontawesome_after=”fa-chevron-right” shadow=”#c62828″ ref=”on” mcbox_bg=”#fafafa” mcbox_color=”” mcbox_title=”太字のテキスト”]※マイクロコピーを書いてみよう[/st-mcbutton]
会話ふきだし
「会話ふきだし」は最大8つまで設定でき、1クリックで呼び出すことが可能です
[st-kaiwa1]これはダミーのテキストですこれはダミーのテキストです[/st-kaiwa1]
[st-kaiwa2 r]これはダミーのテキストですこれはダミーのテキストです[/st-kaiwa2]
[st-kaiwa3]これはダミーのテキストですこれはダミーのテキストです[/st-kaiwa3]
[st-kaiwa4 r]これはダミーのテキストですこれはダミーのテキストです[/st-kaiwa4]
[st-kaiwa5]これはダミーのテキストですこれはダミーのテキストです[/st-kaiwa5]
[st-kaiwa6 r]これはダミーのテキストですこれはダミーのテキストです[/st-kaiwa6]
[st-kaiwa7]これはダミーのテキストですこれはダミーのテキストです[/st-kaiwa7]
[st-kaiwa8 r]これはダミーのテキストですこれはダミーのテキストです[/st-kaiwa8]
ランキング見出し(AFFINGER又はEX版のみ）
[st-rank rankno=”1″ bgcolor=”” color=”#000″ bordercolor=”#ccc” radius=”” star=”5″]ランキング1位[/st-rank]
[st-rank rankno=”2″ bgcolor=”” color=”#000″ bordercolor=”#ccc” radius=”” star=”4″]ランキング2位[/st-rank]
[st-rank rankno=”3″ bgcolor=”” color=”#000″ bordercolor=”#ccc” radius=”” star=”3″]ランキング3位[/st-rank]
[st-rank rankno=”4″ bgcolor=”” color=”#000″ bordercolor=”#ccc” radius=”” star=”2″]ランキング4位以下[/st-rank]
レイアウト
PCとTab3分割
PCとTab左右40：60%
PCとTab左右50%
PCとTab左右30：70%
全サイズ左右50%
均等横並び
Div
任意のクラスを設定するdivを作成します
マージン
マージンをつける用のボックスを作成します
タブ(AFFINGER又はEX版のみ）
[st-tab-content memo=”全体を包むボックスです”][st-input-tab text=”タブ1″ bgcolor=”#fff” color=”#1a1a1a” fontweight=”” width=”45″ value=”1″ checked=”checked”][st-input-tab text=”タブ2″ bgcolor=”#fff” color=”#1a1a1a” fontweight=”” width=”45″ value=”2″ checked=””][st-tab-main bgcolor=”” bordercolor=”” value=”1″]
タブ1のコンテンツ
[/st-tab-main][st-tab-main bgcolor=”” bordercolor=”” value=”2″]
タブ2のコンテンツ
[/st-tab-main][/st-tab-content]
その他パーツ
スター
[star5]
[star45]
[star4]
[star35]
[star3]
[star2]
[star1]
年月（EX版のみ）
[st-date]
画像付きコメント(AFFINGER又はEX版のみ）
[st-user-comment-box title=”タイトル” user_text=”◯代男性” color=”” star=”5″]
[/st-user-comment-box]
これはダミーのテキストです
[st-mybox title=”” fontawesome=”” color=”#757575″ bordercolor=”#f3f3f3″ bgcolor=”#f3f3f3″ borderwidth=”0″ borderradius=”5″ titleweight=”bold” fontsize=”” myclass=”st-mybox-class” margin=”25px 0 25px 0″]
[st-user-comment-box title=”タイトル” user_text=”◯代男性” color=”” star=”4″][/st-user-comment-box]
これはダミーのテキストです
[/st-mybox]
アドセンス
ウィジェット「広告・Googleアドセンスのスマホ用300px」で設定した内容を挿入します
オリジナルショートコード
ウィジェット「オリジナルのショートコード作成ウィジェット」で設定した内容を挿入します
YouTube
YouTube動画の貼り付けは直接URLを貼り付ける方法と、IDを指定して「サムネイル画像」リンクとして表示する方法があります。
URL貼り付け
自動でレスポンシブな動画として表示されます。
IDによるサムネイルリンク
[youtube id=2MNL2mU8pBE]
サムネイルリンクとして表示することで複数でも表示が遅くなるのを軽減できます。クリックするとYouTubeに飛んでしまうのが欠点です。
三角（下矢印）
カラーを変更できる三角矢印のショートコードです。
[st-under-t color=”#000″]
スクロールナビ(AFFINGER又はEX版のみ）
記事一覧
任意の記事の一覧の記事中の好きな位置に表示できます（EX版ではスライドショーにすることも可能）
カテゴリ一覧
任意のカテゴリの一覧を所定内であれば好きな位置に表示できます。表示する記事数やカテゴリの除外、閲覧サイズによる列数の指定（3~1）などが可能です。
[st-catgroup cat=”0″ page=”5″ order=”desc” orderby=”id” child=”on” slide=”off” slides_to_show=”3,3,2″ slide_date=”” slide_more=”ReadMore”]
カテゴリ一覧スライドショー
上記の一覧を簡易にスライドショーに変えることが可能です。
[st-catgroup cat=”0″ page=”5″ order=”desc” orderby=”id” child=”on” slide=”on” slides_to_show=”3,3,2″ slide_date=”” slide_more=”ReadMore”]
ショートコード補助
Webアイコン
ショートコードに挿入するためのWebアイコンです（アイコンが直接表示されるわけではございません。ショートコードの引数に使用して下さい）
アニメーション（クラス）
ショートコードに挿入するためのCSS用のクラスです（ショートコードの引数に使用して下さい）
HTMLカラーモード
ショートコードに挿入するHTMLカラーコードです（カラーが直接表示されるわけではございません。ショートコードの引数に使用して下さい）
[st-flexbox url=”” fontawesome=”” title=”” width=”” height=”” color=”#fff” fontsize=”200″ radius=”0″ shadow=”” bordercolor=”” borderwidth=”0″ bgcolor=”#e53935″ backgroud_image=”” blur=”on” left=”” margin_bottom=”0″]
#e53935
[/st-flexbox]
[st-flexbox url=”” fontawesome=”” title=”” width=”” height=”” color=”#fff” fontsize=”200″ radius=”0″ shadow=”” bordercolor=”” borderwidth=”0″ bgcolor=”#f44336″ backgroud_image=”” blur=”on” left=”” margin_bottom=”0″]
#f44336
[/st-flexbox]
[st-flexbox url=”” fontawesome=”” title=”” width=”” height=”” color=”#fff” fontsize=”200″ radius=”0″ shadow=”” bordercolor=”” borderwidth=”0″ bgcolor=”#ffebee” backgroud_image=”” blur=”on” left=”” margin_bottom=”0″]
#ffebee
[/st-flexbox]
[st-flexbox url=”” fontawesome=”” title=”” width=”” height=”” color=”#fff” fontsize=”200″ radius=”0″ shadow=”” bordercolor=”” borderwidth=”0″ bgcolor=”#039BE5″ backgroud_image=”” blur=”on” left=”” margin_bottom=”0″]
#03A9F4
[/st-flexbox]
[st-flexbox url=”” fontawesome=”” title=”” width=”” height=”” color=”#fff” fontsize=”200″ radius=”0″ shadow=”” bordercolor=”” borderwidth=”0″ bgcolor=”#03A9F4″ backgroud_image=”” blur=”on” left=”” margin_bottom=”0″]
#03A9F4
[/st-flexbox]
[st-flexbox url=”” fontawesome=”” title=”” width=”” height=”” color=”#fff” fontsize=”200″ radius=”0″ shadow=”” bordercolor=”” borderwidth=”0″ bgcolor=”#E1F5FE” backgroud_image=”” blur=”on” left=”” margin_bottom=”0″]
#E1F5FE
[/st-flexbox]
[st-flexbox url=”” fontawesome=”” title=”” width=”” height=”” color=”#fff” fontsize=”200″ radius=”0″ shadow=”” bordercolor=”” borderwidth=”0″ bgcolor=”#43A047″ backgroud_image=”” blur=”on” left=”” margin_bottom=”0″]
#43A047
[/st-flexbox]
[st-flexbox url=”” fontawesome=”” title=”” width=”” height=”” color=”#fff” fontsize=”200″ radius=”0″ shadow=”” bordercolor=”” borderwidth=”0″ bgcolor=”#4CAF50″ backgroud_image=”” blur=”on” left=”” margin_bottom=”0″]
#4CAF50
[/st-flexbox]
[st-flexbox url=”” fontawesome=”” title=”” width=”” height=”” color=”#fff” fontsize=”200″ radius=”0″ shadow=”” bordercolor=”” borderwidth=”0″ bgcolor=”#E8F5E9″ backgroud_image=”” blur=”on” left=”” margin_bottom=”0″]
#E8F5E9
[/st-flexbox]
[st-flexbox url=”” fontawesome=”” title=”” width=”” height=”” color=”#fff” fontsize=”200″ radius=”0″ shadow=”” bordercolor=”” borderwidth=”0″ bgcolor=”#FFC107″ backgroud_image=”” blur=”on” left=”” margin_bottom=”0″]
#FFC107
[/st-flexbox]
[st-flexbox url=”” fontawesome=”” title=”” width=”” height=”” color=”#fff” fontsize=”200″ radius=”0″ shadow=”” bordercolor=”” borderwidth=”0″ bgcolor=”#FFF3E0″ backgroud_image=”” blur=”on” left=”” margin_bottom=”0″]
#FFF3E0
[/st-flexbox]
[st-flexbox url=”” fontawesome=”” title=”” width=”” height=”” color=”#fff” fontsize=”200″ radius=”0″ shadow=”” bordercolor=”” borderwidth=”0″ bgcolor=”#212121″ backgroud_image=”” blur=”on” left=”” margin_bottom=”0″]
#212121
[/st-flexbox]
[st-flexbox url=”” fontawesome=”” title=”” width=”” height=”” color=”#fff” fontsize=”200″ radius=”0″ shadow=”” bordercolor=”” borderwidth=”0″ bgcolor=”#424242″ backgroud_image=”” blur=”on” left=”” margin_bottom=”0″]
#424242
[/st-flexbox]
[st-flexbox url=”” fontawesome=”” title=”” width=”” height=”” color=”#fff” fontsize=”200″ radius=”0″ shadow=”” bordercolor=”” borderwidth=”0″ bgcolor=”#FAFAFA” backgroud_image=”” blur=”on” left=”” margin_bottom=”0″]
#FAFAFA
[/st-flexbox]
[st-flexbox url=”” fontawesome=”” title=”” width=”” height=”” color=”#fff” fontsize=”200″ radius=”0″ shadow=”” bordercolor=”” borderwidth=”0″ bgcolor=”#FFFDE7″ backgroud_image=”” blur=”on” left=”” margin_bottom=”0″]
#FFFDE7
[/st-flexbox]
クイックボタン
エディタの上に表示されているボタンです。クリックするだけでデザインが適応されるので使用頻度の高いものなどを設定しています。
太字
選択したテキストに太字を適応します。テキスト全体の場合は「スタイル」の「太字」をご利用下さい
太赤
選択したテキストに太赤字を適応します。テキスト全体の場合は「スタイル」の「太字」をご利用下さい
黄細マ
選択したテキストに黄マーカー（細）を適応します
CT
選択したテキストや見出しに自動カウントを設定します
写真枠
写真に枠線をつけます
角丸背景
[st-mybox title=”” fontawesome=”” color=”#757575″ bordercolor=”#f3f3f3″ bgcolor=”#f3f3f3″ borderwidth=”0″ borderradius=”5″ titleweight=”bold”]
角丸のマイボックスを設定します。
[/st-mybox]
ボタンA
HTMLでボタンデザインAを挿入します（AFFINGERの場合「ランキング管理」＞「CSS」でカラーを変更できます）
ボタンB
HTMLでボタンデザインBを挿入します（AFFINGERの場合「ランキング管理」＞「CSS」でカラーを変更できます）
カード
記事IDを設定することで内部リンクをブログカード化します
[st-card id=2 label=”” name=”” bgcolor=”” color=”” readmore=”on”]
やったことがないという不安って実は素敵なもの。
このnoteは、自分に自信がない方、就活中の方、転職中の方、営業の方、
新しいことをはじめるか迷っている方に向けて書きました。
私は最近、ネットビジネスの勉強をはじめたばかりなのですが、「自分にもできるのかな？という不安になることはないですか？」という部分に焦点をあてた教材を、YouTubeなどでよく目にします。
でも私、「自分にもできるのかな…？」という不安に陥ったことが、最近実はないのです。
とんでもない自信家だな！と思われた方もいるかもしれませんが、むしろ、うつ休職中の私の自己肯定感は、常に低空飛行です。
なぜ私が、「自分にもできるのかな…？」という不安を打ち消すことができているのかという理由を２つ、書いていきます。
目次
理由① 不安なのが、あたりまえと思っているから
まさに、自信のない私らしいことなのですが、最初から、不安でしょうがないのがあたりまえ、と思っているからなんです。
人間って、本気でやろうとしていることほど、不安になります。
これは、私が新卒採用を担当していたときによく思っていたことなのですが「本当に私に営業ができるんでしょうか？」というのは本当によくある質問です。
それに対して、「どんなことが不安なの？」と聞くと、より具体的な想像を挙げて、不安げに後押ししてほしがる人ほど、本気度の高い学生さんでした。
そんなとき、私は
・〇〇さんだったら、こういうところがあるから大丈夫
・今は知識も経験もないから、不安なのが当たり前
・不安だっていうことは、それだけ本気で、具体的に考えている証拠
とよく言っていました。
たとえば真っ暗なトンネルに入らなくてはならないとき。
変な動物はいないかな…
足を滑らせてけがをしたらどうしよう…
目的地にたどりつけるかな…
人間は、たくさん想像をして、本能で不安になると思います。
でも、懐中電灯と、トンネルの地図があったらどうでしょう。
かなり安心すると思いませんか？
私は、この懐中電灯と地図が、知識と経験だと思います。
これが、私が不安を感じない理由、その①です。
知識も経験もない状態で、不安なのはあたりまえだから。
だからこそ私たちは調べたり、人に聞いたりするんですよね。
今は本当にいい時代で、有料級の情報が、ネット上にたくさん転がっています（眉唾物の情報も多いのでそれは見極めが必要ですが）
経験はやってみないと無理でも、知識だったら身につけられる。
最近、私、本気で勉強に時間もお金も投資しはじめました。
成功している人は、絶対に、謙虚に勉強していると教えてくれた人がいるので。
不安で手が止まるくらい暇があるなら、知識・勉強に時間を使った方がいいです。（これも営業時代に学んだことですが、暇＝仕事がない人はいつも不安げで、忙しい人の方が楽しそうにしていました）
理由② 失敗も経験だと思っているから
失敗は成功の母、という言葉がありますよね。
本当に私、失敗ばっかり、後悔ばっかりしてきました。
営業時代、上司やお客様に迷惑をかけたことは数知れず。
おっちょこちょいすぎて、お客様のところに忘れ物をして、あとから電話をいただいたことも何度もあります…（その節は失礼しました…）
でも、失敗は、すごくたくさんのヒントをくれます。
特に、「お断り」。
営業志望の人が、一番怖がるのがこれです。私も最初はとても辛かったです。毎回傷ついていました。
でも、変かもしれませんが、私、お断りいただくのがだんだん好きになりました。
なぜなら、お客様の本音がやっと聞けるから。
大抵の方は、営業がやってくると「今忙しいから…」などとさらっと断られるのですが、「お断り」をいただくときは別です。
たとえば、「今は変えるつもりないから」というよくあるお断り。
どうしてなのか、私は理由を聞かせていただくようにしていました。
すると、「最近変えたばかりだから」とか、「もう20年も続けているから」とか、「担当者が気に入っているから」とか。
「お断り」って、嘘じゃない、お客様の言葉が聞けるんです！
そこから、話を広げることができますよね。
営業の仕事って、自分が話しかけるのはただのきっかけであって、お客様に話していただける時間がずっと大切です。
最近変えた理由、何が気に入ったのか、お客様が何を重視しているのか…
その人が大切にしているものや、悩んでいることがわかれば、新しいご提案ができます。
実際、最初のご提案で、「もうたくさん入ってるから…」という方や、「入るつもりないから…」と言っていた方にご契約いただくことは、たくさんありました。
自分が「失敗」だと思い込んでいた「お断り」が、これだけ経験値を与えてくれたという経験をしているので、「失敗」という言葉に私、わりとプラスのイメージを持っているんだと最近気づきました。
「経験」はやってみないとわからないけど、やってみたときに怖いのは「失敗」だけ。
でも、失敗して、なにか大きなダメージを負うことはありますか？
FXなんかはともかく、就活も、ビジネスも、やってみてもう人生終わりだ、という失敗って今の時代、そんなにないです。転職も起業もできるし。
そう思えば、失敗することも、経験のうちと気軽に考えてみてはいかがでしょうか。
まとめ
私の「やったことがない」ことに対しての「不安に思わない」理由２つでした。
知識と経験がないから、不安。
だったらその２つを補ってみよう！という考え方です。
きっと、７０歳でも８０歳でも、はじめてのことってあると思いますし、それを不安に思ったり、誰かに助けてもらったりするのでしょう。
不安で仕方ないときは、もちろん私にだってあります。
だけど新しい何かをはじめるときって、せっかくならワクワクしていたくないですか？
はじめてのことに対する不安は期待に比例します。
それってとっても素敵なことですよね。
あなたの背中を押すヒントが、ひとつでも見つかったなら幸いです。
Profile
はじめまして！haruと申します。
コンプレックスまみれの人生ですが、
今はそんな自分にも誰かの役に立てないかな…
と思って最近いろいろ勉強したり、発信したりしています。
今日は、私のこれまでについて、恥ずかしながら書いてみました。（2020.7.27 2020.8.3改稿）
目次
小学生
小学生までは超おてんば。
山の中を走り回ったり、男の子とサッカーしたりしていました。
動物や虫が好きで獣医が夢でした。（今は虫、触れません）
あと本が好きだったので、小説家にもなりたかったです。
学級委員やら、図書委員長やらをやっていました。
誰もやらないなら私がやらなきゃ・やらねば体質で、
いろんなことをつい引き受けがちでした。
兄の影響で中学受験することになり、５年生から塾に通うことに。
初めての環境に怖気づき、人見知り全開に…
中学生
中学は合格できたけど、今度こそ知らない人ばかりの環境。
1年生はなんとか友達を作って楽しく過ごせましたが、
2年生でクラス替えがあると、仲の良かった友人たちとは私だけクラスが離れてしまい、1人で本を読んでばかりになりました。
いじめまではいかなかったのですが、孤独感、劣等感で鬱っぽくなってしまいました。
仲が良かったはずの友達に嫉妬したり、周りから嫌われている子に粘着されたり、女子グループのマウンティングに巻き込まれたり、男子にからかわれるネタになったりと散々でした。
勉強だけはする時間があったので、成績は悪くなかったです。（数学以外）
高校生
高校も勉強に集中する日々でした。
高校の友達は、わりと穏やかな勉強好きが多くて、中学のように変な人間関係に巻き込まれるまいと、八方美人が癖になりました。
このころの夢は翻訳家か、心理カウンセラー。
東京外国語大学へ行きたかったのですが、東京に行くなら東大に行けという学歴コンプレックスを持つ親の反対で、挫折しました。
東大に行ける学力はなかったけど、いつまでも親の言いなりな自分が嫌で、どうしても家を出たかったので、別の旧帝大を受験することに。
大学生
はじめての一人暮らし。自由って素晴らしい！
友達が欲しくて、とにかく人数の多かった合唱サークルを選びました。
思った以上の体育会系で、それまで文化部だった私は上下関係を初めて学びました。
ここでなぜかまたも学級委員体質が顔を出し、スタッフを引き受けたためあまりバイトできなかったのが心残り…
就活では、本当に自分に何ができるのか、さっぱりわかりませんでした。
でも、大学でたくさんの人に触れた結果、人間に興味がわいていました。
たまたま合説で出会った某生命保険会社に魅力を感じ、内定をいただきました。
・女性でも長く働け、キャリアアップができる
・信頼されるような人に成長できる
・転勤がない
というのが当時その会社に決めた理由。
営業からキャリアステップを積んでいく、半分営業・半分総合職のような職種でした。
社会人・営業時代
私が営業なんてできるの？…と周りからはかなり心配されましたが、苦手だからこそ成長したい！という思いで選んだ職業です。
辛いこともたくさんたくさんありましたが、振り返れば意外と営業は楽しかったです。
人間不信になったり、鬱っぽくなったりもしました。
でも、それでも、人生の中で営業を経験してよかったと思います。
この辺は長くなりそうなので詳しくはこれからどこかで書こうと思いますが、人見知り・THE 内向型の私でも、
・2年目に全国で9位
・3年目に修正S（生命保険業界の成績指標のひとつ）換算で同期で1位
を経験することができました。
「haruさんは営業っぽくないのがいいね」とお客様によく言われました。
社会人・その後のキャリア
営業のあと、
・営業指導
・若手職員の研修担当
・新卒採用担当
等を経験しました。
営業時代、「なんとなく大変そう…」と思われがちな営業の仕事のイメージを変えたい！と思っていた私にとって、広報に近い採用の仕事は、やりたいことでいっぱい。
女性でキャリアアップして活躍しているOGは貴重ということで、母校を含め、近隣の大学で、営業という仕事の楽しさややりがいを話すセミナーなんかも開かせていただきました。
本当に楽しかったし、やりがいを持って働いていました。
そして、結婚、出産。育児休業へ。
まる2年間育児に専念させていただいて、以前と同じ部署へ戻ってきたものの…そこは、まったく別の場所に変貌していました。
同じ場所、同じ目的で仕事しているはずなのに、同僚が変わると、こんなに仕事はやりづらくなるのか…と不思議なくらいでした。
その後1年。無理に無理を重ねた結果、私は心も体も限界になり、心療内科へ。現在は休職しながら、生きやすくなる道を模索中です。
休職・好きなもの・現在
休職してすぐは、ほとんど寝たり泣いたりしてばかりの生活でした。
まずは、心を癒し、体を癒し。なにもしたくない…という自分の体を無理やり起こして、子どものことだけ何とかしていました。
そのうち、自分が好きだったことを思い出します。
というか、病んでいた時期は、「これが好き！かわいい！」と思うことすらなかったなぁ、と気づかされました。子どもにも、笑顔を向けてあげられていたのかな…
本を読むこと、北欧のかわいい雑貨、おしゃれで実用的な文房具…
それからなぜか心を掴まれたのが、ムーミンでした。
あのまぁるいフォルム、まっしろすべすべなほっぺたがたまりません♡
ときめくものに囲まれて過ごしたい…
ちょっとずつ、そんな欲も出てきました。
欲ってすごいです。
人間が、明日を生きる希望です。
今は体調が良い日も増えてきています。
いままで食わず嫌いだったYouTubeやtwitterで人と関わるのさえ、楽しくなってきました。ネットで知り合った方のコミュニティにも参加して、新しいことを学ぶのが毎日楽しいです！
まずは学んだことを発信してみようと思っています。
ここまで読んでくださって、本当にありがとうございます。
これからどうぞよろしくお願いいたします。