はてなブログテーマInnocentは素のままではとてもシンプルです。 もともと自分でCSSをいじってカスタマイズすることを前提としたテーマなのです。今回は、はてなブログテーマInnocentに色の統一感を出すカスタマイズを施していきます。 はてなブログテーマInnocent サイドバー見出しのカスタマイズ 記事リストのデザインを考える サイトタイトルの色も統一する ナビゲーションバーも同じ色使いにカスタマイズする はてなブログテーマInnocent イノセントは、はてなブログテーマの中でも特に人気の高いテーマです。2018年8月現在では人気順で第三位に入っています。 その理由は何と言ってもカスタマイズがしやすいから！人気の高いテーマだけにカスタマイズ記事も豊富です。 そのため見出しをカスタマイズし、サイドバーをカスタマイズし、ナビゲーションバーをカスタマイズし、というようにカスタマイズし放

はてなブログにナビゲーションバーを設置する方法について備忘録として書いておきます。 本記事はいったん削除していたのですが今でも一定のアクセスがあります。ナビゲーションバー設置でお困りの方にNot Found表示では申し訳ないので復活させました。 はるなぴのサイトを例に具体的なHTMLを載せてありますので是非ご参考にしてみてください。分かりやすい記事を心がけて書きました。 ナビゲーションバーを設置する理由 Innocetテーマでナビゲーションバーを設置する方法 ナビゲーションバー設置用HTMLタグ設定 ナビゲーションバー表示用CSS設定 ナビゲーションバー用JavaScriptの設定 ナビゲーションバーが動くかどうかテストしてみる PC版ナビゲーションバーの動作確認 スマホ版ナビゲーションバーの動作確認 タブレット版ナビゲーションバーの動作確認 ナビゲーションバーとヘッダー画像の設置でブログ

はてなブログにヘッダー画像を設置しようとしたら思った以上に苦労した経験を備忘録として書いておきます。 何に苦労したかというとヘッダー画像のサイズが合わなかったこと。余白が合わないとかパンくずリストから下にヘッダー画像がはみ出してしまったりと散々でした。 ヘッダー画像を設置していないとカスタマイズしたとみなされないような雰囲気ってあるみたいですね。はるなぴはヘッダー画像は個人ブロガーには必ずしも必要ないんではないかと思う時もあります。 ヘッダー画像があると表示が重たくなりますし、表示が崩れたりなんだりとブログの内容と関係ないところで苦労しなくてはなりませんからね。 でも不満ばかりも言っていられません。頑張りましょう！ ヘッダ画像設定での苦労話 ヘッダー画像をCSSで設定する はてなブログ設定のヘッダ画像の外し方 はてなフォトライフに作成したヘッダ画像を登録 はてなフォトライフの画像をCSSを

ブログ運営報告です。 はてなブログで本気入れ始めて20日で読者100人突破しました！ これを機に読者の方の役に立つ記事をこれからもどんどん書いていこうというモチベーションが湧いてきました。 はてなブログを開設するも… 初めての読者ができて本気モードに 読者が100人を突破 登録ボタンが見つからない カスタマイズで動作がおかしいものも うまいカスタマイズ はてなブログを開設するも… はてなブログを開設したのは5月22日です。記事はちらほら書いていたのですが、他のブログはほとんど読まず、スターもブックマークもつけずじまい。 こんなんで読者が増えるわけありませんよね。初めての読者ができたのがなんと6月10日です。20日間近く完全にぼっち状態でした！ www.halu7.com 初めての読者ができて本気モードに 初めて読者ができてみてやっと本気を出す気になったという訳です。 記事の文字数もそれまで

はてなブログに外部CSSファイルをリンクする方法のお勧め記事です。 この方法はメリットいっぱいなのに案外知られていないみたいです。ブログのデザインをCSSでカスタマイズする時にとってもラクチンです。 はてなブログでCSSカスタマイズする方法についても書いていますので、こちらのカテゴリページをご覧ください。 www.halu7.com Dropboxに外部CSSファイルを置いて共有化する はてなブログのhead内にリンクタグを設定 外部からCSSファイルを配信するメリット テーマCSSとの干渉を避けることが可能 小さくて見にくい「デザインCSS」の窓ではなく使い慣れたテキストエディタが使用可能 ファイルを更新するだけですぐにCSSが適用される 外部CSSファイルの読み込み速度もOK まとめ Dropboxに外部CSSファイルを置いて共有化する 外部CSSファイルをDropboxに置いて共有化