본문 바로가기

현재 위치
  1. HOME
  2. 자주 묻는 질문
  3. 쇼핑몰 생성

쇼핑몰 관리자

자주 묻는 질문을 통해 궁금증을 해결하세요!

카테고리 상세
번호 문의유형 제목
1917 모바일 메인, 기획전, 상품 검색, 상품분류 (썸네일형) 페이지에 적립금 항목을 노출하고 싶어요. 조회수 3534
  • 작성일 19.02.12 16:44:30
  • 추천 4 추천하기
  • 조회수 3534
 해당 페이지에 디자인 소스를 추가해야 합니다. 자세한 사항은 아래 내용을 참고해주세요.

공통 추가 사항


  1. 쇼핑몰 관리자 '모바일쇼핑몰'로 이동하여 '디자인 수정' 버튼을 클릭합니다.

  2. 스마트디자인 편집창의 왼쪽 하단 검색창에 'ec-base-product.css'를 검색해 해당 페이지를 불러옵니다.

  3. 아래 파란색 소스 추가 후 상단의 '저장' 버튼을 클릭합니다.

.ec-base-product .description { min-height:10px; margin:0 7px; line-height:1em; text-align:left; }
.ec-base-product .description .name { line-height:1.3em; word-wrap:break-word; margin:0 0 7px; }
.ec-base-product .description .name a { font-size:13px; color:#1b1b1b; }
.ec-base-product .description .icon { margin:0 0 7px; }
.ec-base-product .description .icon img { margin:0 4px 0 0; }
.ec-base-product .description .icon .icon_img { margin:0 0 2px; }
.ec-base-product .description .price { font-size:12px; margin:0 0 7px; }
.ec-base-product .description .strike,
.ec-base-product .description .mPriceStrike { text-decoration:line-through; }
.ec-base-product .description .mileage { display:inline-block; }
.ec-base-product .description li.cart { margin:0 0 7px; }
.ec-base-product .description .color { overflow:hidden; margin:0; }
.ec-base-product .description .color .chips { float:left; width:12px; height:10px; margin:0 2px 2px 0; font-size:0; line-height:0; border:1px solid #e3e3e3; }
.ec-base-product .description .likeButton button { border:0; background:none; }
.ec-base-product .description .likeButton button strong { margin:0 0 0 3px; font-size:11px; line-height:20px; color:#757575; }
.ec-base-product .description .likeButton.selected button strong { line-height:20px; color:#2e2e2e; }




메인 페이지에 적립금 노출하기


  1. 쇼핑몰 관리자 '모바일쇼핑몰'로 이동하여 '디자인 수정'버튼을 클릭합니다.

  2. 스마트디자인 편집창의 왼쪽 하단 검색창에 'index.html'을 검색해 해당 페이지를 불러옵니다.

  3. 아래 파란색 소스 추가 후 상단의 '저장' 버튼을 클릭합니다.

    ※'product_listmain_숫자' 묶음마다 소스를 추가해야 합니다.

       예시) product_listmain_1~4'번까지 있다면 각각 2곳에 소스를 추가해 총 8곳에 소스를 추가합니다.

                   <div class="ec-base-product typeThumb" module="product_listmain_1">
<!-- $count = 5 ※ 노출시킬 상품의 갯수를 숫자로 설정할 수 있으며, 설정하지 않을경우, 최대 200개로 자동제한됩니다. ※ 상품 노출갯수가 많으면 쇼핑몰에 부하가 발생할 수 있습니다. $moreview = yes $cache = yes --> <h2>{$category_title_text}</h2> <ul class="prdList grid3"> <li> <div class="thumbnail"> <a href="{$link_product_detail}"><img src="{$image_medium}" id="{$image_medium_id}" alt="{$seo_alt_tag}"><span module="product_Imagestyle"><span class="prdIcon {$icon_class_name}" style="background-image:url('{$icon_url}');"></span></span></a> <span class="wish">{$list_wish_icon}</span> </div> <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} r{$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="mileage {$mileage_icon_display}">{$mileage_value}</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> </li> <li> <div class="thumbnail"> <a href="{$link_product_detail}"><img src="{$image_medium}" id="{$image_medium_id}" alt="{$seo_alt_tag}"><span module="product_Imagestyle"><span class="prdIcon {$icon_class_name}" style="background-image:url('{$icon_url}');"></span></span></a> <span class="wish">{$list_wish_icon}</span> </div> <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="mileage {$mileage_icon_display}">{$mileage_value}</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> </li> </ul> </div> <div module="product_listmore_2" class="paginate typeMoreview"> <a href="#none" onclick="{$more_action}"> 더보기(<span id="more_current_page_{$display_group}">{$current_page}</span>/<span id="more_total_page_{$display_group}">{$total_page}</span>) <span class="icoMore"></span> </a> </div>




기획전 페이지에 적립금 노출하기


  1. 쇼핑몰 관리자 '모바일쇼핑몰'로 이동하여 '디자인 수정'버튼을 클릭합니다.

  2. 스마트디자인 편집창의 왼쪽 하단 검색창에 'project.html'을 검색해 해당 페이지를 불러옵니다.

  3. 아래 파란색 소스 추가 후 상단의 '저장' 버튼을 클릭합니다.

                    <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} {$recommend_icon} {$new_icon} {$product_icons} {$pickup_icon} {$benefit_icons}</li>
                            <li class="price {$product_price_display|display} {$product_sale_strike}">{$disp_product_price}<span id="span_product_tax_type_text">{$product_tax_type_text}</span></li>
                            <li class="price sale {$product_sale_display|display}">{$product_sale_price}</li>
                            <li class="mileage {$mileage_icon_display}">{$mileage_value}</li>
                            <li class="cart">{$basket_icon}</li>
                            <li class="summary {$summary_desc|display}">{$summary_desc}</li>
                            <li class="color {$colorchip_display|display}">
                                <div module="project_Colorchip">
                                    <span class="chips" style="background-color:{$color};"></span>
                                    <span class="chips" style="background-color:{$color};"></span>
                                </div>
                            </li>
 ##중간 생략##
                    <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} {$recommend_icon} {$new_icon} {$product_icons} {$pickup_icon} {$benefit_icons}</li>
                            <li class="price {$product_price_display|display} {$product_sale_strike}">{$disp_product_price}<span id="span_product_tax_type_text">{$product_tax_type_text}</span></li>
                            <li class="price sale {$product_sale_display|display}">{$product_sale_price}</li>
                            <li class="mileage {$mileage_icon_display}">{$mileage_value}</li>
                            <li class="cart">{$basket_icon}</li>
                            <li class="summary {$summary_desc|display}">{$summary_desc}</li>
                            <li class="color {$colorchip_display|display}">
                                <div module="project_Colorchip">
                                    <span class="chips" style="background-color:{$color};"></span>
                                    <span class="chips" style="background-color:{$color};"></span>
                                </div>
                            </li>




상품 검색 페이지에 적립금 노출하기


  1. 쇼핑몰 관리자 '모바일쇼핑몰'로 이동하여 '디자인 수정' 버튼을 클릭합니다.

  2. 스마트디자인 편집창의 왼쪽 하단 검색창에 'product/search.html'을 검색해 해당 페이지를 불러옵니다.

  3. 아래 파란색 소스 추가 후 상단의 '저장' 버튼을 클릭합니다.

            <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} {$recommend_icon} {$new_icon} {$product_icons} {$pickup_icon}</li>
                   <li class="price {$product_price_display|display} {$product_sale_strike}">{$disp_product_price}</li><span id="span_product_tax_type_text">{$product_tax_type_text}</span>
                    <li class="price sale {$product_sale_visible}">{$product_sale_price}</li>
                    <li class="mileage {$mileage_icon_display}">{$mileage_value}</li>
                    <li class="cart">{$basket_icon}</li>
                    <li class="summary {$summary_desc|display}">{$summary_desc}</li>
                    <li class="price {$product_promotion_display|display}">
                        <div class="discountPeriod {$product_promotion_display|display}">
                            <a href="#none" class="btnNormal">할인기간</a>
