ぼーる丸の部屋

イラスト情報系雑記ブログです!

ぼーる丸の部屋

はてなブログのレイアウトをカスタマイズするために参考にした記事まとめ

f:id:ballmaru:20180408080229j:plain

どうも、ぼーる丸です。

 

 

今まで使用していたブログテーマ「Brooklyn」も悪くはなかったのですが、

もうちょいこだわってみようかな!と思い半日でレイアウトを改造しました!

 

実はほぼコピペなんですが、情報を集めるだけでも結構大変だったので参考になれば!

テーマ変更

テーマには「Coffee Break」を採用しました。

 

きっかけは下記記事なんですけど、ここまで作り込むことはできなくても

参考にできるところは参考にしてデザインをスッキリさせよう!という狙いです。

www.okuni.me

プライバシーポリシー&フッタ設置

これマジで知らなかったので「ありがてえ…」ってなったんですが、

アドセンスを導入する場合はプライバシーポリシーを設置するべきなんだそうです。

www.okuni.me

 

そしてプラポへのリンク用にフッタも設置!

www.okuni.me

 

これで安心だね!(アドセンス審査が通るとは言ってない)

(「オークニズム」さんばかりですみません…めっちゃ参考にさせていただきました。)

ヘッダメニュー設置

下記記事を参考にヘッダメニューを設置しました!

画面サイズによって表示が変わるハイテクなメニューです!

About」も追加したので是非チェケラ!

www.yukihy.com

SNS共有ボタンデザイン変更

なんかはてなブログデフォルトのボタンちっこいな…これでは押しにくい!

と思ったので、押しやすそうなデザインのSNS共有ボタンに変更しました!

CSSは下記記事を参考にしたよ!

webgaku.hateblo.jp

テーマデザイン自体をカスタマイズ

テーマデザイン自体を編集する画面がどこにも無くて、あれ?おかしいなーって探しまわっていたのですが、

デザインCSS内でcssファイルを参照しているみたいでした。

下記記事を見つけられなかったら未だにおろおろしていたことでしょう。

monakaa.hatenablog.com

 

おかげで、ちょっと都合が悪い動きをするところは改変できました!

 

あとは下記記事で記事一覧のリンクボタンをふわっとさせる動作とか追加!

www.okuni.me

書いた人を記事下に掲載

閲覧する側にとっては、誰が記事書いてるかわかって助かる!ってなる機能

これはつけるっきゃない!というわけで下記記事を参考に導入しました!

skyfish25.hatenablog.com

読者&フォローボタン追加

読者ボタン、もうちょっとわかりやすいところにあった方が良いな~って思ったので

これも下記記事を参考に記事下に追加しました!

www.yukihy.com

TOPページのはてなスターを非表示化

TOPページにはてなスターが表示されているとレスポンスが悪くなるみたいです!

ちょっと見た目寂しくなっちゃいますが、自分は消すことにしました!

www.doronkoasobi.xyz

関連記事追加

当ブログではてなブログ標準の関連記事を使うと、CSSの関係で表示がおかしくなるので

外部の関連記事で表示する方法を採用しました!

(※ただ設置したはずなんですが、表示されない…記事が少ないからかな?)

www.yukihy.com

とりあえずはしばらくこのレイアウトで!

SEO対策など含め、ブログの設定をいじり倒してきましたが

大体必要な部分は実装できたかなと思います!

あんまり凝りすぎてもキリが無いし、そのうちまた変えたくなる頃が来ると思うのでこの辺で!

 

ではでは!

 

(はてなブログ関連本はこちらから!)

スポンサーリンク