TOPTOP

고객센터

상담부터 운영까지 모든 것을 쉽고, 빠르게 도와드립니다.

업데이트 안내

후이즈몰 내에서 사용 가능한 쿠폰 리스트를 확인하실 수 있습니다.

[템플릿수정] 쿠폰 기능 추가로 인한 디자인 수정(모바일)
임대형 기능업데이트
등록일 2017-08-08

안녕하세요.
후이즈몰입니다.


 


쿠폰 기능 추가로 인하여 아래와 같이 디자인 수정을 안내드리오니 참고해 주시기 바랍니다.


 


설명  : 기존에는 주문 쿠폰만 제공하였으나, 기능 업데이트 후 상품쿠폰, 주문쿠폰으로 나눠집니다.
상품쿠폰의 경우 상품 상세페이지에서 노출이 되며, 해당 노출에 대한 디자인 수정입니다.


 


* 템플릿에 따라 소스 내용이나 Line이 다를 수 있습니다.


 


1. 모바일샵 > 디자인 편집 > 스타일시트 관리


 


->  1547 Line 추가


 


====================추가 내용==================


 


/* 쿠폰 다운로드 */
.coupon_download_wrap {clear: both; width:100%;}
.coupon_down_title {padding:8px 10px; width:100%; border:1px solid #cfcfcf; box-sizing:border-box; background: linear-gradient(to bottom, #8b919f, #767b8a); font-size:12px; color:#fff;}
.coupon_download_wrap>ul {padding:15px 0 15px 6px; width:100%; text-align:center;}
.coupon_download_wrap>ul>li {margin:0 auto 20px; width:168px}
.coupon_download_wrap>ul>li>a {display:block; margin:10px 0 0; width:100%; height:23px; box-sizing:border-box; font-weight:bold; font-size:11px; line-height:23px; color:#fff;}
.coupon_download_wrap>ul>li>a.btn_coupondown {border:1px solid #851313; background:#bb0a0f;}
.coupon_download_wrap>ul>li>a.btn_coupondown:after {content:''; display:inline-block; margin:0 0 -1px 7px; width:11px; height:10px; background:url('/skin/m_modern/images/shop/icon_download.png') no-repeat left center;}
.coupon_download_wrap>ul>li>a.btn_coupondown_off {border:1px solid #525151; background:#636365;}
.coupon_download_wrap ul ul {padding:3px 3px 3px 35px; width:100%; height:68px; box-sizing:border-box;}
.coupon_download_wrap .coupon_style1 ul {background:url('/data/images/default/coupon/coupon_green.gif') no-repeat 0 0;}
.coupon_download_wrap .coupon_style2 ul {background:url('/data/images/default/coupon/coupon_skyblue.gif') no-repeat 0 0;}
.coupon_download_wrap .coupon_style3 ul {background:url('/data/images/default/coupon/coupon_orange.gif') no-repeat 0 0;}
.coupon_download_wrap .coupon_style4 ul {background:url('/data/images/default/coupon/coupon_gray.gif') no-repeat 0 0;}
.coupon_download_wrap ul ul li {display:inline-block; width:100%; font-weight:bold; font-size:11px; line-height:1; font-family:Malgun Gothic, '맑은 고딕', sans-serif; color:#383838;}
.coupon_download_wrap ul ul .coupon_discount {margin-top:-2px; font-size:16px; line-height:1;}
.coupon_download_wrap ul ul .coupon_discount strong {font-weight:bold; font-size:24px;}
.coupon_download_wrap ul ul .coupon_info {color:#828282;}


 


===============================================


 


-> 1862 Line 수정


 


====================수정 전====================


 


.order_coupon_discount{border: 2px solid #98a1af; width: 100%; height: auto; padding: 5px 10px;margin-top: 8px;}


 


====================수정 후====================


 


/* 쿠폰선택 */
/*.order_coupon_discount{border: 2px solid #98a1af; width: 100%; height: auto; padding: 5px 10px;margin-top: 8px;}*/
.order_coupon_discount{width: 100%; height: auto; padding: 5px 0; margin-top: 8px;}
.order_coupon_discount h4{margin-bottom:10px; padding:0 10px; width:100%; box-sizing:border-box; background:#98a1af; line-height:30px; color:#fff;}
.coupon_discount_view_inner {padding:0 10px 10px;}
.order_discount_coupon {padding:7px 0 0;}
.order_coupon_table {margin-bottom:10px; width:100%; border-top: 1px solid #999;}
.order_coupon_table tr {border-bottom: 1px solid #ddd;}
.order_coupon_table th {padding:8px; font-weight:normal;}
.order_coupon_table td {padding:8px; text-align:right;}
.order_coupon_table tr:first-child th, .order_coupon_table tr:first-child td {background:#edeff1}
.order_coupon_table select {min-width:150px; height:30px;}
.order_discount_coupon select {width:100%; height:30px;}
.coupon_discount_price {border-top:1px solid #555; width:100%;}
.coupon_discount_price li {padding:8px; border-bottom:1px solid #ccd0d7;}
.coupon_discount_price li:last-child {background:#edeff1; font-weight:bold;}
.coupon_discount_price span {float:right;}


 


.btn_openmenu{background:url('/skin/m_modern/images/button/button_up.png') no-repeat; width:14px; height:8px; border:0; cursor:pointer; overflow:visible; border:0; float: right; margin-top: 10px;}
.btn_closemenu{background:url('/skin/m_modern/images/button/button_down.png') no-repeat; width:14px; height:8px; border:0; cursor:pointer; overflow:visible; border:0; float: right; margin-top: 10px;}


 


===============================================


 


- >1907 Line 추가


 


====================추가 내용==================


 


.order_good_coupon_tb{margin-top: 5px;}
.order_good_coupon_tb th{height: 30px; background-color: #D6DCE5; text-align: center; border-top: 1px solid #98a1af; border-bottom: 1px solid #98a1af;}
.order_good_coupon_tb td{border-bottom: 1px solid #ccd0d7;padding:6px 0px;}


.order_coupon_sub_title {height:30px; background-color: #edeff1; text-align: left; border: 1px solid #98a1af; padding:4px 0 0 10px; margin:0px 0px;}


 


===============================================


 


2. 모바일샵 > 디자인 편집 > 마이페이지 화면 > 모바일 쿠폰내역 리스트


 


-> 30 Line 추가


 


====================추가 내용==================


 


<li>쿠폰구분 : {.coupon_buy_type}</li>


 


===============================================


 


-> 51 Line 수정


 


====================수정 전====================


 


{@DOWNLOAD_LIST}
<tr>
 <td style="text-align:center;padding:10px;">
  <img src="{.coupon_file_path}" border="0" onerror="Durian.imgDefault(this, '{goodp_list_img_default}');" ><br />
  <button id="download_btn_{.coupon_seq}" class="btn btn-default btn-md" >쿠폰 받기</button>
 </td>
</tr>
{/}


 


====================수정 후====================


 


<div class="coupon_download_wrap">
 <ul>
  {@DOWNLOAD_LIST}
  <li>
   <ul style="background:url('{.coupon_file_path}') no-repeat 0 0;">
    {?.coupon_file_type == 0 && .coupon_file_seq > 1}
    <li class="coupon_kinds">{.coupon_name}</li>
    <li class="coupon_discount"><strong>{.coupon_discount}</strong>{.coupon_discount_type}</li>
    <li class="coupon_info">{.coupon_buy_min_text}</li>
    {/}
   </ul>
   <a href="#" id="download_btn_{.coupon_seq}" class="btn_coupondown">쿠폰받기</a>
  </li>
  {/}
 </ul>
</div>


 


===============================================


 


-> 101 Line 수정


 


====================수정 전====================


 


jQuery("button[id^='download_btn_']").on('click', function() {
 var tmp = this.id.split('_');
 var coupon_seq = tmp[2];
 if (coupon_seq > 0) {
  goCouponDown(coupon_seq);
 }
});


 


====================수정 후====================


 


jQuery("[id^='download_btn_']").on('click', function() {
 var tmp = this.id.split('_');
 var coupon_seq = tmp[2];
 if (coupon_seq > 0) {
  goCouponDown(coupon_seq);
 }
 return false;
});


 


===============================================


 


3. 모바일샵 > 디자인 편집 > 주문/배송 화면 > 모바일 주문 결제하기


 


-> 102 Line 수정


 


====================수정 전====================


 


<p>※ 주문당 {?couponp_use_limit}여러매(최대{couponp_use_max}매){:}1매만{/} 사용 가능 <span class="red right_c">주문금액: {pay_total_price_text}</span></p> 
<table width="100%" border="0" cellspacing="0" cellpadding="0"  class="order_coupon_tb">
 <colgroup>
  <col width="15%">
  <col width="55%">
  <col width="30%">
 </colgroup>
 <thead>
  <tr>
   <th scope="col">선택</th>
   <th scope="col">쿠폰명</th>
   <th scope="col" style="border-right:0px;">할인금액</th>
  </tr>
  {@COUPON_LIST}
  <tr>
  <!-- No -->
  <td align="center">
   {?couponp_use_limit=='1'}
    <input type="checkbox" name="list_coupon_data_seq_{.coupon_data_seq}" id="list_coupon_data_seq_{.coupon_data_seq}" value="{.coupon_data_seq}" discount="{.coupon_discount} {.coupon_discount_type}" discount_max="{.coupon_discount_max}" amount="{.coupon_amount}"/>
   {:}
    <input type="radio" name="list_coupon_data_seq" id="list_coupon_data_seq_{.coupon_data_seq}" value="{.coupon_data_seq}" discount="{.coupon_discount} {.coupon_discount_type}" discount_max="{.coupon_discount_max}" amount="{.coupon_amount}"/>
   {/}
   </td>
   <!-- 쿠폰명 -->
   <td align="left" style="padding-left:6px;"><label for="list_coupon_data_seq_{.coupon_data_seq}">{.coupon_name}
   {?.coupon_data_code}({.coupon_data_code}){/}</label>
   </td>
   <!-- 할인액 -->
   <td align="center">
    <label for="list_coupon_data_seq_{.coupon_data_seq}">{.coupon_amount_text}</label>
   </td>
  </tr>
  {:}
  <tr>
   <td colspan="3" height="40">해당 쿠폰이 없습니다.</td>
  </tr>
  {/}
 </thead>
</table>


 


====================수정 후====================


 


<!-- 상품쿠폰 -->
{?couponp_type_use != '1'}
<h4>상품 쿠폰<span><button class="btn_closemenu"></button></span></h4>
<div class="coupon_discount_view_inner" style="display:;">
 {LOOP LIST_CART}
 {@LIST_SUB}
  <table class="order_coupon_table" width="100%" border="0" cellspacing="0" cellpadding="0">
   <colgroup>
    <col width="40%">
    <col width="*">
   </colgroup>
   <tbody>
    <tr>
     <th scope="row" colspan=2>{? .good_name_mobile}{.good_name_mobile}{:}{.good_name}{/}</th>
    </tr>
    <tr>
     <th scope="row">상품금액({.cart_count}개){?.good_dlv_type==5||.good_dlv_type==6}({.good_dlv_value}{.good_dlv_unit}){/}</th>
     <td>{.good_buy_price_total_text}</td>
    </tr>
    <tr>
     <th scope="row">상품쿠폰</th>
     <td>
      <select name="good_coupon[{.good_seq}]" id="good_coupon{.good_seq}" good_seq="{.good_seq}">
       <option value="" coupon_discount="0">쿠폰 선택</option>
      {@GOOD_COUPON_LIST}
       <option value="{.coupon_data_seq}" coupon_discount="{.coupon_select_price}">{.coupon_name}</option>
       {/}
      </select>
     </td>
    </tr>
   </tbody>
  </table>
 {/}
 {END}
</div>
{/}
<!-- //할인내역 -->
<!-- // 상품쿠폰 -->
{?couponp_type_use != '2'}
<h4>주문 쿠폰</h4>
<div class="coupon_discount_view_inner">
 <p>※ 주문당 {?couponp_use_limit}여러매(최대{couponp_use_max}매){:}1매만{/} 사용 가능 <span class="red right_c">주문금액: {buy_total_price_discount_text}</span></p> 
 <table width="100%" border="0" cellspacing="0" cellpadding="0"  class="order_coupon_tb">
  <colgroup>
   <col width="15%">
   <col width="55%">
   <col width="30%">
  </colgroup>
  <thead>
   <tr>
    <th scope="col">선택</th>
    <th scope="col">쿠폰명</th>
    <th scope="col" style="border-right:0px;">할인금액</th>
   </tr>
  </thead>
  <tbody id="buy_coupon_list">
  </tbody>
 </table>
</div>
{/}


<!-- 할인내역 -->
<ul class="coupon_discount_price">
 <li>총 상품 할인<span id="total_good_coupon_discount">0원</span></li>
 <li>총 주문 할인<span id="total_buy_coupon_discount">0원</span></li>
 <li>총 쿠폰 할인<span id="total_coupon_discount">0원</span></li>
</ul>
<!-- //할인내역 -->


 


===============================================



4. 모바일샵 > 디자인 편집 > 상품관련 화면 > 모바일 상품 상세보기


 


-> 415 Line 추가


 


====================추가 내용==================


 


<!-- 쿠폰다운로드 -->
{?product_coupon_down_count && couponp_type_use != '1'}
<div class="coupon_download_wrap">
 <h3 class="coupon_down_title"> 쿠폰다운로드</h3>
  <ul>
  {@LIST_PRODUCT_COUPON_DOWN}
  <li>
   <ul style="background:url('{.coupon_file_path}') no-repeat 0 0;">
   {?.coupon_file_type == 0 && .coupon_file_seq > 1}
    <li class="coupon_kinds">{.coupon_name}</li>
    <li class="coupon_discount"><strong>{.coupon_discount}</strong>{.coupon_discount_type}</li>
    <li class="coupon_info">{.coupon_buy_min_text}</li>
   {/}
   </ul>
   <a href="#" onclick="goCouponDown('{.coupon_seq}');return false;" class="btn_coupondown">쿠폰받기</a>
  </li>
  {/}
 </ul>
</div>
{/}
<!-- // 쿠폰다운로드 -->


 


===============================================

SOS 긴급 상담 서비스

"24시간 상시 대기!"

주말 전용 문의 접수

주말에도 빠르게~ 30분 내로 연락드리겠습니다.

문의 접수가 완료되었습니다!

신청고객 순서 대로 순차적으로 상담드릴 예정이며
30분내로 빠르게 연락드리겠습니다.

* 운영시간 : 주말 및 공휴일 오전 10시 ~ 오후 5시

개인정보 제 3자 제공 동의 확인

넥스트솔루션 쇼핑몰을 이용하시는 고객께서는
반드시 개인정보 제 3자 제공에 동의해 주셔야 서비스를 이용하실 수 있습니다.

저희 넥스트솔루션 쇼핑몰은 아래와 같은 이용 목적을 위한 정보를 수집하고, 보관하며
개인정보처리방침을 준수합니다.

[개인정보의 수집 및 이용 목적]
1. 서비스 제공에 관한 계약이행 및 서비스제공에 따른 요금정산
2. 회원관리
3. 서비스 안내 등 마케팅 및 광고

개인정보 제3자 제공
제공받는 자 제공목적 제공정보 개인정보의 보유 및 이용기간
(주)넥스트솔루션 서비스제공 및 회원관리
불만처리 및 민원처리 외 고객의 전화상담
등 고객상담 업무 일체
이름(영문포함), 로그인 ID, e-mail 주소, 전화번호, 주소 회원탈퇴시 혹은 위탁계약 종료시까지