フルワイド画像サンプル

WordPressテーマ『deer』でできる

LP用フルワイドな画像ブロックのサンプルページ

WordPressテーマ『deer』では、以下のショートコードを使うと、固定ページのランディングページのテンプレートで横幅一杯の画像を使うことが出来ます。

調整可能なフルワイド画像（tob4)

↓　調整可能なフルワイド画像は、以下のように記述してみてください。

[tob4 backimg="https://fanfare-co-ltd.com/deer/wp-content/uploads/2021/08/shutterstock_1511973794-1.jpg" height="600" position="top" attachment="scroll" size="cover" x="50" y="50"] ここに画像上に置くコンテンツ [/tob4]

調整可能なフルワイド画像では、

position:画像の基準位置
size:サイズ
height:高さ
attachment:動き
x,y:画像の上に載せるコンテンツの場所(x軸上の位置、y軸上の位置）

をより細く設定できるようになりました。

具体的には以下のようにショートコードの中身を設定します。

backimg=”背景画像のURL”：背景にしたい画像のURLを入れます。
position=”位置”：”位置”の中身は”top”,”center”,”bottom”で画像の基準位置を調整できます
size=”サイズ”：”サイズ”の中身は”auto”,”cover”,”contain”などで調整できます
height=”高さ”：”高さ”の中身は数値で高さを変更できます（例 “500”）※数字のみで入力してください
attachment=”動き”：”動き”は”fixed”,”scroll”のどちらかで設定してください。
x=”中身のx軸の位置”：”中身のx軸の位置”は画像の上に載せる文字などの位置を調整する数字（例”50″）1~100の間で調整してください。
y=”中身のy軸の位置”：”中身のy軸の位置”は画像の上に載せる文字などの位置を調整する数字（例”50″）1~100の間で調整してください。

上記の内容を何も設定しないと、backimg=”” position=”center” attachment=”scroll” size=”cover” height=”500″ x=”50 y=”50″で設定されます。