Help Center

카페24 소식

[모바일쇼핑몰] 전자보증 서비스 개선 안내

2014-02-13


안녕하세요, 카페24 운영도우미 입니다.

매매보호(구매안전) 서비스 중 하나인 ‘전자보증’ 서비스가 개선되어 안내 드립니다.

자세한 내용은 아래를 참조해 주세요.



■ 적용일자 : 2014-02-13 (목)

■ 업데이트 내용


1. 전자보증서비스 사용설정
PC쇼핑몰 상점관리 내 전자보증 사용설정으로 모바일 쇼핑몰에도 동시 적용이 됩니다.

- 설정위치: 쇼핑몰어드민 > 상점관리 > 결제방식 > 결제방식설정 '매매보호서비스 사용설정'





2. 주문관리 전체목록 검색영역 결제수단에 포함

 

주문관리 전체리스트에서 검색조건 상세보기 중 '결제수단>전자보증' 을 통해 전자보증 주문내역만 검색이 가능하며,
리스트에서는 '전자보증 아이콘' 을 통해 확인 할 수 있습니다.


▼ 검색조건



▼ 주문 리스트




3. 쇼핑몰 적용화면

▼ 주문서페이지



▼ 주문완료 페이지


- 전자보증보험 증권번호를 클릭하시면 보험계약 체결내역을 확인 할 수 있습니다.

▼ 주문완료 페이지


- 주문상세페이지에서도 발급된 전자보증보험 정보를 확인할 수 있습니다.



4. 디자인가이드

- 사용하고 계신 다지인이 최신디자인이 아닐경우 최신소스로 적용 후 작업해주세요.


※ 디자인 자동 업그레이드가 탑재된 원터치 주문서를 사용하는 몰은 디자인 가이드를 적용하지 않아도 됩니다.

※ 원터치 주문서에 대한 안내는 및 전환하는 방법은 [원터치 주문서 안내] 와 [원터치 주문서 적용 방법] 을 참고해 주세요.


1) 전자보증보험 발급페이지 주문완료페이지 (/order/agreement/insurance.htm)
- 기존소스 전체를 아래 내용으로 변경해주세요.

<!--@layout(/layout/basic/layout.html)-->
<div module="Order_form">
    <!--@css(/css/module/order/form.css)-->
    <div class="titleArea">
        <h2>전자보증보험 발급</h2>
    </div>
    <div class="insuranceHelp">
        <h3>전자보증보험 안내</h3>
        <p>쇼핑몰에서의 상품대금 결제 시점에 구매자에게 보험증서를 발급하여 인터넷 쇼핑몰 사고로 인한 구매자의 금전적 피해를 100% 보상하는 서비스입니다.</p>
        <ul>
            <li><strong>* 전자보증 서비스</strong>
                <p>'전자상거래 등에서의 소비자 보호에 관한 법률'에 근거한 전자보증서비스는 서울보증보험(주)이 쇼핑몰에서의 상품대금 결제 시점에 구매자에게 보험증서를 발급하여 인터넷 쇼핑몰 사고로 인한 구매자의 금전적 피해를 100% 보상하는 서비스입니다.</p>
            </li>
            <li><strong>* 전자보증 서비스</strong>
                <ul>
                    <li>- 상품 미배송</li>
                    <li>- 환불거부(환불사유 시)</li>
                    <li>- 반품거부(반품사유 시)</li>
                    <li>- 쇼핑몰 부도</li>
                </ul>
            </li>
            <li><strong>* 전자보증 서비스</strong>
                <p>- 주문일로부터 37일간(37일 보증)</p>
            </li>
        </ul>
    </div>
    <div class="btnArea type1">
        <button type="button" class="submit" onclick="{$action_insurance_agree}">닫기</button>
    </div>
</div>


2) 주문서페이지 (/order/orderform.html)
- 아래와 같이 변경 후 내용으로 소스를 수정해주세요.

[변경 전]
<!-- 전자보증보험 -->

<li class="{$eguarantee_display|display}">
    <p>{$form.insurance_agreement_chk}<label for="insurance">전자보증보험 발급</label></p>
    <button type="button" class="btnNormal" onclick="viewInsurance();">내용보기</button>
</li>

[변경 후]
<!-- 전자보증보험 -->
<li id="{$insurance_agreement_chk}" class="insurance {$eguarantee_display|display}">
    <p>{$form.insurance_agreement_chk}<label for="insurance">전자보증보험 발급</label></p>
    <button type="button" class="btnNormal" onclick="viewInsurance();">자세히보기</button>
    <div class="insuranceDetail">
        <ul>
            <li><strong>생년월일</strong> {$form.eguarantee_year} 년 {$form.eguarantee_month} 월 {$form.eguarantee_day} 일</li>
            <li><strong>성별</strong> {$form.eguarantee_user_gender}</li>
            <li><strong>개인정보 이용동의</strong> {$form.eguarantee_personal_agreement}</li>
        </ul>
        <p>
            <strong>전자보증보험 안내 (100% 매매보호 안전결제)</strong><br />
            물품대금결제시 구매자의 피해보호를 위해 '(주)서울보증보험'의 보증보험증권이 발급됩니다.<br />
            증권이 발급되는 것의 의미는, 물품대금 결제시에 소비자에게 서울보증보험의 쇼핑몰보증보험 계약체결서를 인터넷상으로 자동 발급하여, 피해발생시 쇼핑몰보증보험으로써 완벽하게 보호받을 수 있습니다. 또한, 입력하신 개인정보는 증권발급을 위해 필요한 정보이며 다른 용도로 사용되지 않습니다.
            전자보증보험 발생시 별도의 수수료가 부과되지 않습니다.
        </p>
    </div>
