はてなブログをはじめるにあたって、迷ったのがテーマ
それぞれの希望はこんな感じ
- カードで一覧表示したい (ヨウ)
- オリジナル感だしたいからカスタムしやすい (ヨウ)
- 携帯で見やすい (リリ)
- サムネ表示される (リリ)
ヨウはPCでブログ管理
リリはスマホでブログ管理
はじめに使ってみたのはZENO-TEAL
旅行記が増えたら、Navbarで地域とか分けれたらいいかもと思って
カスタマイズもしやすいみたいで、デモページにサンプル書いてくださってるし、カスタマイズ例を書いてくれてる方がたくさんいるようでした。
Web系あまり詳しくないので、サンプルをいじれるほうが助かる。
はじめはこのテーマで、全体的な色を変えたりタイトル部分の高さを変えたりしたけどテーマ変更しました。
理由は、サムネ画像を選べないっぽかったから。
一覧表示のサムネ画像は記事のトップに貼らないとダメらしくて、記事の間に入れてる画像から選べるのがいいなぁと思って。
それで変更したのが絢爛(KENRAN)
現在このテーマで色々カスタマイズしつつ・・・
カスタマイズ例が少ないのではてなブログで使われてるid、クラスを調べながら無理やり設定してる感じかもしれないです。
環境によって画面崩れてる可能性もあるかも (^^;;
CSSの設定で必要だったクラスのメモ (更新すると思います)
.page-archive
記事の一覧とか。トップページと各カテゴリのページ(~/archive~) ってアーカイブページのクラス
はじめ.page-index で設定してたけど、これはアーカイブページには適用されないっぽい
/*トップページではてなスターを非表示にさせる例*/
.page-archive .social-buttons {
display: none
}
って感じで使う
以下は各カード(記事)の設定、上の例みたいに.page-archiveを前に記載してる
.entry-thumb サムネイル
.entry-title タイトル
.entry-description 内容
.categories カテゴリタグ
やってみたこと
- 全体的な色変更 (公式にサンプルコードあり)
- 一覧でスターを消す (公式にサンプルコードあり)
- 一覧でカードの高さ変更、サムネ画像の表示高さ変更
→ 崩れるかも?注視する必要あり
- 一覧で記事タイトルと内容の余白を詰める
やりたいこと
- 記事のトップに誰が書いたか自動挿入
→ わかりやすいところに誰が記事書いたか表示させたい
- タイトルとかリンクの高さ変更したいかも
- navbarの検証
まだまだ実験中・・・
はてなブログ、共同管理可だし著者一覧の表示とかあるけど、プロフィールに2アカウント表示できないのかな?各自のプロフィールはとりあえずHTMLでID表示しました。
あとはどちらが書いた記事かを明確にしたいなぁと思っていますー