주메뉴 바로가기 본문 바로가기

쇼핑몰 창업&운영에 꼭 필요한 혜택

자주 묻는 질문

궁금하신 사항을 FAQ를 통해 해결해드립니다.

퍼스트몰 라이브 쇼핑

[퍼스트몰 라이브 쇼핑] 라이브쇼핑 오픈 베타 스킨패치는 어떻게 하나요?

  • 퍼스트몰
  • 일반몰, 입점몰 본사

퍼스트몰 라이브쇼핑 오픈 베타서비스 이용을 위해서는 스킨패치필수로 진행해주셔야 합니다.
(단, 21년 1월 28일 이후 업데이트 된 최신 스킨을 다운로드 한 경우, 별도 스킨 패치를 진행하지 않으셔도 됩니다.)

스킨 패치를 진행하기 전 먼저 현재 사용중인 스킨 종류를 반드시 확인 하신 후 진행하시기 바랍니다.
패치 진행은 FTP 전용 프로그램 (파일질라 등) 을 사용하셔서 진행해 주시면 됩니다.
FTP 접속 계정 정보는 MY퍼스트몰 에서 확인 가능합니다. FTP 접속 정보 확인 방법 >

STEP 1. 현재 사용중인 스킨을 확인해주세요.
- 전용스킨(PC), 전용스킨(Mobile), 반응형스킨 여부 확인 후 STEP 2 진행

STEP 2. 현재 사용중인 스킨에 해당하는 최신 패치 파일을 다운로드 하세요.
- 전용스킨 (PC) 패치 파일 다운로드
- 전용스킨 (Mobile) 패치 파일 다운로드
- 반응형스킨 패치 파일 다운로드

STEP 3. 다운로드 받은 파일에는 신규 추가된 파일이 있습니다.  압축 해제 후 사용중인 스킨 폴더에 업로드해주세요.
수정 파일은 아래 내용을 참고하여 해당 위치에 소스를 직접 입력 후 저장하세요.

수정 파일 수정 방법
관리자 > 디자인환경 > html 소스 에디터 메뉴 또는 FTP 프로그램으로 접속하신 후
아래 변경이 필요한 파일 경로로 접속하신 후, 해당 코드를 수정해 주세요.
변경된 코드는 주황색으로 표기되어 있습니다.