</li>



3) 주문완료 페이지 (/order/order_result.html)
- 아래와 같이 변경 후 내용으로 소스를 수정해주세요.

[변경 전]
<tr class="{$eguarantee_display|display}">
    <th scope="row">전자보증보험<br />서비스 정보</th>
    <td>전자보증보험 증권번호 : {$eguarantee_number}</strong>
</tr>
<tr class="{$naver_mileage_display|display}">
    <th scope="row">네이버마일리지<br />& 캐쉬</th>
 
[변경 후]
<tr class="{$eguarantee_display|display}">
     <th scope="row">전자보증보험<br />서비스 정보</th>
     <td>{$eguarantee_detail}</td>
</tr>
<tr class="{$naver_mileage_display|display}">
    <th scope="row">네이버마일리지<br />& 캐쉬</th>


4) 마이쇼핑> 주문상세 페이지 (/myshop/order/detail.html)
- 아래와 같이 변경 후 내용으로 소스를 수정해주세요.

[변경 전]
<tr>
    <th scope="row">결제금액 및<br />내역</th>
    <td>{$payment.price} <span class="{$payment.price_ref_display|display}">{$payment.price_ref}</span><br /> {$payment.paymethod_detail}</td>
</tr>
 
[변경 후]
<tr>
    <th scope="row">결제금액 및<br />내역</th>
    <td>{$payment.price} <span class="{$payment.price_ref_display|display}">{$payment.price_ref}</span><br /> {$payment.paymethod_detail}</td>
</tr>
 
<tr class="{$payment.eguarantee_display|display}">
    <th scope="row">전자보증보험<br />서비스 정보</th>
    <td>{$payment.eguarantee_detail}</td>
</tr>


5) CSS파일 (/css/module/order/form.css)
- 아래와 같이 변경 후 내용으로 소스를 수정해주세요.

[변경 전 1]
.xans-order-form .agreement { margin:10px 0; font-size:11px; background:rgb(245,245,246); }
.xans-order-form .agreement li { overflow:hidden; padding:5px; border-bottom:1px solid #d7d7d7; }
.xans-order-form .agreement li:first-child { border-top:1px solid #d7d7d7; }
.xans-order-form .agreement p { float:left; }
.xans-order-form .agreement button { float:right; }
 
[변경 후 1]
.xans-order-form .agreement { margin:10px 0; font-size:11px; background:rgb(245,245,246); }
.xans-order-form .agreement > li { overflow:hidden; padding:5px; border-bottom:1px solid #d7d7d7; }
.xans-order-form .agreement > li:first-child { border-top:1px solid #d7d7d7; }
.xans-order-form .agreement > li > p { float:left; }
.xans-order-form .agreement button { float:right; }
.xans-order-form .agreement > li.insurance { position:relative; }
.xans-order-form .agreement > li.insurance p { float:none; }
.xans-order-form .agreement > li.insurance button { position:absolute; right:5px; top:5px; float:none; }
.xans-order-form .agreement .insuranceDetail { display:none; margin:5px 0 0; padding:5px; border:1px solid #d7d7d7; background:#fff; }
.xans-order-form .agreement .insuranceDetail ul { margin:0 0 5px; border-bottom:1px solid #d7d7d7; }
.xans-order-form .agreement .insuranceDetail li { margin:0 0 5px; }
.xans-order-form .agreement .insuranceDetail li strong { display:inline-block; width:100px; font-weight:normal; }
 
[변경 전 2]
.insuranceArea { font-size:11px; }
.insuranceArea .insurance { margin:20px 0 0; border:1px solid #d7d7d7; }
.insuranceArea .insurance h3 { padding:5px 10px; border-bottom:1px solid #d7d7d7; font-size:12px; background:rgb(245,245,246); }
.insuranceArea .insurance > p,
.insuranceArea .insurance > ul { padding:10px; }
.insuranceArea .insurance > ul > li { margin:3px 0 0; }
 
[변경 후 2]
.insuranceHelp { margin:10px 0 0; border:1px solid #d7d7d7; font-size:11px; }
.insuranceHelp h3 { padding:5px 10px; border-bottom:1px solid #d7d7d7; font-size:12px; background:rgb(245,245,246); }
.insuranceHelp > p,
.insuranceHelp > ul { padding:10px; }
.insuranceHelp > ul > li { margin:3px 0 0; }




카페24 는 쇼핑몰 운영을 보다 편리하고 쉽게 할 수 있도록 기능 업데이트를 지속적으로 진행하고 있습니다.
더 좋은 서비스가 되기 위해 노력하겠습니다. 끊임없는 애정과 관심 부탁 드립니다.

궁금하신 사항은 언제든지 고객지원센터 1:1게시판으로 문의해주세요. [문의하기]