モチモノ手帖。

持っているものをひとつずつ記録しています。台湾雑貨とマスキングテープが好き。

スポンサーリンク

ちょこっとブログカスタマイズ♪-パンくずリストとモバイルからの記事一覧の見た目

f:id:blue_sky_blue-fuermosha:20150628130218j:plain

パンくずリストでカテゴリーを断層化

「今このサイトのどの部分にいるのか」を分かりやすくリスト表示したもの。

 

なんでパンくずって呼び方なんだろう?と思っていたら、童話が由来なんですね♪ 

「パンくずリスト」という名前は、童話『ヘンゼルとグレーテル』で、主人公が森で迷子にならないように通り道にパンくずを置いていった、というエピソードに由来する。

 

引用元: パンくずリスト - Wikipedia

 

こちらのブログのスマホ表示だと、記事タイトル下のこんな感じで表示されている部分です。

f:id:blue_sky_blue-fuermosha:20150628131647j:plain

 

雑な画像ですみません。。

スクリーンショットに手書きが精いっぱいでした(;´∀`)

 

ブログ記事が増えるにしたがい、あれもこれもとカテゴリーを設定していたら、いつの間にか増えすぎてしまっていました。

 

パンくずリストを設定してみると、すっきりと整理できて、気になっていたゴチャゴチャ感が解消されました!

SEO的にも、内部構造を整理することで検索エンジンからの評価が良くなるらしいですね。

 

実は2ヶ月前くらいからずっとやりたいと思っていながらも…

はてなブログで設定している方のブログ記事を参考にしても、なかなか理解できなくて先延ばしにしていました!(゚Д゚;)

 

分からなかったのは、htmlを貼りつけたあとのカテゴリー整理です。

 

「TOP」→「親カテゴリー」→「子カテゴリー」

という順番で表示されるというのは理解できていましたが、具体的にカテゴリーにどう変更を加えたらいいのか分からなくて諦めかけていました。

 

そして検索していくうちに出会って参考にさせて頂いたのがこちらの記事。

qusuriya.hatenablog.com

まず、「親カテゴリー」を決めてから、それに関連する「子カテゴリー」を設定していきますが、「親カテゴリー子カテゴリー」と間にハイフンを入れるんですね!

 

そしてカテゴリーを選ぶときに、

「親カテゴリー」と、「親カテゴリー子カテゴリー」を選択すると無事できました!! 

 

129記事あったので、時間がかかるかな~と思いましたが、ある程度カテゴリーの名前を変更し直したあと、はてなブログのiPhoneアプリからポチポチ設定しなおすとスムーズに変更できました。

 

カテゴリーを選ぶのもラクになったので、嬉しいカスタマイズですね(*´ω`*) 

 

はてなブログモバイルの記事一覧ページにカラーをつける

f:id:blue_sky_blue-fuermosha:20150628131715j:plain

黒と白のシンプルすぎる表示からオレンジのカラーに変更しています。

なかなかお気に入りです(*^^*)

 

こちらの記事を参考にしました。

www.kokoro-fire.com

以前から取り入れさせてもらっています♪

記事内にもうひとつ別のカスタマイズ方法が紹介されていたので、同時に必要のない部分も表示させないようにすることができてすっきり。

 

ほかに自動的に目次がつくように設定(JAVAスクリプト)していますが、参考にさせて頂いた記事を忘れてしまいました(^^;

 

はてなブログを始める前は、 Wordpress(ワードプレス)を使ってブログを書こうと考えていたこともありましたが、初心者には厳しそうだったのでいったん保留にしました。

 

大手のブログサービス、特にはてなブログはカスタマイズ記事などを書いていらっしゃるブロガーさんが多いので、コピペで使わせてもらえてとても助かっています!

ありがとうございます。

 

私もカスタマイズの仕組みを少しずつ理解したくて、kindleでセール中だったのでワードプレスの本を1冊購入してみました。

どんどんバージョンが上がっていくので分からなくなりそうだけど、、ぼちぼち勉強します!

できる100ワザ WordPress 必ず集客できる実践・サイト運営術 WordPress 4.x対応 (できる100ワザシリーズ)

できる100ワザ WordPress 必ず集客できる実践・サイト運営術 WordPress 4.x対応 (できる100ワザシリーズ)