추가구성상품의 옵션 선택에 [필수]가 있어서
구매자들이 반드시 선택해야 하는 것 처럼 보여요.
추가구성상품은 본 상품 외 다른 상품의 구매를 유도하는 기능입니다.
그러나 추가구성상품영역이 항상 열려있고
옵션 선택의 필수/선택 여부가눈에 띄어 구매자들이 오인할 수 있는데요.
이 경우 아래와 같은 방법으로 예방해보세요.
1. 추가구성상품 영역 접기
추가구성상품 영역을 접힌 상태로 제공하고,
필요시에만 열어서 구매할 수 있도록 합니다.
스마트디자인 편집창에서 아래 소스를 추가해주세요.
1. 상품상세 (/product/detail.html) 최하단에 아래 소스 삽입
| <!--@js(/js/module/product/add_product_script.js)--> |
2. 신규 js 파일 추가 후 아래 소스 삽입
- 위치 : /js/module/product/add_product_script.js
$(window).load(function() {
var oToggleAddProduct = $('.xans-product-addproduct .toggle, .xans-product-addproduct .title');
if (oToggleAddProduct.length > 0) {
oToggleAddProduct.click();
}
}); |
2. 추가구성상품의 [필수]/[선택] 문구 삭제
추가구성상품 옵션의 [필수]/[선택] 문구를 제거하여
혼란을 줄일 수 있습니다.
스마트디자인 편집창에서 아래 소스를 추가해주세요.
1. 상품상세 (/product/detail.html) 최하단에 아래 소스 삽입
| <!--@js(/js/module/product/add_product_script.js)--> |
2. 신규 js 파일 추가 후 아래 소스 삽입
- 위치 : /js/module/product/add_product_script.js
$(window).load(function() {
removeAddProductOptionText();
$('select[product_type="addproduct_option"]').change(function() {
removeAddProductOptionText();
});
$('.xans-product-addproduct .xans-product-option p.value').each(function() {
$(this).html(($(this).html().replace(/\[필수\] |\[선택\] /, '')));
});
});
function removeAddProductOptionText() {
$('select[name^="addproduct_option_name"] > option[value="*"]').each(function() {
$(this).text($(this).text().replace(/\[필수\] |\[선택\] /, ''));
});
} |
3. 추가구성상품의 영역도 접고, [필수]/[선택] 문구도 삭제
스마트디자인 편집창에서 아래 소스를 추가해주세요.
1. 상품상세 (/product/detail.html) 최하단에 아래 소스 삽입
| <!--@js(/js/module/product/add_product_script.js)--> |
2. 신규 js 파일 추가 후 아래 소스 삽입
- 위치 : /js/module/product/add_product_script.js
$(window).load(function() {
var oToggleAddProduct = $('.xans-product-addproduct .toggle, .xans-product-addproduct .title');
if (oToggleAddProduct.length > 0) {
oToggleAddProduct.click();
}
removeAddProductOptionText();
$('select[product_type="addproduct_option"]').change(function() {
removeAddProductOptionText();
});
$('.xans-product-addproduct .xans-product-option p.value').each(function() {
$(this).html(($(this).html().replace(/\[필수\] |\[선택\] /, '')));
});
});
function removeAddProductOptionText() {
$('select[name^="addproduct_option_name"] > option[value="*"]').each(function() {
$(this).text($(this).text().replace(/\[필수\] |\[선택\] /, ''));
});
} |
▼ 이렇게 적용하시면 됩니다.
