AFFINGER(アフィンガー)とEX版のランキング見出し
star="5"の数字を変えれば星の数も変わるよ★
ランキング1位
1 | [st-rank rankno="1" bgcolor="" color="#000" bordercolor="#ccc" radius="" star="5"]ランキング1位[/st-rank] |
ランキング2位
1 | [st-rank rankno="2" bgcolor="" color="#000" bordercolor="#ccc" radius="" star="4"]ランキング2位[/st-rank] |
ランキング3位
1 | [st-rank rankno="3" bgcolor="" color="#000" bordercolor="#ccc" radius="" star="3"]ランキング3位[/st-rank] |
ランキング4位以下
1 | [st-rank rankno="4" bgcolor="" color="#000" bordercolor="#ccc" radius="" star="2"]ランキング4位以下[/st-rank] |
AFFINGER(アフィンガー)とEX版のレスポンシブボックス
ここにテキスト
画像エリアにアフィリエイトのレクタングルバナーを貼ると収まりが良いのでおすすめ。
1 | <div class="clearfix responbox"><div class="lbox"><img src="ここに画像" /></div><div class="rbox"><p>ここにテキスト</p></div></div> |
AFFINGER(アフィンガー)とEX版のMCボタン
bgcolor="#e53935" bgcolor_top="#f44336" bordercolor="#e57373"でボタンの色の変更ができます。
1 | [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] |
ランキングボックス完成図
ランキング1位
ここにテキスト
見出し+ボックス+MCボタンを合わせて完成♡
1 2 3 4 5 6 7 8 9 10 | [st-rank rankno="1" bgcolor="" color="#000" bordercolor="#ccc" radius="" star="5"]ランキング1位[/st-rank] <div class="clearfix responbox"> <div class="lbox"><img class="alignnone size-full wp-image-518335" src="https://mieuxblog.com/wp-content/uploads/2020/09/computer01_smile.png" alt="" width="200" height="187" /></div> <div class="rbox"> ここにテキスト </div> </div> [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] |