정가 취소선, 할인가격 표시 방법
정상가격에 취소선을 넣고, 그 아래 할인가를 표시하면
이용자들의 구매욕을 자극하는 마케팅을 할 수 있습니다.
취소선을 사용하지 않은 쇼핑몰 화면입니다.
이제 소비자가에 취소선을 넣어보도록 할게요.
1. 카페24 어드민으로 접속합니다.
1) 상품관리 > 상품표시관리 > 상품정보표시 설정에 들어갑니다.
2) 소비자가와 판매가의 표시설정을 "표시함"으로 선택합니다.
-002.gif)
3) 소비자가 취소선 사용여부 항목에서 "사용함" 에 체크하고 확인 버튼을 눌러, 저장합니다.
2. 모듈을 사용하지 않는 사용자일 경우
1) 스마트디자인 편집창으로 메인화면 html파일을 엽니다.
아래와 같이 판매가격에 custom 클래스가 없을 경우, custom 클래스를 추가해줍니다.
<div class="prdList">
<ul>
<li>
<a href="/product/detail.html{$params}" class="prdImg"><img src="{$image_medium}" alt="" /></a>
<span class="zoom"><img src="" onclick="{$zoom_action}" alt="확대보기" /></span>
<span class="icon">{$soldout_icon}{$recommend_icon}{$product_icons}</span>
<strong class="custom">{$price_unit_head}{$product_custom}{$price_unit_tail}</strong>
<strong class="price">{$price_unit_head}{$product_price|numberformat}{$price_unit_tail}</strong>
</li>
<li>
<a href="/product/detail.html{$params}" class="prdImg"><img src="{$image_medium}" alt="" /></a>
<span class="zoom"><img src="" onclick="{$zoom_action}" alt="확대보기" /></span>
<span class="icon">{$soldout_icon}{$recommend_icon}{$product_icons}</span>
<strong class="custom">{$price_unit_head}{$product_custom}{$price_unit_tail}</strong>
<strong class="price">{$price_unit_head}{$product_price|numberformat}{$price_unit_tail}</strong>
</li>
</ul>
</div>
2) css > 모듈(module) > 상품(product) >listmain_1.css ~ listmain_7.css
파일을 열어 아래와 같이 파란색 코드를 추가해주세요.
.xans-product-1 .prdList .price { display:block; margin-top:5px; }
.xans-product-1 .prdList .custom { text-decoration:line-through; font-weight:normal; }
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
소비자 가격에 취소선이 표시되었습니다.
