【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。
以上。