4. [모바일] 프로모션 상품링크

🔵 파일명 : PROMOTION1.html

👉🏻 1. Intro

📌 프로모션 페이지는 아래 2개의 코드로 나누어져 있어요
📌 아래 2.프로모션 이미지 레이아웃 과
📌 그리고 연관된 상품을 보여주는 3.상품 연동 코드 레이아웃
📌 아래 HTML 설명을 보면 이미지와 링크를 쉽게 수정하실수 있을거에요!

👉🏻 2. 프로모션 이미지

<div style="display: flex; justify-content: center;">
<img style="width: 100%;" src="https://kwangjuyo2012.cafe24.com/web/product/kjy2020/4-1-PROMOTION_0_100.jpg"></img>
</div>

HTML 설명
- line 1) div 레이아웃 시작, 가운데 정렬
- line 2) 프로모션에 보여줄 이미지 URL (모바일버전은 해상도를 위해 width: 100% 를 추가했어요
- line 3) div 레이아웃 종료

👉🏻 3. 상품 연동 코드

<div module="product_listmain_1" class="ec-base-product">
    <!--
        $count = 4
		$moreview = yes
    -->
    <div class="title">
        <h2><span>{$category_title_text}</span></h2>
    </div>
    <ul class="prdList grid2">
        <!--@import(/weskin_import/prdList.html)-->
    </ul>
    <div module="product_listmore_1" class="btn_moreview">
        <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>)
        </a>
    </div>
</div>

HTML 설명
- line 1) 메인분류 상품번호 호출 모듈
- line 3) $count = 4 화면에 보여줄 상품의 Count
- line 4) $moreview = yes 화면에 상품 더보기 버튼 선택 여부 (Value : yes , no)
- line 9) <ul class="prdList grid2"> 한 라인에 보여줄 상품의 갯수 grid2는 2개, grid3은 3개
- line 12) 더보기 모듈로 product_listmain_1와 product_listmore_1의 끝 번호는 맞춰주셔야해요
📍 중요) 프로모션 상품 바꾸고 싶으면 아래 사진처럼 (1)메인진열 → (2)메인분류 관리 → (3)추가 → (4)모듈코드 번호를 product_listmain_1 이 모듈번호를 대신해서 입력해주셔야 해요

Made with SlashPage