カテゴリー別イメージの登録 – オンラインマニュアル

ショップデザイン / 機能・設定 / 商品・カテゴリ / カテゴリー別イメージの登録

ショップのカテゴリページに登録した画像を表示することができます。

※本設定では、カテゴリー（第1階層 および その下階層）にイメージを登録することができます。
下階層カテゴリ（第2～第5階層）ごとの設定はできません。
下階層カテゴリごとの設定については、以下のサポート記事をご参照ください。

クリエイターモードで『カテゴリページ』を"カテゴリ別にデザイン"したい
https://www.support.makeshop.jp/design/?p=13053

カテゴリー別イメージの登録/修正

1登録済みのショップカテゴリをプルダウン形式で選択できます。
※カテゴリ（第1階層）別にイメージを登録することができます。
下階層カテゴリ（第2～第5階層）ごとの設定はできません。下層カテゴリには第1階層のイメージが反映されます。

2PCの中に保存されているアップロードしたい画像ファイルを選択してください。
・ファイルサイズは200KB以内で作成してください。
・GIF、JPG、PNG、Webp形式が登録可能です。
・イメージ幅の推奨値は下記をご参照ください。（高さはお好みでご設定ください）

イメージ幅の推奨値（旧デザインモード向け）

PCショップテンプレート		イメージ幅の推奨値
旧デザインモード（ベーシックモード）	【シンプルモダン】	740px
	【プレーン】	760px
	【サニーポップ】	690px
	【カスタマイズ】	736px
	【シンプル】	630px
	【fashion】	任意のサイズで設定可 ※
	【ENKEL】	任意のサイズで設定可 ※
	【WIDELY】	任意のサイズで設定可 ※

3「イメージ登録」ボタンをクリックするとPCの中の画像ファイルをアップロードします。
4「削除」ボタンをクリックすると登録済みの画像を削除することができます。違う画像を再挿入したい場合は一度削除してください。

デザインについて

クリエイターモード

下記をHTMLに記述してカテゴリ別のイメージを表示できます。

<{if $category.image_url}><img src="<{$category.image_url}>" alt="<{$category.name}>" class="category-image"><{/if}>

設定は、ショップデザイン / テンプレート選択・編集 / クリエイターモード / 商品カテゴリー　よりおこなってください。
旧デザインモード（ベーシックモード・PC）
下記の変数タグを使用してカテゴリ別のイメージを表示できます。

［CATEGORY_IMAGE］…カテゴリー別イメージを表示します。
［CATEGORY_IMAGE_URL］…カテゴリー別イメージのファイルパスを出力します。

設定は、ショップデザイン / テンプレート選択・編集 / ベーシックモード / 内部ページ編集Ⅰ / 商品分類ページ管理　よりおこなってください。
旧デザインモード（ベーシックモード・スマホ）
下記の変数タグを使用してカテゴリ別のイメージを表示できます。

<img src="<{$category.image_url}>"> …カテゴリー別イメージを表示します。

設定は、ショップデザイン / テンプレート選択・編集 / ベーシックモード / スマホデザインの設定 / 商品カテゴリ/検索結果ページ編集　よりおこなってください。旧デザインモード（ベーシックモード）をご利用の場合、スマホテンプレート初期値ではスマートフォン幅100％で表示されます。画像サイズが小さい場合は、画面中央に表示されます。