##중간 생략##
            <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} {$recommend_icon} {$new_icon} {$product_icons} {$pickup_icon}</li>
                    <li class="price {$product_price_display|display} {$product_sale_strike}">{$disp_product_price}</li><span id="span_product_tax_type_text">{$product_tax_type_text}</span>
                    <li class="price sale {$product_sale_visible}">{$product_sale_price}</li>
                    <li class="mileage {$mileage_icon_display}">{$mileage_value}</li>
                    <li class="cart">{$basket_icon}</li>
                    <li class="summary {$summary_desc|display}">{$summary_desc}</li>
                    <li class="price {$product_promotion_display|display}">
                        <div class="discountPeriod {$product_promotion_display|display}">
                            <a href="#none" class="btnNormal">할인기간</a>




상품 분류(썸네일형) 페이지에 적립금 노출하기


  1. 쇼핑몰 관리자 '모바일쇼핑몰'로 이동해 '디자인 수정' 버튼을 클릭합니다.

  2. 왼쪽 하단 검색창에 'product/list.html'을 검색해 해당 페이지를 불러옵니다.

  3. 아래 파란색 소스 추가 후 상단의 '저장' 버튼을 클릭합니다.

          <div module="product_listrecommend" class="ec-base-product">
    <!--@css(/css/module/product/listrecommend_swipe.css)-->
    <!--
        $count = 8
            ※ 노출시킬 상품의 갯수를 숫자로 설정할 수 있으며, 설정하지 않을경우, 최대 200개로 자동제한됩니다.
            ※ 상품 노출갯수가 많으면 쇼핑몰에 부하가 발생할 수 있습니다.
        $line = 1
        $grid = 2
        $swipe = yes
    -->
    <h2>추천 상품</h2>
    <ul class="prdList grid2">
        <li id="anchorBoxId_{$product_no}">
            <div class="thumbnail">
                <a href="{$link_product_detail}"><img src="{$image_medium}" alt="{$seo_alt_tag}"><span module="product_Imagestyle"><span class="prdIcon {$icon_class_name}" style="background-image:url('{$icon_url}');"></span></span></a>
                <span class="wish">{$list_wish_icon}</span>
            </div>
            <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} {$recommend_icon} {$new_icon} {$product_icons} {$pickup_icon} {$benefit_icons}</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></li>
                    <li class="price sale {$product_sale_display|display}">{$product_sale_price}</li>
                    <li class="mileage {$mileage_icon_display}">{$mileage_value}</li>
                    <li class="cart">{$basket_icon}</li>
                    <li class="likeButton {$disp_likeprd_class}"><button type="button">{$disp_likeprd_icon}<strong>{$disp_likeprd_count}</strong></button></li>
                </ul>
            </div>
        </li>
        <li id="anchorBoxId_{$product_no}">
            <div class="thumbnail">
                <a href="{$link_product_detail}"><img src="{$image_medium}" alt="{$seo_alt_tag}"><span module="product_Imagestyle"><span class="prdIcon {$icon_class_name}" style="background-image:url('{$icon_url}');"></span></span></a>
                <span class="wish">{$list_wish_icon}</span>
            </div>
            <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} {$recommend_icon} {$new_icon} {$product_icons} {$pickup_icon} {$benefit_icons}</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></li>
                    <li class="price sale {$product_sale_display|display}">{$product_sale_price}</li>
                    <li class="mileage {$mileage_icon_display}">{$mileage_value}</li>
                    <li class="cart">{$basket_icon}</li>
                    <li class="likeButton {$disp_likeprd_class}"><button type="button">{$disp_likeprd_icon}<strong>{$disp_likeprd_count}</strong></button></li>
                </ul> 
            </div>
        </li>
    </ul>

