TwentyTwelveにフッターを作ってSNSアイコンを並べてみた

素材サイトの方を、空いた時間でちょっとずつカスタマイズしています。
web拍手を実装しようと思ったらサイドバーがズラズラ長くて、なんとなくキレイじゃないのでフッターを作ってそこに放り込むことにしました。ついでに今までサイドバーにあったtwitterもフッターに移動。簡単なカテゴリリストがサイドバートップにあるけど、季節によって入れ替えるので一覧をフッターに表示。とりあえず今のところは3つ使ってみました。

お世話になったのはこちらです。有難うございました。
いろいろなことをとりあえず記録しておくメモ帳 | 1000old.com
こちらをそのままコピペさせていただきました。相変わらずコイツ(”); ?>を見るとムカツクので大変ありがたかったです。
functions.phpを子テーマで弄るのが苦手なので直接追記しましたが、ほかは子テーマに追記しています。

そのままコピペしてもCSSがちょっとアレなんで、長くなるけど自分が判りやすいように追記してみました。{}が全角です。
.widget-area-footer {
font-size: 13px; /* 念のためフォントサイズを統一 */
font-size: 0.928571429rem;
line-height: 1.846153846; /* 高さを指定して行間を空ける */

.widget-area-footer h4 {
line-height: 2; /* 高さを指定して行間を空ける */

.widget-area-footer li {
line-height: 1.6;
margin-left: 12px;
margin-left: 0.857142857rem; /* リストをずらす */

これでサイドバーウィジェットと同じような感じになりました。
フッター
h4のfont-colorの指定がないのに青になっている理由は、body全体ですでに指定してあるからです。
そして自分の記事を見ながらweb拍手を実装(ホントに備忘録だよw)、ついでにSNSボタンとランキングも羅列。SNSボタンって意外に簡単に設置できるんですね。
google+
google+共有
twitter
はてなブックマーク
SNSボタンは上記からソースをコピペしただけです。
私はFacebookもmixiもやっていないので、その辺りの設定は判らないというより出来ませんでした。LINEもやってないんですが、これは出来そうなので時間のあるときに詳しく調べようかと思います。

ここまで読んでWP Social Bookmarking Light使えばいいんじゃないの?と思われた方多数だと思うんですけど、デザイン的な都合でこうなりました。出来れば自分でSNSアイコンを作りたいですね。自作アイコンを使ったらWP Social Bookmarking Lightは使いにくいんですよ。
つまり、いずれは自作アイコンを使おうね!という地味な目標を立てているだけです。しかし地味な目標がいっぱいあるのでいつ実現するやら…
バラ
来年かな

スポンサードリンク
Pocket
LINEで送る

Bookmark the permalink.

コメントを残す

メールアドレスが公開されることはありません。

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

  • スポンサードリンク