① 전용스킨 (PC)

  • 파일 경로 : [스킨폴더]/css/style.css
        @charset "utf-8";
        @import url('//fonts.googleapis.com/earlyaccess/nanumgothic.css');
        @import url('../css/jqueryui/black-tie/jquery-ui-1.8.16.custom.css');
        @import url('../css/common.css');
        @import url('../css/layout.css');
        @import url('../css/contents.css');
        @import url('../css/board.css');
        @import url('../css/buttons.css');
        @import url('../css/broadcast.css');
        @import url('../css/user.css');
  • 파일 경로: [스킨폴더]/_modules/common/html_header.html (약 123 줄 부터)
        <link rel="stylesheet" type="text/css" href="/data/font/font.css" />
        <link rel="stylesheet" type="text/css" href="../../css/style.css" /
        <link rel="stylesheet" href="/app/javascript/plugin/touchSlider/swiper.css" />    
        <link rel="stylesheet" type="text/css" href="/app/javascript/plugin/slick/slick.css">        
        <!--{ ? ISADMIN || writeditorjs }-->
        <link rel="stylesheet" type="text/css" href="/app/javascript/plugin/editor/css/editor.css" />
        <!--{ / }-->
        <!--{ ? config_system.favicon }-->
        <!-- 파비콘 -->
        {? _SERVER.HTTPS == 'on'}
        <link rel="shortcut icon" href="https://{_SERVER.HTTP_HOST}/{config_system.favicon}" />
        {:}
        <link rel="shortcut icon" href="//{_SERVER.HTTP_HOST}/{config_system.favicon}" />
        {/}
        <!--{ / }-->
        <!-- /CSS -->
        <!-- 자바스크립트 -->
        <script type="text/javascript" src="/app/javascript/jquery/jquery.min.js"></script>
        <script type="text/javascript" src="/app/javascript/jquery/jquery-ui.min.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/jquery.poshytip.min.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/jquery.activity-indicator-1.0.0.min.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/jquery.cookie.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/jquery.slides.min.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/jquery.bxslider.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/slick/slick.min.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/jquery.placeholder.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/custom-select-box.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/jquery.sprintf.js"></script>
        
  • 파일 경로: [스킨폴더]/goods/view.html (약 435 줄 부터)
        <!-- 상품 스펙 -->
        <table width="100%" cellpadding="0" cellspacing="0" border="0">
            <tr>
                <td valign="top">
                    <table width="100%" cellpadding="0" cellspacing="0" align="center" >
                    <tr>
                        <td>
                            <div id="goods_thumbs">
                                <!--{? images && count(images) > 1 }-->
                                <div class="slide-wrap">
                                    <div class="slides_wrap">
                                    <!--{@ images }--><div class="main_tabs_contents slide {? .index_ == 0}active{/}" id="slide{.index_}" style="text-align:center;">
                                    <a href="javascript:;" style="margin:auto;display:inline-block;width:100%;">
                                    {? .view.image_type == 'video'}
                                    <iframe  width="{goods.video_size_mobile0}" height="{goods.video_size_mobile1}" src="{.view.image}" frameborder="0" allowfullscreen  ></iframe>
                                    {:}
                                    <img src="{.view.image}" width="100%" onerror="this.src='../images/common/noimage.gif'" title="{images[1].large.label}" {? goods_view_image_alt}alt="{goods_view_image_alt}"{/}/>
                                    {/}
                                    </a>
                                    </div><!--{/}-->
                                    </div>
                                </div>
                                <div class="relative"><div id="goods_thumbs_paging" idx="0"></div></div>
                                <!--{:}-->
                                <a href="javascript:;">
                                {? images[1].view.image_type == 'video'}
                                    <iframe  width="{goods.video_size_mobile0}" height="{goods.video_size_mobile1}" src="{images[1].view.image}" frameborder="0" allowfullscreen  ></iframe>
                                {:}
                                    <img src="{images[1].view.image}" width="100%" onerror="this.src='../images/common/noimage.gif'" title="{images[1].large.label}" {? goods_view_image_alt}alt="{goods_view_image_alt}"{/}/>
                                {/}
                                </a>
                                <!--{/}-->
                            </div>
                        </td>
                    </tr>
                    </table>
                    <!-- //상품 이미지 -->
                </td>
            </tr>
            <!-- 퍼스트몰 라이브 알림 -->
            <!--{? braodcastData }-->
            <tr>
                <td>
                    <div class="cast_notice">
                        <!--{ ? braodcastData.status == 'live'}-->
                        <img class="status" src="../images/broadcast/i_live.png" alt="방송 중">
                        <p class="notice_text">{braodcastData.start_date} 현재 방송 중</p>
                        <a class="btn_live" href="/broadcast/player?no={braodcastData.bs_seq}" target="_blank"><img src="../images/broadcast/btn_live_go.png" alt="시청하기"></a>
                        <!--{ : }-->
                        <img class="status" src="../images/broadcast/reserve_live.png" alt="방송 예정 LIVE">
                        <a class="notice_text" href="/broadcast/player?no={braodcastData.bs_seq}" target="_blank">{braodcastData.start_date} 라이브 쇼핑으로 만나보세요.</a>
                        <!--{ / }-->
                    </div>
                </td>
            </tr>
            <!--{ / }-->
            <!-- //퍼스트몰 라이브 알림 -->
            {? eventEnd}
            <tr>
                <td class="hide">
                    <table class="event_datetime" width="100%" border="0" cellpadding="0" cellspacing="0">
                    <col /><col /><col width="120" />
                    <tr>
                        <td align="left" class="fx15 pdl10">
                            <strong class="black">{=number_format(goods.event.event_order_ea)}개</strong> 구매 중
                        </td>
                        <td align="right">
                            남은시간
                        </td>
                        <td>
                            <div class="event_datetime_box">
                            <span id="soloday{goods.goods_seq}"></span><span class="fx13 notbold">일</span> <span id="solohour{goods.goods_seq}"></span> : <span id="solomin{goods.goods_seq}"></span> : <span id="solosecond{goods.goods_seq}"></span>
                            </div>
                        </td>
                    </tr>
                    </table>
                </td>
            </tr>
            <!-- //타임세일 -->
            {/}
        