##중간생략##

<div class="ec-base-product typeDesc" module="product_listnormal">
    <!--@js(/js/module/product/listnormal.js)-->
    <!--
        $count = 10
            ※ 노출시킬 상품의 갯수를 숫자로 설정할 수 있습니다.
            ※ 상품 노출갯수가 많으면 쇼핑몰에 부하가 발생할 수 있습니다.
        $moreview = yes
        $cache = yes
        $basket_result = /product/add_basket.html
        $basket_option = /product/basket_option.html
    -->
    <ul class="prdList">
        <li>
            <div class="thumbnail">
                <a href="{$link_product_detail}"><img src="{$image_medium}" id="{$image_medium_id}" alt="{$seo_alt_tag}"><span module="product_Imagestyle"><span class="prdIcon {$icon_class_name}" style="background-image:url('{$icon_url}');"></span></span></a>
                <span class="wish">{$list_wish_icon}</span>
            </div>
            <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} {$recommend_icon} {$new_icon} {$product_icons} {$mileage_icon} {$pickup_icon} {$benefit_icons}</li>
                    <li class="price {$product_sale_strike}">{$disp_product_price}<span class="{$product_price_ref_display|display}">{$txt_product_price_ref}</span></li>
                    <li class="price sale {$product_sale_display|display}">{$product_sale_price}</li>
                    <li class="mileage {$mileage_icon_display}">{$mileage_value}</li>
                    <li class="cart">{$basket_icon}</li>
                    <li class="summary {$summary_desc|display}">{$summary_desc}</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>

