【はてなブログカスタマイズ】最新記事・注目/関連記事のサムネイル画像表示方法
はじめに
サムネイル画像(はてなブログではアイキャッチ画像とも言いますね)をサイドバーに表示させることで、ただ記事名が記載しているだけよりも、サイドバーの記事に注目させてもらいやすくなる。
しかし、はてなブログのデフォルト設定では、サムネイル画像は表示されず、サイドバーの設定は以下のようになっている。
これを、サムネイルを表示させた以下のような状態にする方法を紹介する。
※今回は、最新記事にサムネイル画像を表示させる方法を紹介するが、注目記事・関連記事にサムネイル画像を表示させる方法もほぼ同じ。
設定方法
①はてなブログ管理画面より『デザイン設定』を押す。
②開いた以下画面より、サイドバーを押す。
③サイドバーの画面で『最新記事』を押す
※注目記事・関連記事の設定を変更する場合は、ここでそれぞれ
『注目記事』・『関連記事』を選択する。
④開いた画面で『サムネイル画像を表示する』にチェックを入れ、適用。
⑤変更を保存したら、完了だ。
※関連記事、人気記事にもサムネイル画像を表示させたい場合は、
それぞれで同じ設定を行う。
以上で、最新記事・関連記事・人気記事にサムネイル画像が表示されます。
【Seesaaブログカスタマイズ】サムネイル画像を全体表示に変更する方法
はじめに
Seesaaブログを利用していて、サムネイル画像が一部しか表示されず、
困ったのでサムネイル画像を全体表示に修正する方法を記載する。
目次
- 適用可能なスタイルシート
- 修正方法
- 修正する箇所
- 修正結果
適用可能なスタイルシート
今回記載する方法でサムネイル画像を全体表示に変更できるのは、
以下のテンプレートを利用している場合。
- シンプルA~D
- Agent (Map)
- Time Line Green
修正方法
以下のコードを、Seesaaブログのスタイルシートに貼り付ける。
※コピーしてご使用ください
.recent-entry__thumbnail img {
max-width: 100%;
height: auto;
}
.recent-entry__thumnail img {
max-width: 100%;
height: auto;
}
修正する箇所
修正する箇所は、スタイルシート(いわゆるCSSを記載しているシート)の末尾だ。
スタイルシートは、以下の手順で開く。
①ブログ投稿画面でデザイン>デザイン設定を押す。
②デザイン設定画面で、編集する対象のテンプレートを押す。
※以下の画面は、名前だけ{編集}をつけて変更した『シンプルA』のテンプレート
③スタイルシート編集画面の末尾に、先ほど紹介したコード(赤枠で囲ったもの)を
貼り付ける。
④『保存』を押して終了。
修正結果
サムネイル画像が以下のように修正される。
※うまくいかない場合は、初期値に戻してから、再度、今回紹介したコードを
貼り付けてみてください。
初期値の戻し方は、スタイルシート編集画面で、
『初期値に戻す』>『バックアップして保存』を押せばOK。
以上。
2016年9月のアフィリエイト日記。はじめはしたものの、当然収入なし
記念すべき初めての投稿は先月の収入と活動記録。
【収入】
0円。
【活動記録】
・6サイト開設。
一つはそこそこアクセスが集まったが、ある日Google様に圏外にぶっとばされた。何が悪かったのはいまだに不明。
原因究明よりも今はサイト数・記事数を増やすことに注力したい。
・15記事ほどのサイトを作成したがAmazonの審査に落ちた。
作成してから日が浅すぎた・記事が少なすぎたのが原因か?Amazonが使えないと販売できる物が限られるので、これは今後審査合格したら考察・情報公開していきたい。
【9月まとめ】
開始直後のため、サイトからの収入がないのは仕方ないが、覚えること・調べるが多く、作業効率が悪い。時短のため、一つくらい商材買うのもありかもしれない。
商材を購入するとともに、まずは少しでも稼げるよう、サイトを増やしていくことを今後の目標にする。
【10月の活動予定】
今回からはじめたこのブログ、いまはただの備忘録だけど、
長く継続して今後役立つようにしたい。