② 전용스킨 (Mobile)

  • 파일 경로 : [스킨폴더]/css/style.css
        @charset "utf-8";
        @import url('//fonts.googleapis.com/earlyaccess/nanumgothic.css');
        @import url('../css/jqueryui/black-tie/jquery-ui-1.8.16.custom.css');
        @import url('../css/common.css');
        @import url('../css/board.css');
        @import url('../css/buttons.css');
        @import url('../css/mobile_pagination.css');
        @import url('../css/quick_design.css');
        @import url('../css/broadcast.css');
        @import url('../css/user.css');
  • 파일 경로: [스킨폴더]/_modules/common/html_header.html (약 142 줄 부터)
        <link rel="stylesheet" href="/app/javascript/plugin/touchSlider/swiper.css" />
        <link rel="stylesheet" type="text/css" href="/app/javascript/plugin/slick/slick.css">
        <!--{ ? config_system.androidicon || config_system.iphoneicon }-->
        <!-- 바로가기아이콘 -->
        <link rel="apple-touch-icon" href="http{? _SERVER.HTTPS=='on'}s{/}://{_SERVER.HTTP_HOST}{=config_system.iphoneicon}" />
        <link rel="shortcut icon" href="http{? _SERVER.HTTPS=='on'}s{/}://{_SERVER.HTTP_HOST}{=config_system.androidicon}" />
        <!--{ / }-->
        <!-- /CSS -->
        <!-- 자바스크립트 -->
        <script type="text/javascript" src="/app/javascript/jquery/jquery.min.js"></script>
        <script type="text/javascript" src="/app/javascript/jquery/jquery-ui.min.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/jquery.poshytip.min.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/jquery.activity-indicator-1.0.0.min.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/jquery.cookie.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/jquery.slides.min.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/jquery.bxslider.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/jquery.placeholder.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/custom-select-box.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/custom-mobile-pagination.js"></script>
        <!--{? (ISADMIN || writeditorjs) && !_GET.mobileAjaxCall }-->
        <script type="text/javascript" src="/app/javascript/plugin/editor/js/editor_loader.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/editor/js/daum_editor_loader.js?file_use={=manager.file_use}"></script>
        <!--{ / }-->
        <script type="text/javascript" src="/app/javascript/plugin/validate/jquery.validate.js"  charset="utf-8"></script>
        <script type="text/javascript" src="/app/javascript/js/dev-tools.js"></script>
        <script type="text/javascript" src="/app/javascript/js/design.js"></script>
        <script type="text/javascript" src="/data/js/language/L10n_{config_system.language}.js?dummy={=date('YmdHis')}"></script>
        <script type="text/javascript" src="/app/javascript/js/common.js"></script>
        <script type="text/javascript" src="/app/javascript/js/common-mobile.js"></script>
        <script type="text/javascript" src="/app/javascript/js/front-layout.js"></script>
        <script type="text/javascript" src="/app/javascript/js/base64.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/ezmark/js/jquery.ezmark.min.js"></script>
        <script type="text/javascript" src="../../common/script.js"></script>
        <script type="text/javascript" src="../../common/jquery.touchSlider.js"></script>
        <script type="text/javascript" src="../../common/jquery.event.drag-1.5.min.js"></script>
        <script type="text/javascript" src="/app/javascript/js/goods-display_mobile.js?dummy=20180406"></script>
        <link rel="stylesheet" type="text/css" href="/app/javascript/plugin/jquery_swipe/jquery_swipe.css" />
        <script type="text/javascript" src="/app/javascript/plugin/jquery_swipe/jquery.event.swipe.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/touchSlider/swiper.js"></script>
        <script type="text/javascript" src="/app/javascript/plugin/slick/slick.min.js"></script>
        
  • 파일 경로: [스킨폴더]/goods/view.html (약 510 줄 부터)
        <!-- 상품 스펙 -->
        <table width="100%" cellpadding="0" cellspacing="0" border="0">
            <tr>
                <td valign="top">
                    <table width="100%" cellpadding="0" cellspacing="0" align="center" >
                    <tr>
                        <td>
                            <div id="goods_thumbs">
                                <!--{? images && count(images) > 1 }-->
                                <div class="slide-wrap">
                                    <div class="slides_wrap">
                                    <!--{@ images }--><div class="main_tabs_contents slide {? .index_ == 0}active{/}" id="slide{.index_}" style="text-align:center;">
                                    <a href="javascript:;" style="margin:auto;display:inline-block;width:100%;">
                                    {? .view.image_type == 'video'}
                                    <iframe  width="{goods.video_size_mobile0}" height="{goods.video_size_mobile1}" src="{.view.image}" frameborder="0" allowfullscreen  ></iframe>
                                    {:}
                                    <img src="{.view.image}" width="100%" onerror="this.src='../images/common/noimage.gif'" title="{images[1].large.label}" {? goods_view_image_alt}alt="{goods_view_image_alt}"{/}/>
                                    {/}
                                    </a>
                                    </div><!--{/}-->
                                    </div>
                                </div>
                                <div class="relative"><div id="goods_thumbs_paging" idx="0"></div></div>
                                <!--{:}-->
                                <a href="javascript:;">
                                {? images[1].view.image_type == 'video'}
                                    <iframe  width="{goods.video_size_mobile0}" height="{goods.video_size_mobile1}" src="{images[1].view.image}" frameborder="0" allowfullscreen  ></iframe>
                                {:}
                                    <img src="{images[1].view.image}" width="100%" onerror="this.src='../images/common/noimage.gif'" title="{images[1].large.label}" {? goods_view_image_alt}alt="{goods_view_image_alt}"{/}/>
                                {/}
                                </a>
                                <!--{/}-->
                            </div>
                        </td>
                    </tr>
                    </table>
                    <!-- //상품 이미지 -->
                </td>
            </tr>
            <!-- 퍼스트몰 라이브 알림 -->
            <!--{? braodcastData }-->
            <tr>
                <td>
                    <div class="cast_notice">
                        <!--{ ? braodcastData.status == 'live'}-->
                        <img class="status" src="../images/broadcast/i_live.png" alt="방송 중">
                        <p class="notice_text">{braodcastData.start_date} 현재 방송 중</p>
                        <a class="btn_live" href="/broadcast/player?no={braodcastData.bs_seq}" target="_blank"><img src="../images/broadcast/btn_live_go.png" alt="시청하기"></a>
                        <!--{ : }-->
                        <img class="status" src="../images/broadcast/reserve_live.png" alt="방송 예정 LIVE">
                        <a class="notice_text" href="/broadcast/player?no={braodcastData.bs_seq}" target="_blank">{braodcastData.start_date} 라이브 쇼핑으로 만나보세요.</a>
                        <!--{ / }-->
                    </div>
                </td>
            </tr>
            <!--{ / }-->
            <!-- //퍼스트몰 라이브 알림 -->
            {? eventEnd}
            <tr>
                <td class="hide">
                    <table class="event_datetime" width="100%" border="0" cellpadding="0" cellspacing="0">
                    <col /><col /><col width="120" />
                    <tr>
                        <td align="left" class="fx15 pdl10">
                            <strong class="black">{=number_format(goods.event.event_order_ea)}개</strong> 구매 중
                        </td>
                        <td align="right">
                            남은시간
                        </td>
                        <td>
                            <div class="event_datetime_box">
                            <span id="soloday{goods.goods_seq}"></span><span class="fx13 notbold">일</span> <span id="solohour{goods.goods_seq}"></span> : <span id="solomin{goods.goods_seq}"></span> : <span id="solosecond{goods.goods_seq}"></span>
                            </div>
                        </td>
                    </tr>
                    </table>
                </td>
            </tr>
            <!-- //타임세일 -->
            {/}
        