##중간 생략##

            <div class="thumbnail">
                <a href="{$link_product_detail}"><img src="{$image_medium}" id="{$image_medium_id}" alt="{$seo_alt_tag}"><span module="product_Imagestyle"><span class="prdIcon {$icon_class_name}" style="background-image:url('{$icon_url}');"></span></span></a>
                <span class="wish">{$list_wish_icon}</span>
            </div>
            <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} {$recommend_icon} {$new_icon} {$product_icons} {$pickup_icon} {$benefit_icons}</li>
                    <li class="price {$product_sale_strike}">{$disp_product_price}<span class="{$product_price_ref_display|display}">{$txt_product_price_ref}</span></li>
                    <li class="price sale {$product_sale_display|display}">{$product_sale_price}</li>
                                        <li class="mileage {$mileage_icon_display}">{$mileage_value}</li>
                    <li class="cart">{$basket_icon}</li>
                    <li class="summary {$summary_desc|display}">{$summary_desc}</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>


  4. 왼쪽 하단 검색창에 'list_thumb.html'을 검색해 해당 페이지를 불러옵니다.

  5. 아래 파란색 소스 추가 후 상단의 '저장' 버튼을 클릭합니다.

            <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} {$recommend_icon} {$new_icon} {$product_icons} {$pickup_icon} {$benefit_icons}</li>
                    <li class="price {$product_sale_strike}">{$disp_product_price}<span class="{$product_price_ref_display|display}">{$txt_product_price_ref}</span></li>
                    <li><span id="span_product_tax_type_text">{$product_tax_type_text}</span></li>
                    <li class="price sale {$product_sale_display|display}">{$product_sale_price}</li>
                    <li class="mileage {$mileage_icon_display}">{$mileage_value}</li>
                    <li class="cart">{$basket_icon}</li>
                    <li class="summary {$summary_desc|display}">{$summary_desc}</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>
##중간 생략##
            <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} {$recommend_icon} {$new_icon} {$product_icons} {$pickup_icon} {$benefit_icons}</li>
                    <li class="price {$product_sale_strike}">{$disp_product_price}<span class="{$product_price_ref_display|display}">{$txt_product_price_ref}</span></li>
                    <li><span id="span_product_tax_type_text">{$product_tax_type_text}</span></li>
                    <li class="price sale {$product_sale_display|display}">{$product_sale_price}</li>
                    <li class="mileage {$mileage_icon_display}">{$mileage_value}</li>
                    <li class="cart">{$basket_icon}</li>
                    <li class="summary {$summary_desc|display}">{$summary_desc}</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>





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

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