https://simadzu.hatenablog.com/entry/hatena-blog-customize

はてなロゴ

このブログで今までやってきたはてなブログのカスタマイズを厳選してまとめました。
※ このブログのテーマはMinimalismなので他のテーマで表示できないかもしれません。

カスタマイズのポイント

リストの黒ポチをはてなのアイコンフォントに変更したのをきっかけに、記事にするほどでもないが忘れないように残しておきたい、カスタマイズの小ネタ記事。

自分が見たくなるように、ブログを書きたくなるように、モチベーションを高めるため、ブログをカスタマイズしています。記事にするほどでもないカスタマイズの小ネタを過去の分も含めてメモとして箇条書きしてあります。

はてなブログを高速化するための4つポイントをまとめた記事。
特に画像の最適化（圧縮）と使わない機能を無効にすることが大事。

はてなブログを高速化するための大きくわけて4つのことについてまとめました。ブログの表示速度を改善するために一番効果があるのは、画像を最適化（圧縮）することだと思います。あとは、はてなブログの使わない機能を無効にすることくらい…

ほかのはてなブログではあまり見かけない、簡単なのに気がきいた感じに見せる小技。
検索ボックスや関連記事を見やすくするちょっとした簡単カスタマイズです。

あのブログよりもちょっと差がつくはてなブログの簡単なカスタマイズをご紹介します。ブログをちょっとカスタマイズするだけで自分のブログに愛着がわくかもしれませんよ。このブログでも実際に使っているので確認してみてください。

ウェブフォントを使って上に戻るボタンを設置する。ボタンは右端に固定して常時表示。
（JavaScriptを使ってまで、ボタンをスクロールでふわっと表示させなくてもいいと思う）

今まで作ってきた「上に戻るボタン」と「画像で上に戻るボタン」を応用してコピペで簡単にはてなブログに設置できる「上に戻るボタン」を作成しました（バージョン2）。

はてなブログのトップページにJavaScriptで「前のページ」リンクを設置した。
上に戻るボタン（ページトップへ戻るボタン）ではありません。

はてなブログでは、カテゴリーや月別アーカイブには、前のページに戻るリンクがあるのですが、なぜか、トップページには、前に戻るリンクがなく、ブラウザの戻るボタンで戻るしかありません。そこで、JavaScript（jQuery）で「前のページ」…

ブログタイトルや記事タイトルで使われている<h1>タグをJavaScriptで書き換える。
個別記事ページでは、ブログタイトルの<h1>タグを<div>タグに、トップページでは記事タイトルの<h1>タグを<h2>タグにそれぞれ書き換える。

はてなブログでは、ブログタイトルと記事タイトルにタグが使われていますが、個人的には、ひとつのページにタグがふたつあるのはおかしい気がしています...。

記事の日付（投稿日）を日めくりカレンダー風にカスタマイズ。カレンダーをfloat:leftで左寄せしてその横に記事タイトルとカテゴリーを回り込ませて表示する。

はてなブログのカスタマイズはやりつくした感があったのですが、検索ボックスをちょっとだけカスタマイズしてから、もう少しできるんじゃないかと、ネットを調べたり、過去の記事を書き直したり、ブログのCSSを調整したりしていました。

はてなのアイコンフォント（引用符アイコン）を回転させたり、アイコンの背景を丸くしたりして、引用のデザインをカスタマイズする。

以前に、はてなブログの引用デザインを画像で表示したのですが、はてなのアイコンフォントにある引用符のアイコンをなんとか利用できないかといろいろやってみました。
引用：はてなブログの引用デザインをはてなのアイコンフォントで表示

JavaScriptでサイドバーの最新記事の新着記事（投稿日時が今日から～日以内の記事）へのリンクにNEWマークを表示する。

このブログでは、サイドバーの最新記事のリンクに、はてなのアイコンフォントを表示させているのですが（はてなブログのサイドバーの最新記事にアイコンを表示）、それでもまださびしい感じがするので、新着記事にNEWマークを表示させてみる…