【まとめ】はてなブログを始めたときに行った５つのカスタマイズ

最終更新日 2017年6月15日

このブログを始めたときに行った５つのカスタマイズを紹介いたします。

使用したテーマははてなブログテーマで一番人気がある「Brooklyn」です。

基本的な設定は色んなサイトが紹介していますが、自分でちょっと迷ったところを備忘録的に残しました。

「役に立つ！はてなブログのカスタマイズ20選」をまとめてみました。

WordPress侍

2020.11.21

役に立つ！はてなブログのカスタマイズ20選

https://wordpress-samurai.com/hatenablog_customize_20

併設していた「はてなブログPro」を解約し、サイトを閉鎖いたしました。しかし、はてなブログのカスタマイズ記事を多数掲載していたので、そのまま無くすというのも勿体ないと思い、WordPressサイトではありますが、カスタマイズ記事だけをこちらのサイトに移設いたしました。記事文章につきましてはなるべく原文を使用しているため、おかしな内容になっているかもしれませんが、「はてなブログ」を利用されている方にはご理解いただけると思っています。また、はてなブログと動作が違うものもいくつかあります。それは、イメージを持...

はてなブログをやるなら、制限が少ないはてなブログProがオススメ！

Googleウェブフォント設定

Webフォントは、Webサイト上で表示できるフォントのことです。

Google ウェブフォントは無料で利用でき、英字フォントを変更するだけで見た目がガラッと変わります。

Googleウェブフォントはとてもかんたんに設定できますので、その方法を残しておきます。

WordPress侍

2017.06.06

はてなブログカスタマイズ 簡単！Google ウェブフォント設定

https://wordpress-samurai.com/hatena_google_font

このブログを開設した時に行ったカスタマイズを紹介いたします。現在サイトは閉鎖いたしましたので「はてなブログ」でのカスタマイズとなります。フォントはGoogleウェブフォントを利用しました。フォント設定は簡単ですので試してみて下さい。使用したテーマははてなブログテーマで一番人気がある「Brooklyn」です。 「役に立つ！はてなブログのカスタマイズ20選」をまとめてみました。はてなブログをやるなら、制限が少ないはてなブログProがオススメ！Googel Fontsへアクセスする Google web Fontsへ移動します。利用したいコ...

Brooklynのヘッダー画像をスマホで表示する

はてなブログで人気が高い「Brooklyn」ですが、レスポンシブデザインを採用したらヘッダー画像がリサイズされずに大きいままで表示されていました。

いろいろ調べて結構苦労しました。

WordPress侍

2017.06.06

はてなブログカスタマイズ ヘッダー画像がスマホで小さくならない

https://wordpress-samurai.com/hatena_responsive

このブログを開設した時に行ったカスタマイズを紹介いたします。現在サイトは閉鎖いたしましたので「はてなブログ」でのカスタマイズとなります。せっかくヘッダー画像を準備したのに，レスポンシブデザインを採用した時，スマホで見えるヘッダー画像サイズが小さくならずに苦労しました。その時の対応を備忘録を兼ねて記事にしました。使用したテーマははてなブログテーマで一番人気がある「Brooklyn」です。 「役に立つ！はてなブログのカスタマイズ20選」をまとめてみました。はてなブログをやるなら、制限が少ないはてなブログPro...

Brooklynの吹き出しを削除

Brooklynは良いテーマですが、特徴的な見出しやサイドバーの左下に付いている吹き出しが馴染めず削除することにしました。

この吹き出しはリセットしなくては削除ができません。

うぇぶ活

 

6 Users

Entry is not found - うぇぶ活

http://affiliate-couple.hatenablog.com/entry/customize_heading

移設いたします

グローバルメニューにアイコンwebフォント設定する

グローバルメニューはヘッダー画像と並んでブログの顔ともいえる部分です。

しかし、ただ文字だけでは面白くありません。

アイコンwebフォントを設定することで見た目もガラッと変わります。

うぇぶ活

 

1 User

3 Pockets

Entry is not found - うぇぶ活

http://affiliate-couple.hatenablog.com/entry/globalmenu

移設いたします

トップに戻るのカスタマイズ

「ページのトップに戻る」ボタンは今や必須の設定です。

その戻るボタンを少しカスタマイズして印象的にしてみました。

うぇぶ活

 

3 Users

Entry is not found - うぇぶ活

http://affiliate-couple.hatenablog.com/entry/returntop

移設いたします

まとめとして

今回の５つの設定は当ブログを始めたときに設定したものです。

基本は「ヘッダ」「記事上・下」「フッタ」に記述し、色や形は「デザインCSS」に追加します。

ほとんどが「コピペ」で行えますので、気軽に挑戦してみてください。

これからも面白いカスタマイズがあれば取り入れていこうと思っています。