Cafe24新着情報

[商品管理] ダイレクト購入注文書のデザインを適用する方法 - HTML(韓国語)

2019-06-26


平素よりCafe24 Developersをご利用いただき、誠にありがとうございます。


ダイレクト購入注文書のデザインを適用する方法について以下のようにご案内します。


■ デザイン適用について


※2019年6月28日以降に作成した基本デザインの場合、ダイレクト購入注文書が自動で適用されるため、別途のデザイン適用が必要ありません。

※2019年6月28日以前に適用したデザインは以下の適用方法をご確認ください。


[HTMLの修正方法を見る - 日本語]

[HTMLの修正方法を見る - 韓国語]



詳細は以下の内容をご確認ください。

---------------------------------------------------------------------------------


■ Mobileデザイン - スマートデザイン(Mobile注文書)


1) 位置 : 注文(order) > 注文書作成(orderform.html)


▼ 以下のように青色で表示されている内容を追加します。

##上部内容省略##

    <div id="mCafe24Order" module="Order_FormGlobal" unroll="1">
        <!-- Do not delete this code
            $move_order_after=/order/order_result.html
            $move_basket=/order/basket.html
            $paymethod_selector=textButton
        -->

        <!--@import(/order/ec_orderform/product_detail.html)-->

        <!--@import(/order/ec_orderform/billingNshipping.html)-->

##下部内容省略##



2) 位置 : 商品(product) > product_detail_info.html(新規でデザインファイルを追加)


▼ 新規ファイルを作成して、以下のように青色で表示されている内容を追加します。

<!--@layout(/layout/basic/popup.html)-->
<div class="ec-base-layer productDetailInfo">
    <!--@css(/css/module/product/productDetailInfo.css)-->
    <style>.productDetailInfo img { max-width:100%; }</style>
    <div module="product_detail">
        <h1>상세정보</h1>
        <div class="content">
            <div module="product_additional">
                <div id="prdDetail">
                    <h2 class="title">{$name}</h2>
                    <div id="prdDetailContent">{$product_detail}</div>
                </div>
            </div>
        </div>
        <button type="button" class="btnClose" onclick="window.close()">닫기</button>
    </div>
</div>



3) 位置 : js > モジュール(module) > 商品(product) > image.js

▼ 以下のようにimage.jsファイルがあるかを確認します。
※ image.jsファイルはモバイルの基本デザインに含まれていますが、時間が経ったデザインんや購入したデザインには無い場合があります。




ショップデザインにimage.jsファイルがない場合は、
▼ 新規ファイルを追加で作成し、青色で表示されている内容を追加します。(/js/module/product/image.js)

 /**
 *  zoom
 */
$(document).ready(function(){
    $.fn.prdZoom = function(param){
        var ul     = param.target.find('.xans-product-addimage > ul'),
            detail = param.target.find('a#prdDetailImg'),
            swipe  = param.target.find('.xans-product-mobileimage > ul > li'),
            add    = param.target.find('.xans-product-addimage > ul > li');
        var zoom = {
            init : function(){
                function structMobile(){
                    swipe.unbind().bind('click', function(){
                        var sZoomUrl = '/product/image_zoom.html' + $(this).data('param') + '&order=' + $(this).index();
                        zoom.showZoom(sZoomUrl);
                    });
                    add.mouseover(function(){
                        try {
                            $xans_product_mobileimage_slider_0.moveTab($(this).index());
                        } catch (e) { }
                        detail.data('order', $(this).index());
                    });
                    detail.unbind().bind('click', function(){
                        var iOrder =  $(this).data('order') || 0,
                            sZoomUrl = '/product/image_zoom.html' + $(this).data('param') + '&order=' + iOrder;
                        zoom.showZoom(sZoomUrl);
                    });
                }
                structMobile();
            },
            showZoom : function(sZoomUrl){
                window.open(sZoomUrl, 'image_zoom', 'toolbar=no,scrollbars=auto,resizable=yes,width=560,height=710,left=0,top=0', this);
                return false;
            }
        }
        zoom.init();
    };
    $.fn.prdZoom({
        target : $('.xans-product-image')
    });
});




---------------------------------------------------------------------------------

Cafe24では、より快適なネットショップ運営のため、持続的に機能アップデートを実施しております。

引き続き、ご愛顧のほどよろしくお願い申し上げます。

ご不便・ご不明な点等ございましたら、092-517-9981または「お問い合わせ」まで、お気軽にお問い合わせください。