【クリエイターモード】「ショップでの表示場所」を指定した商品にアイコンを表示させることはできますか。 – makeshop よくある質問

たとえば『「ショップでの表示場所」が「新商品」に指定されている商品には、Newというアイコンを表示させる』というように、「ショップでの表示場所」を条件にしてアイコンを表示させることはできません。
「ショップでの表示場所」を判定する機能および変数タグがありません。

代替策として考えられる方法は以下です。

「新商品」「おすすめ商品」というカテゴリーを作成し、そのカテゴリーに商品を所属させ、「基本カテゴリー」に指定することで
「その商品の基本カテゴリーが〇〇なら」という条件でアイコンを表示させることができます。

＜記述例＞
「新商品」というカテゴリーを作成し、カテゴリIDを「newitem」としたとき

「その商品の基本カテゴリーのカテゴリIDがnewitemなら、カテゴリーページの商品リスト内で該当の商品にNEW！と表示する」
という条件文を作り、

ショップデザイン / テンプレート選択・編集 / クリエイターモード / 商品カテゴリー
HTML欄の商品リストのループ文の中に、以下のようにソース（HTML）を記述してください。

<{if $category.item.list[i].base_category.code == 'newitem'}>
  <p class="icon-design">NEW！</p>
<{/if}>

こちらで該当する商品にのみ「NEW！」と表示されます。

「原産地」「商品別特殊表示」「製造元」など、商品情報の項目に同じテキストを入力して、その内容を判定してアイコンを表示させることができます。

※入力項目の名称と用途が異なる場合、決めたルールを忘れないように注意してください。

＜記述例１＞
「原産地」に「newitem」と記述した商品には、カテゴリーページの商品リスト内で「NEW！」と表示させたい場合

<{if $category.item.list[i].origin_country == 'newitem'}>
  <p class="icon-design">NEW！</p>
<{/if}>

＜記述例２＞
「商品別特殊表示」に「newitem」と記述した商品には、カテゴリーページの商品リスト内で「NEW！」と表示させたい場合

<{if $category.item.list[i].special_display == 'newitem'}>
  <p class="icon-design">NEW！</p>
<{/if}>

こちらで該当する商品にのみ「NEW！」と表示されます。

＜表示例＞

背景色や角丸でアイコンを装飾したい場合は、CSSを追記してデザインしてください。

＜CSS例＞

.icon-design {
  background-color: #f00;
  color: #fff;
  width: 60px;
  text-align: center;
  border-radius: 6px;
  font-size: 13px;
}

関連記事