はてなブログをシンプルかつお洒落にカスタマイズしたポイントと参考にした7つのサイト

Project365-Day21

はじめまして。ワードプレスからはてなブログに引っ越してきました初心者ブロガーです。

これを書いているのは7月1日。
ワードプレス1つめの記事は6月1日に投稿したので、たった1ヶ月でワードプレスから逃げ出してきました。

新しいブログを立ち上げるとデザインをいじりたくなりますよね。
僕はHTMLだかCSSとかいうやつが全然わかってないので、いろんなブログを参考にしてさぐりさぐりやっています。

はてなブログ1つ目の記事では、カスタマイズしたポイントと、参考にしたブログを紹介したいと思います。

テーマ:Innocent

まず全体的な印象が決まるテーマですが、僕はシンプル狂なところがあるのでなるべくクセのないやつを探した結果Innocentを使わせていただくことにしました。

Innocent - テーマ ストア

f:id:swk738:20170701011936j:plain

メニューバー

作者さんが簡単にメニューバーをつけられるようにしてくれていました。最高です。

moonnote.hateblo.jp

フォローボタン

f:id:swk738:20170701015546j:plain

shunさんのを使わせていただきました。サイドバー用のを記事を参考に改行して使わせてもらってます。

11種類も紹介してくれてて、全部おしゃれです。天才なんじゃないでしょうか。

moonnote.hateblo.jp

見出し

こちらのサイトのを使わせていただいてます。シンプルなサイトに似合うものばかりです。

デザインCSSの所にコピペするだけで変えられるんですね。

www.nxworld.net

locations

記事中にアドセンスを自動挿入

ワードプレスの時は記事中に自動でアドセンスを貼れたので、ワードプレスでも同じようにできないかなぁと思ってたんですが、すごく便利なツールを作ってくれている方がいらっしゃいました。

uxlayman.hatenablog.com

 レスポンシブ広告をレクタングルで表示

また、ブログをレスポンシブデザインにしているため、こちらの記事を参考にスマホでもPCでもレクタングルの広告が表示されるようにしました。
広告の中心表示もできちゃいました。

nelog.jp

ちなみにこの方、ワードプレスで使わせてもらった大人気テーマ、"Simplicity"の作者さんです。ほんとお世話になりっぱなしです。

カエレバのデザイン

f:id:swk738:20170701025214j:plain

こちらの2つのサイトで提供してくれているものを使わせていただきました。
必死こいてカスタムしてサウンドハウスもリンクできるようにしました。

 

www.yukihy.com

blog.mshimfujin.net

 

まだいろいろ細かくカスタマイズしてるんですが、主なところはこんな感じでしょうか。
シェアボタンとか、カスタマイズしたいところはもうちょっとあるんですが。

ちょっとシンプルになりすぎちゃったかなとも思ってるんで、少しずつカスタムしていきたいと思います。