Simplicityカスタマイズ。ブログ最下部へHOMEボタン設置

ホームボタン

前回は、フッターのライセンス部分のブログネームをロゴ画像に変更しました。
今回は、その上にHOMEボタンを設置してみます。

まずは、こちらから

このライセンス部分は、PCでもモバイルでも最下部に位置するため
ここへHOMEボタンを設置することは、スクロールでTOPへ戻る手間が省け、直帰率 の改善にも役立つかもしれません。

私なら、気に入ったサイトを閲覧してて最後まで読んだときにHOMEボタンがあると親切に感じますがいかがでしょうか?

スポンサーリンク

設置方法

完成図はこんな感じです 
フッターへ設置したホームボタン

↑は私のフッターの背景色に合わせてます。

テーマの編集

前回、ライセンスを編集した箇所です。

外観テーマの編集Simplicity1.6.0: フッター (footer.php)を開きます。

↑の記述部分を探し、これの間、<div class="clear"></div>の下へ

↓のようにハイライトしてる2行目へ自ブログのアドレスを入力してペースト。

CSSの追加

Simplicityの子テンプレへ↓をペーストして下さい。

2行目の「-15px」の箇所で下のテキストとのすき間が調整できます。
空けすぎるとブサイクだし詰めすぎるとモバイル時にリンクが近すぎるとGoogleに叱られてしまいます。

5行目ではリンク下線を除去。

8行目からは、マウスホバー時に色と太字へ変更しています。

設置後のモバイルビュー

私のアニメーション・リンクの場合でも横幅を300px以内で作ればスマホからでも綺麗に見えます。
(iphoneでキャプチャーしました。)

スマホから見たホームボタン

そざい

けんぞうファクトリー(GIFアニメ工場) 


↑ここまでのものを設置したい方はいないと思いますが
もし、同じ物が欲しいという方がいれば気軽にコメントして下さいね♪

以上!お疲れ様でした♪(^^)/

スポンサーリンク

このページをシェアしてくれたら嬉しいな~(*'∀'人)

テスト
おじぎ猫 訪問ありがとうございました。

お知らせ
スパムが多いため、コメントは承認制になっています。
確認次第、承認と返信をいたしますね。(^^)/

My Youtube
石巻貝を助けるコリドラス 石巻貝を助けるコリドラス
morphing morphing
恐竜体操で食べられた!? 恐竜体操で食べられた!?
ゴジラのパロディ ゴジラのパロディ
アナと雪の猫王 アナと雪の猫王
Prince PURI #2 Prince PURI #2
トカゲ酒飲んで変身!! トカゲ酒飲んで変身!!

 15日月末ポイント消滅 !? 確認はこちら 楽天市場

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

トップへ戻る