【はてなブログ】スマホ用ページで横スクロール出来るカテゴリ一覧を作ってみました
スポンサード リンク
だいぶ前に、はてなブログのスマホページ用のカテゴリ一覧を作りました。
↑こんなやつ
これが結構好評だったようで、設置しているブログをちょくちょく見かけます。
自分が作ったものを他の方が使っているのを見ると嬉しくなります^^
使ってくださっている方々に感謝です^^
今回は少し違ったデザインのスマホページ用カテゴリ一覧を作成してみました。
↑こんな感じです。
横スクロール出来るので、カテゴリ数が多くなってもコンパクトに設置することが出来ます。
設置方法
HTML
「カテゴリ○のURL」「カテゴリ○の画像URL」「カテゴリ○」の部分をご自分のものに変更して、スマホページの設置したい場所（フッタ等）に貼り付ければOK。
画像に関して
縦横比1：1のものを使用してください。
↑画像URLの取得方法は「はてなフォトライフ」を使用している場合は、使用したい画像をアップロードした後に画像ページに行き、画像を右クリック「画像アドレスをコピー」で取得可能です。
その後、上のHTMLコードの「カテゴリ○の画像URL」部分に貼り付ければ完了です。
↑この部分を追加、もしくは削除することで、カテゴリ数を増やしたり減らしたりすることができます。
CSS
これは先程のHTMLコードの真上に貼り付ければOK。
「width」「font-size」の数値や文字色等はお好みで変更してください。
