画像と同じようにfacicon.icoがアップロードできて、操作が簡単。
逆に「コードをいじらないといけない」なんてこともないし！

Favicon Rotater がおすすめです。

　 　Favicon Rotator 公式ページ

まず、管理ページのプラグイン＞favicon rotaterの「設定」をクリック。

favicon icon の設定画面

Browser Iconの「Add Icon」ボタンをクリックすると、画像を選ぶ画面になるので、favicon.icoをドラッグ＆ドロップでアップロードしてください。

そのあと、「Add Brower Icon」クリックで、設定完了！

シンプルでおすすめです。

スマホ用の「Touch Icon」の設定もできるよ。

画像をグリッド上に並べるときなんかに使うかもな、という感じ。

画像クラスにm20指定

画像クラスにm0指定

<div class="clearfix">
画像クラスにm20指定
<img src="http://tcd014an.sukkiris.com/wp-content/uploads/2014/10/021-e1412587036283.jpg" alt="021" width="150" height="133" class="m20 l-flo size-full wp-image-136" /><img src="http://tcd014an.sukkiris.com/wp-content/uploads/2014/10/021-e1412587036283.jpg" alt="021" width="150" height="133" class="m20 l-flo size-full wp-image-136" /><img src="http://tcd014an.sukkiris.com/wp-content/uploads/2014/10/021-e1412587036283.jpg" alt="021" width="150" height="133" class="m20 l-flo size-full wp-image-136" /></div>

<div class="clearfix">
画像クラスにm0指定
<img src="http://tcd014an.sukkiris.com/wp-content/uploads/2014/10/021-e1412587036283.jpg" alt="021" width="150" height="133" class="m0 l-flo size-full wp-image-136" /><img src="http://tcd014an.sukkiris.com/wp-content/uploads/2014/10/021-e1412587036283.jpg" alt="021" width="150" height="133" class="m0 l-flo size-full wp-image-136" /><img src="http://tcd014an.sukkiris.com/wp-content/uploads/2014/10/021-e1412587036283.jpg" alt="021" width="150" height="133" class="m0 l-flo size-full wp-image-136" />
</div>

指定方法はこんな感じ。
m0: マージン上下左右０
mt0: マージン上側０
mr0: マージン右側０
mb0: マージン下側０
ml0: マージン左側０

数字部分は、0~80まで5刻みで指定可。
（0,5,10,15,20,25,30,35,40,45,50,55,60,65,70,75,80)

パディングも同じような感じ。
p0: パディング上下左右０
pt0: パディング上側０
pr0: パディング右側０
pb0: パディング下側０
pl0: パディング左側０

数字部分は0,5,10。

こんな感じです。

アラアラ大変、こんなに回りこむだなんて。
予想もしていませんでしたわ、回り込み。使いドコロもちょっと難しい気がしますのよ。

アラアラ大変、こんなに回りこむだなんて。
予想もしていませんでしたわ、回り込み。使いドコロもちょっと難しい気がしますのよ。

r-flo:画像右　文字左の回り込み
l-flo:画像左　文字右の回り込み
f-clear:回りこみ解除

※f-clearはちょっと意図した動きにならなかったので、別のとこで定義されてるっぽい、clearfixというクラスを指定してみました。このクラスを指定したdivで囲むと、divを閉じた瞬間に回りこみ解除されます。

<div class="clearfix">
<img src="http://tcd014an.sukkiris.com/wp-content/uploads/2014/10/021-e1412587036283.jpg" alt="021" width="150" height="133" class="r-flo size-full wp-image-136" />
アラアラ大変、こんなに回りこむだなんて。
予想もしていませんでしたわ、回り込み。使いドコロもちょっと難しい気がしますのよ。
</div>
<div class="clearfix">
<img src="http://tcd014an.sukkiris.com/wp-content/uploads/2014/10/021-e1412587036283.jpg" alt="021" width="150" height="133" class="l-flo size-full wp-image-136" />
アラアラ大変、こんなに回りこむだなんて。
予想もしていませんでしたわ、回り込み。使いドコロもちょっと難しい気がしますのよ。
</div>

どうだろ…商品PRとかに使えるかな。

<div class="align1">
まずはじめに、
これが中央寄せ
なのでございますよ。
</div>
<div class="align2">
続いてコレが、
右寄せで
ございますね。
</div>
<div class="align3">
最後になりましたが、コレが、
左寄せで
ございます。
</div>

ちょっとね…クラス名の付け方センス無いね（笑）　どれが中央か右かわからないじゃん。

背景色変更

背景が黄色
背景が青
背景が赤

<span class="bg-yellow">背景が黄色</span>
<span class="bg-blue">背景が青</span>
<span class="bg-red">背景が赤</span>

合わせ技　b=太字、yellow＝文字色黄色

背景が赤

<span class="b yellow bg-red">背景が赤</span>

こうやって、スペースで区切って複数クラスを指定すると、複合効果（？）が出る。

文字色を変える

赤色
青色
緑色
オレンジ色
ピンク
灰色

<span class="red">赤色</span>
<span class="blue">青色</span>
<span class="green">緑色</span>
<span class="orange">オレンジ色</span>
<span class="pink">ピンク</span>
<span class="gray">灰色</span>

「オレの赤色はコレじゃない！」という人は、テーマのstyle.cssに定義があるので修正してね。
赤なら、.redの色コードを書き換えるだけ。

ボタン

ボタン１
ボタン２

<a href="#リンク先" class="button">ボタン１</a>
<a href="#リンク先" class="button2">ボタン２</a>

aタグにclass指定するだけ。公式ページはこちら、とか、詳細はこちら、とかで多用しそうだね。
文字が小さめだけど、それはANのデザインに合わせてるのかな。

これがフォントサイズ７０％
これが通常の大きさ（１００％）
これがフォントサイズ２２０％

<span class="text70">これがフォントサイズ７０％</span>
<span class="text100">これが通常の大きさ（１００％）</span>
<span class="text220">これがフォントサイズ２２０％</span>

１００％サイズはclass指定ナシのときと同じ大きさ。
text70
text80
text90
.
.
text210
text220
と、１０刻みで用意してあるみたい。

強調したい箇所で意外と使うかな。

が…そのやり方が、いまいちどこに書いてあるのかわかりません（笑）

メンバーサイトには、「うちのテンプレートには、余計な装飾機能ないよ」と言ってるかのように、なんの解説もないし！

見出しデザインその１

見出しデザインその２

こんなふうに、classにnews_headline1とかnews_headline2を指定すればOK。

<h3 class="news_headline1">見出しデザインその１</h3>
<h4 class="news_headline2">見出しデザインその２</h4>

そんな感じ。他にも色々装飾ができるので、引き続き解説していきます。

ほどよい間隔でレイアウトされてると、「なんか情報がいっぱいあって、整理されてるゥー」っていう感じがするみたい。

あ、画像だけだと、何故か白いワクが表示されないので、リンク先も指定してね。

広告は、色合いが目立ちすぎると下品になるので、落ち着いた色を選ぶといいかも。あ、チカチカアニメーションするやつも避けたほうがいいかな…。

・・・って、広告が目立たなかったらクリックされないよなー。うーん、なやむ。