コピペとクリックでできるはてなブログデザイン

さて、他の方のブログをみさせて頂くと、かっこよかったり、スタイリッシュだったり、かわいかったりします。はてなブログのデザインは、下に挙げる２つの方法で可能なようです。

1. 色々なデザインのテンプレートを試してみる
2. 自分でHTMLとCSSを使ってデザインする

このブログでは編集に役立つ、コードやテンプレートを公開しているブログをまとめました。コードのコピー＆ペーストで不具合が生じたものは、どう修正すればいいかも合わせて残しておきます。

• テンプレート＋デザインCSSでちょこちょこ変えるのがよい

ライブドアニュースの「ざっくり言うと」みたいなのを作ってみる - FOXISM

こちらを色だけ黒に変えて使わせていただきました。

追記；そのまま使うとなぜかスマホサイトで表示が崩れたため、リストタグに適用するcssのdisplayオプションを‘指定無し’にして解決しました。ズブの素人による修正のため、これにより他のデバイスやブラウザで不具合が生じる可能性が・・。気づいた方連絡ください。

.zakkuri li{
display:flex;
align-items:baseline;
margin:0.5em 0;
}

【はてなブログ】無料版はてなブログでトップページに記事一覧を表示する方法！ - 黒木ノ水岩

無料版だと記事がトップに全部表示されてしまって嫌だな。どうにかならないかな・・・と思ったらありました。javascriptという技術が登場しております。

はてなブログ目次デザイン／シンプル／表示・非表示／下線／黒丸非表示 - スキナコトワークス

開閉式の目次です。ニュッと出てきて楽しいです。こちらではjQueryという技術が登場しております。

CSSのコピペだけ！おしゃれな見出しのデザイン例まとめ68選

68個もあると決められなくて、もうそのままにしとこ・・ってなりますね。使わせていただきました。

シンプルで美しいはてなブログの新テーマ「Minimalism」を公開しました。 - ひつじの雑記帳

 結局テンプレート使いました。一番人気のひつじさんが作ったもので、いい感じです。最初に導入した’ざっくりいうと’の装飾は気に入っているので残してあります。