주 콘텐츠로 건너뛰기

모바일에서 메인, 상품목록에 추가항목 표시하기

모바일 디자인에도 PC 화면과 동일하게 추가정보 항목을 표시할 수 있어요.

자세히 알아보기

 

1. 어드민에서 상품정보의 추가정보 설정하기

  • [관리자] 쇼핑몰 설정 > 상품 설정 > 상품 정보 표시 설정에서 기본 정보 항목들 외에 사용자가 직접 항목을 추가해서 사용할 수 있어요.
  • 사용하고자 하는 항목을 추가하고 '표시함'으로 설정해 주세요.
  • 표시설정에서 항목을 추가하면 상품 등록/수정 페이지에서 추가항목을 입력할 수 있어요.

 

2. 모바일 디자인편집창에서 추가항목 변수 추가하기

  • index.html(메인), /product/list_thumb.html(상품목록) 파일을 열어 아래 부분에 파란색 코드를 추가해 주세요.
  • 반복되는 상품 영역에 동일하게 추가해 주세요.
{$custom_option숫자|display} 추가정보 표시/표시안함 설정 변수
{$custom_option숫자} 추가정보 변수

 

<div class="description">
    <strong class="name {$product_name_display|display}"><a href="{$link_product_detail}">{$product_name}</a></strong>
    <ul class="spec">
        <li class="icon">{$soldout_icon} {$stock_icon} {$new_icon} {$recommend_icon} {$product_icons} {$pickup_icon}</li>
        <li class="price {$product_price_display|display} {$product_sale_strike}">{$disp_product_price} <span class="{$product_price_ref_display|display}">{$txt_product_price_ref}</span><span id="span_product_price_text">{$product_tax_type_text}</span></li>
        <li class="price sale {$product_sale_display|display}">{$product_sale_price}</li>
        <li class="{$custom_option1|display}">용량: {$custom_option1}</li>
        <li class="{$custom_option2|display}">넓이: {$custom_option2}</li>
        <li class="cart">{$basket_icon}</li>
        <li class="color {$colorchip_display|display}">
            <div module="product_Colorchip">
                <span class="chips" style="background-color:{$color};" {$color_image}></span>
                <span class="chips" style="background-color:{$color};" {$color_image}></span>
            </div>
        </li>
        <li class="likeButton {$disp_likeprd_class}"><button type="button">{$disp_likeprd_icon}<strong>{$disp_likeprd_count}</strong></button></li>
    </ul>
</div>

 

모바일에 추가항목이 표시되는 모습

  • {$custom_option숫자}는 상품 정보 표시 설정에서 추가한 항목의 입력값으로 상품 등록/수정페이지에서 확인할 수 있어요.

 

5.jpg

이 페이지가 도움이 되었나요?
현재 콘텐츠