説明

この投稿は縦長の画像です。
スライダーやアイキャッチでの見せ方を制御するために、3種類の異なるトリミングの画像を作成して、設定しています。今回は分かりやすいように、スライダー画像とアイキャッチ画像に文字を載せています。

Photoshopなどを使って事前にトリミングした画像を用意してください。

1. メイン画像

2. スライダー画像(4:3)

トップページのスライダーに使われる画像です。
通常4:3で、ブラウザの幅が広いときはそれより横長の比率で表示されます。
設定していない場合、メイン画像を中央で切り抜きます。

3. アイキャッチ画像(16:9)

ページ下の「前の記事・次の記事」リンクや、「ニュース」の一覧表示に使われるサムネイル画像です。
通常16:9で表示されます。
「ニュース」ではブラウザの幅が狭いとき、サムネイルの中央を1:1に近い比率で切り取ります。おおむね画像の暗い部分が消えると考えていただければOKです。切り取られてほしくないものは、サムネイルの中央に配置してください。
設定していない場合、メイン画像を上から切り抜きます。

スライダー 表示の優先順位

スライダー画像がある → スライダー画像を使用
↓ ない
アイキャッチ画像がある → アイキャッチ画像を使用
↓ ない
メイン画像を中央で切り取って使用

アイキャッチ 表示の優先順位

アイキャッチ画像がある → アイキャッチ画像を使用
↓ ない
メイン画像を上端から切り取って使用

画像ライセンス

Dodo (Raphus cucullatus) was a flightless bird which became extinct in the late 1600s and was the first bird conclusively destroyed by humans. This illustration was done from a stuffed specimen – note the two left feet and was used by Casey Wood as the frontispiece for his An Introduction to the Literature of Vertebrate Zoology. Dodo (Raphus cucullatus)
McGill Library