カラモモ日記。

徒然なるままに。ブログの方向性は未定。

はてなブログProにしたので、いろいろカスタマイズ

f:id:kyobate24:20150721222054j:plain

はてなブログProにして2週間。テーマを変更したり、アドセンスの位置はどこがいいのか、ちょこちょこ動かしてみたり。未だにデザインが落ち着いておりません。


そんな中、私がはてなブログをカスタマイズする上で、主に参考にさせていただいているブログです。


先ずは、池田仮名さんのブログです。はてな初心者には助かります。ありがとうございます。

JavaScriptなんて全く分からない私。参考にさせていただいているどころか、そのまんまコピペしてます。

  • 「B!」はてブボタンを設置
  • 「合わせて読みたいG」を設置
  • パンくずリストを設定
  • スマホ版の追尾ヘッダーを消す

特に、パンくずリストはフッタにJavaScriptを入れなくてはならず、無料版では設定できませんでした。今回Proにしたことで、ようやく設置できました。

パンくずリストを設置する前
f:id:kyobate24:20150731160540j:plain
年月で表示されているのは、カスタムURLを設定するときに、entry/以下を「YYYY/MM/カスタムURL」としているためです。こうしておけば、いつ頃書いた記事か、後々分かりやすくなるかなと思ってます。

設置後
f:id:kyobate24:20150731160606j:plain

きちんとカテゴリーで認識されています。


あと、池田仮名さんのブログ、空腹時、夜中は注意が必要な場合があります。うまそう……。



もう一人、ゆきひーさんのブログです。

ゆきひーさんのブログでは、SNSボタンを設置する際に参考にさせていただいたんですが、今回は背景を線で囲むCSSを参考にさせていただきました。ありがとうございます。

オリジナルからちょっと変更し、背景色を付けて、こんな感じで使っています。
f:id:kyobate24:20150731161617j:plain

.bg-solid {
    border: 2px solid #DCDCDC;
    background: #F3F3F3;
    padding: 20px;
    margin: 5px;
    border-radius: 5px;
}

CSSにこう追加すると、上の画像のような薄いグレーの囲いができます。

今日、カスタマイズの記事が増えてました。モジュールタイトルに下線をつけるのも参考にしました。



こんな風にして、私のブログのデザインは成り立っております。はてなの先人の方々、ありがとうございます。