びーきゅうらいふ!

 ホラー映画やアニメやゲームを好きに語る感想サイト。ネタバレ多め。

ブログのカスタマイズまとめ!~はてなブログ初心者が、皆様のお力をお借りして何とかここまで出来ました!

f:id:basiliskos:20151113002429j:plain

ども!comomoです。
ブログを初めてもうすぐ2ヶ月ということで・・・
今日はこのブログで行ってきたカスタマイズのまとめを、お力をお借りした方々の感謝の意も込めて紹介して行こうかと思います!

見出しのデザイン

いつもカスタマイズ関連で参考にさせてもらいまくっている、ゆきひーさんのブログ!本当にありがとうございます!!
「コピペ一発!」というお言葉に甘えて、上記のページからコピペした見出しのデザインを使わせて頂いております。オシャレな見出しのデザインが10種類もあるので、自分のブログにあったデザインが見つけられると思います!

CSS?何それおいしいの?状態だった自分でも、コピペしたコードをどこに入れるのか、文字のサイズや太さを変更する際はどうすればいいか・・・など、細かいところまでとても丁寧に説明して下さっているので、本当に初心者の方でも解りやすいです!

関連記事

私のブログはレスポンシブデザインではないのでPC版のみの話となってしまいますが、PC版ブログの下にはカテゴリごとの「関連記事」が表示されています。
この関連記事を表示させるブログパーツは「太陽がまぶしかったから」さんが造ってくださった「あわせて読みたいG」を使用させて頂いております!

この機能のおかげで「アニメ」や「映画」といったカテゴリが多い私のブログがぐっと読みやすくなりました!ありがとうございます!

こちらも基本コピペでOKなので導入は難しくないです!

ただし、h3(大見出し)で設定されている見出しのデザインが適用されるので、そのまま使用するとフォントサイズによっては長いカテゴリ名が2行になって表示されたりする場合がございます。
そういったレイアウトの崩れが気になる方はこちら!

こちらのサイトに、関連記事の表示部分の見出しフォントサイズを変更する方法が書いてありますので、長いカテゴリ名が多くて2行になってしまう~!とお困りの方は是非参考にしてみて下さい。

私も「はてなブログ」というカテゴリ名が2行になってしまい、自力では直せず随分悩みましたが、こちらのサイトのおかげですぐに直す事ができました!
本当に助かりました、ありがとうございました!

パンくずリスト

bulldra.hatenablog.com

パンくずリストとは、カテゴリを「親カテゴリ」と「子カテゴリ」に分けて表示させるものです。
例えば
TOP>アニメ>おそ松さん
といった具合に表示させる機能ですね!

これがあると、アニメのレビューを書いているブログや映画の専門ブログでもカテゴリを細かくわけることができます。

こちらも関連記事同様、「太陽がまぶしかったから」さんが造られたプラグインを使用させて頂いております。あわせて感謝です!

■テンプレート「Blank」をお使いの方でこちらのパンくずリストを使用している方へ

半月様のテンプレート「Blank」のテンプレートで、更に「太陽がまぶしかったから」さんのパンくずリストを使用している方。
この両方を使用している方のブログをパソコンから見ると、記事のタイトル下に表示されているパンくずリストが

「TOP」「アニメ」「おそ松さん」<<

と「<<」が全て後ろに表示されてしまっていることがあります。

半月様にもお答えして頂きましたが、
categories a の以下の項目を
display:inline-block
float :none

に変更すると
「TOP」<「アニメ」<「おそ松さん」
と表示が直りますので、もしパンくずリストが正しく表示されていない!という方は変更してみてください。

【最後に!】
こんな初心者でも何とかここまでブログをカスマイズ出来たのは皆様のおかげです!また今回紹介しきれませんでしたが、他の方にも随分と助けられております。重ね重ね、感謝致します。ありがとうございました!!

まだまだソーシャルボタンなど改良しなければやらなければならないことが多いですが、これからも少しずつ見やすいよう、使いやすいよう改良を重ねて参ります!

とりあえず記事上にもソーシャルボタンを表示できるように頑張るぞー!