③ 반응형스킨

  • 파일 경로 : [스킨폴더]/_modules/common/html_header.html(약 143줄 부터)
        <link rel="stylesheet" type="text/css" href="../../css/lib.css" />
        <link rel="stylesheet" type="text/css" href="../../css/common.css" />
        <link rel="stylesheet" type="text/css" href="../../css/board.css" />
        <link rel="stylesheet" type="text/css" href="../../css/buttons.css" />
        <link rel="stylesheet" type="text/css" href="../../css/mobile_pagination.css" />
        <link rel="stylesheet" type="text/css" href="/link/css?k=quickdesign&v={=date('YmdHis')}" /><!-- Quick Design CSS →
        <link rel="stylesheet" type="text/css" href="../../css/broadcast.css" />  
        <link rel="stylesheet" type="text/css" href="../../css/user.css" /><!-- ++++++++++++ 스킨 사용자/제작자 CSS ++++++++++++ -->
        <!--{ ? ISADMIN || writeditorjs }-->
        <link rel="stylesheet" type="text/css" href="/app/javascript/plugin/editor/css/editor.css" />
        <!--{ / }-->
  • 파일 경로: [스킨폴더]/goods/view.html (약 585줄 부터)
        <!-- ~~~~~ 단독 이벤트 ~~~~~ -->
        {? eventEnd}
        <li class="spec_solo_event">
            <ul class="list">
                <li class="buy_num"><strong class="num">{=number_format(goods.event.event_order_ea)}</strong><span designElement="text">개 구매중</span></li>
                <li class="remain_time">
                    <span class="title"></span>
                    <div class="event_datetime_box">
                        <span class="num2" id="soloday{goods.goods_seq}">00</span><span class="day" designElement="text">일</span>
                        <span class="num2" id="solohour{goods.goods_seq}">00</span> :
                        <span class="num2" id="solomin{goods.goods_seq}">00</span> :
                        <span class="num2" id="solosecond{goods.goods_seq}">00</span>
                    </div>
                </li>
            </ul>
        </li>
        {/}
        <!-- ~~~~~ //단독 이벤트 ~~~~~ -->
        
        <!-- ~~~~~ 퍼스트몰 라이브 알림 ~~~~~ -->
        <!--{? braodcastData }-->
        <li>
            <div class="cast_notice">
                <!--{ ? braodcastData.status == 'live'}-->
                <img class="status" src="../images/broadcast/i_live.png" alt="방송 중">
                <p class="notice_text">{braodcastData.start_date} 현재 방송 중</p>
                <a class="btn_resp no_border" href="/broadcast/player?no={braodcastData.bs_seq}" target="_blank"><img src="../images/broadcast/btn_live_go.png" alt="시청하기"></a>
                <!--{ : }-->
                <img class="status" src="../images/broadcast/reserve_live.png" alt="방송 예정 LIVE">
                <a href="/broadcast/player?no={braodcastData.bs_seq}" class="notice_text" target="_blank">{braodcastData.start_date} 라이브 쇼핑으로 만나보세요.</a>
                <!--{ / }-->
            </div>
        </li>
        <!--{ / }-->            
        <!-- ~~~~~ 퍼스트몰 라이브 알림 ~~~~~ -->
        
        <!-- ~~~~~ 가격, 할인율, 할인내역 ~~~~~ -->
        <li class="deatil_price_area">
            {? goods.sale_rate}
                { ? goods.org_price != 0 && goods.sale_price != 0 }
                <div class="deatil_sale_rate">
                    <p class="inner">
                        <span class="num">{=number_format(goods.sale_rate)}</span>%
                    </p>
                </div>
                {/}
            {/}
            <!--{? goods.string_price_use }-->
                <p class="sale_price">{goods.string_price}</p>
            <!--{ : }-->
                <!--{ ? goods.org_price > goods.sale_price }-->
                <p class="org_price">
                    <span class="dst_th_size">{=get_currency_price(goods.org_price,2,'','<s><span class="num">_str_price_</span></s>')}</span>
                </p>
                <!--{ / }-->
                <p class="sale_price">
                    {? goods.sale_price > 0 }
                        {=get_currency_price(goods.sale_price,2,'','<span class="num">_str_price_</span>','price_won')}
                    {:}
                        {=get_currency_price(0,2,'','<span class="num">_str_price_</span>','price_won')}
                    {/}
                </p>
            <!--{ / }-->
            <!--{? goods.sale_price_compare && goods.sale_price > 0  && !goods.string_price_use }-->
                {=goods.sale_price_compare}
            <!--{ / }-->
        
            <!--{ ? (array_sum(sales.sale_list) - sales.sale_list.basic) > 0 }-->
            <button type="button" class="btn_open_small btn_resp B" onclick="detail_contents_toggle(this,'priceDetail')"><span designElement="text">혜택보기</span></button>
            <div id="priceDetail" class="detail_option_list hide">
                <ul>
                <!--{ @ sales.sale_list }-->
                    <!--{ ? .value_ > 0 }-->
                    <li>
                        <span class="title">{sales.title_list[.key_]}</span>
                        <span class="detail">{=get_currency_price(.value_,2)}</span>
                    </li>
                    <!--{ / }-->
                <!--{ / }-->
                </ul>
            </div>
            <!--{ / }-->
        </li>
        <!-- ~~~~~ //가격, 할인율, 할인내역 ~~~~~ -->
        

TOP

대표 번호 1544-3270

  1. 1쇼핑몰 창업 및 신규 상담 문의
  2. 2쇼핑몰 기능 및 이용 문의
  3. 3쇼핑몰 이전 문의
  4. 4마케팅 및 광고 문의
  5. 5SI 및 홈페이지 제작 문의

전화상담 가능 시간

  • 일반 상담 : 평일 10:00 ~ 17:00 (주말/공휴일 휴무)
    일반 상담 : 격주 금요일(2,4주) : 10:00 ~ 12:30
    일반 상담 : 점심 12:30 ~ 13:30
  • 장애 상담 : 24시간 가능

입점형 구매상담 및 차이나 호스팅, 컨설팅
02-6907-6817  psw@gabiacns.com

쇼핑몰 맞춤개발 및 구축/SI
1544-6437  sales@gabiacns.com

홈페이지 제작
02-6907-6885  mjh@gabiacns.com

상담 예약

모든 상담원이 통화 중인 경우, 9번을 눌러 상담을 예약해주세요.
통화가 끝나면 고객께 다시 연락드립니다.
(상담 중에는 서비스 품질 향상을 위해 통화 내용이 녹음됩니다.)