そっとプロジェクト@Wiki
デザインのカスタマイズ
最終更新:
sotto_project
はてなブログのデザインのカスタマイズ
CSSカスタマイズの基本資料
- HTML構造 - tikeda's blog
- 11/7時点でのHTML構造。CSSカスタマイズの参考資料。
- はてブロのCSSメモ Aero編 - 癒しの光源
- はてなブログのデザインテーマ別表示領域一覧 - 正衛門
カスタマイズの注意点
CSSに全角日本語を使用すると正しく出力されない不具合
【追記】2012/7/11、修正されました
- デザイン設定ページの「デザインCSS」内で日本語が書けない不具合を修正しました
imageプラグインエラー : 画像を取得できませんでした。しばらく時間を置いてから再度お試しください。 Okome
おこめはてなブログ
せっかく招待いただいたのではじめてみたんですけど
予想を上回るβっぷりにびっくりしてます
http://okome.hatenablog.com/
とりあえず管理画面のCSSいじくれるところに.profile-description {display:none;}
を追加で同じ文章が二つ表示されてる状態からは脱しましたが
ここに日本語で説明文とか入れるととたんに
CSS読まなくなるというのに気がつくまでに時間がかかったりしました
(2011/11/22 10:19:20)link
CSSに全角日本語を使用すると正しく出力されない不具合が発生しております。近日中に修正予定です。ご不便をおかけして申し訳ございません。
はてなダイアリーの時のようにデザインを管理画面で書いたCSS等をテーマとして管理できないの?
したいです
ブログテーマの配布
- theme.hatenablog.com
- 140字以上書けないブログテーマ作った - Ueday::HatenaBlog
- ブログテーマ作った - Ueday::HatenaBlog
- 物書きのための非公式ブログテーマ - nitro_idiot's diary
- 縦書き表示。「最新のGoogle Chrome、Safari、IE9で縦書きで表示され、Firefox、Opera、IE6-8では横書きで表示されます」
カスタマイズ事例
- はてなブログのデザインカスタマイズに挑戦! - masabossa's diary
- CSSを弄ってみる - 4sk :: blog :: (beta)
- はてなブログのデザインを少しだけいじくったのでCSSをさらしてみる - algonrithmのはてなブログですか?
- はてブロカスタマイズ - murmure
- グローバルヘッダの文字色を変える - Ueday::HatenaBlog
- 背景色をランダムにする -
笨倪併笳。笊ケ笨・http://r7kamura.hatenablog.com/entry/2011/11/18/220757
- ランダムに画像を表示
- 水平線まで何ピクセル? -
笨倪併笳。笊ケ笨・http://r7kamura.hatenablog.com/entry/2011/11/12/045548
- 水平線や見出しにCSSのbefore擬似要素で装飾
- はてなブログの広告を薄くする方法 - $takc923-
サイドバー
- サイドバーが書き込めるようになった - KLE4cのとりあえずHatenaBlogテスト日記
- サイドバー編集機能の安定した使い方 - flandlescarlet's diary【はてなblogマスターへの路】
- はてなブログサイドバーにカテゴリ一覧を自動表示する - カワイイはつくれる
- 「Zenback」をはてなブログのサイドバーに組み込む方法 - nanapi Web
- サイドバー編集機能良い - hitode909の日記
- はてなスターをユーザーアイコンにするCSS
- ブログ勝手に改造計画。 - Web Days(´ω`)
- サイドバーのプロフィールに、「ブログの説明文」とは別の文章を表示させる方法、など。
- 履歴を作ってみた。 - Web Days(´ω`)
- サイドバーに、最近の記事一覧を表示するスクリプトを設定。Chromeでは動作しているが、Operaでは動作しない。
- はてなブログ (新ブログ) にGoogle Analyticsを設定する 設定は一度でOK - A Way of Code
- はてなブログでRSSアイコンを設置する方法 - Banguardサイト
- はてなブログにFacebookのRecommendations Barを設置する - sessanの日記
ブログタイトル
文字フォント
はてなスター
CSSをすごく頑張って書いていただくしかないです。そのうちテンプレート編集できるようにしたいです。
- はてなスターにユーザーアイコンつける - hitode909の日記
- 〔ライフハック〕はてなスターを肉にしませんか? - nikuriaのブログ
- はてなスターの位置が上下にずれる - 泡沫
- スターボタンの表示を前のに戻す・アイコン表示編 - Quilt
- ユーザーアイコン表示を無効にする
コメント欄
ソーシャルメディア
秀逸なデザインのブログ事例
はてなブログでCSSを弄り倒すとここまで来るのかという例。WebKit系ブラウザ推奨。: トップ - くらげごはん。 - bit.ly/xOOZBj
記事は縦書きで書いてあってもはや料理雑誌状態→ bit.ly/HdMemO
— ぷにぷになかざんさん (@Nkzn) 3月 29, 2012
はてブロに用意されてるテーマが少ないのはきっと「JSとCSS使えるようにしてやったんだから自前でおもろいサイト作ってみろや」という運営側からのメッセージなのではないかと考えさせられる程度にはくらげごはんすごい。
kurage.hatenablog.com
— ぷにぷになかざんさん (@Nkzn) 6月 3, 2012