배너영역
상단의 [스킨추가] 버튼 또는 아래의 [버튼]을 클릭해서
배너를 적용할 스킨을 선택해 주세요. 스킨추가하기
좌측의 [배너영역추가] 버튼 또는 아래의 [버튼]을
클릭해서 배너를 적용할 영역을 추가해 주세요. 배너영역추가
우측 상단의 [배너추가] 버튼 또는 아래의 [버튼]을
클릭하여 배너를 추가해 주세요. 배너추가하기
배너영역 순서변경
  • 메인 비주얼
  • 메인 롱배너
  • 메인 테마 컬렉션 배너
  • 메인 비주얼
  • 메인 비주얼
  • 메인 비주얼
  • 선택 후 화살표를 클릭하여 이동하거나, 순서를 직접 입력해서 이동할 수 있습니다.
  • 배너영역 순서 이동 후 [저장]시 표시순서 번호는 자동으로 정렬 됩니다.
배너 순서변경
  • 1번 배너
  • 2번 배너
  • 3번 배너
  • 4번 배너
  • 5번 배너
  • 6번 배너
  • 선택 후 화살표를 클릭하여 이동하거나, 순서를 직접 입력해서 이동할 수 있습니다.
  • 배너 순서 이동 후 [저장]시 표시순서 번호는 자동으로 정렬 됩니다.
스킨 목록
  • 배너를 적용할 스킨을 선택하세요.
  • 스킨명은 모렌비 배너관리자 내부에서 사용할 스킨명입니다.
배너 복구
  • 스킨별로 백업받은 배너파일을 선택해주세요.
  • 백업파일을 등록하는 경우에, 기존에 등록된 배너는 전부 사라집니다.
  • 백업파일 형식과 내용이 잘못된 경우, 등록되지 않습니다.
  • 이미지 파일이 아닌, 이미지 경로만 백업 및 복구됩니다.
파일 첨부
이미지 등록
  • 이미지 확장자는 gif, jpg, png, svg, webp 만 지원됩니다.
  • 등록 가능한 이미지 용량은 최대 5MB입니다.
  • 화면 우측 상단의 “저장하기” 를 누르기 전까진 실제 배너에 반영되지 않습니다.
파일 첨부
이미지 수정
  • 이미지 확장자는 gif, jpg, png, svg, webp 만 지원됩니다.
  • 등록 가능한 이미지 용량은 최대 5MB입니다.
  • 화면 우측 상단의 “저장하기” 를 누르기 전까진 실제 배너에 반영되지 않습니다.
파일 첨부
스킨별 설치코드

<!--
	모렌비 배너관리자 코드
	사이트명 : 식스틴픽셀 PC
	사이트코드 : 6a840d6943f14db23576
-->
<style>[morenvy-banner-group]:not([morenvy-banner-group="ready"]) {display:none !important;}</style>
<script src="//ecudemo245950.cafe24.com/web/upload/appfiles/0zdpAngaKBFnlCcCqpCU4A/1a6a8575bf2f441ab59fcc28042fa7b2.js"></script>
스크립트 코드 전체를 드래그하여 복사 해주세요.
레이아웃 파일의 HTML소스 하단에 보여지는 </body> 태그가 끝나기 직전에 붙여넣기 후 '저장'하시면 됩니다.

스크립트 캐시 사용을 원하시면 위 함수의 false 값을 true 로 변경하시면 됩니다.

카페24 FTP 서비스를 새로 이용 또는 이용하던 서비스가 만료된 경우 설치코드 경로 초기화가 필요합니다.
이 경우 설치코드 경로 초기화 를 클릭하여 초기화를 진행해주세요.
초기화가 완료되면 스킨별 설치코드 재적용이 필요합니다.
오류가 발생하여 설치코드가 생성이 안된 경우 위 설치코드 경로 초기화 버튼을 클릭하여 설치코드를 다시 생성해주세요.
배너영역 추가
  • 배너영역은 메인이미지3장, 4단배너 등 하나의 영역에서 여러장의 배너가
    출력되는 형태로 사용하실 수 있습니다.
  • 한눈에 알아볼 수 있는 명칭으로 정하시면 운영이 편리합니다.
  • 배너영역명
  • 설명
  • 노출방식
배너영역 수정
  • 배너영역은 메인이미지3장, 4단배너 등 하나의 영역에서 여러장의 배너가
    출력되는 형태로 사용하실 수 있습니다.
  • 한눈에 알아볼 수 있는 명칭으로 정하시면 운영이 편리합니다.
  • 배너영역명
  • 설명
  • 노출방식
모렌비 배너관리자 가이드
카페24 운영자 여러분, 안녕하세요 모렌비입니다.

모렌비 배너가이드앱은 쇼핑몰 디자인에 적용된 이미지, 텍스트 링크를
쉽고 간편하게 교체하고 관리할 수 있는 앱입니다.

처음에는 편리한 운영방식을 요청하시는 당사 고객분들을 위해 제작하였으나
카페24의 협조를 받아 모든 운영자분들과 함께 공유할 수 있는 형태로 출시하게 되었습니다.

앞으로도 더 많은 운영자분들에게 작게나마 도움이 되면 좋겠습니다.

감사합니다.
1. 관리자화면에서 배너 세팅
1)상단 메뉴의 스킨추가 버튼을 클릭하고, 배너를 적용할 스킨을 선택합니다.
명칭은 배너관리자에서만 사용되며 관리하기 편한 이름으로 변경 가능합니다.
2)상단영역에 추가된 스킨을 선택한 후, 좌측메뉴에서 [배너영역추가]버튼을 클릭합니다.
배너영역은 쇼핑몰 화면에서 배너가 노출되는 영역을 의미합니다.
ex) 메인비주얼영역, 2단띠배너영역, 탑배너영역 등.
3)배너영역을 선택한 후에는, 배너추가버튼을 클릭하여, 배너영역에 적용할 이미지를 등록합니다.
2. 디자인 관리화면에 소스 적용
1)스킨별 메뉴에서 스킨별 설치코드를 확인합니다.
/body 태그 바로 앞의 위치에 추가합니다.
2)배너를 적용할 디자인 영역에 배너코드를 입력하고 사용할 형태에 맞게 html및 변수를 적용합니다.
배너영역 코드예제

※ 아래 코드를 복사해서 스킨에 적용하실 수 있습니다.

<!--
    모렌비 배너관리자
    배너영역명 : 메인 비주얼
-->

<div morenvy-banner-group="84249a9511a138ab8ebc">

    <div morenvy-banner><!-- 배너 반복시작 -->
        <a href="_link_" target="_target_">_imgTag_
    </div><!-- 반복종료 -->

    <div morenvy-banner><!-- 배너 반복시작 -->
        <a href="_link_" target="_target_">_imgTag_
    </div><!-- 반복종료 -->

</div>
※ 이 배너영역 변수는 모렌비 배너관리자에서만 사용되는 변수 입니다.
배너정보 변수명
배너영역 클래스 morenvy-banner-area
배너 클래스 morenvy-banner
배너영역명 {#areaName}
배너영역 설명 {#areaDesc}
배너영역 노출방식 - 0:순서대로, 1:랜덤(무작위) {#areaDisplayType}
배너 번호 {#num}
배너 타이틀 {#title}
배너 노출방식 - 0:항상 노출, 1:기간 노출 {#displayType}
기간 노출 시작 시간 {#displayBeginTime}
기간 노출 종료 시간 {#displayEndTime}
텍스트1 {#text_1}
텍스트2 {#text_2}
텍스트3 {#text_3}
링크1 {#link_1}
링크2 {#link_2}
링크3 {#link_3}
링크1 타겟 {#target_1}
링크2 타겟 {#target_2}
링크3 타겟 {#target_3}
HTML {#html}
이미지1 태그 {#imgTag_1}
이미지2 태그 {#imgTag_2}
이미지3 태그 {#imgTag_3}
이미지1 경로 {#imgSrc_1}
이미지2 경로 {#imgSrc_2}
이미지3 경로 {#imgSrc_3}
동영상1 태그 {#video_1}
동영상2 태그 {#video_2}
동영상3 태그 {#video_3}
이미지1 or 동영상1 경로 {#imgTag_1_or_video_1}
이미지2 or 동영상2 경로 {#imgTag_2_or_video_2}
이미지3 or 동영상3 경로 {#imgTag_3_or_video_3}
코드 예제
※ 이 배너영역 변수는 모렌비 배너관리자에서만 사용되는 변수 입니다.
상품정보 변수명
상품영역 클래스 morenvy-product-area
상품 클래스 morenvy-product
상품 번호 {#productNo}
상품명 {#name}
상품 영문명 {#nameEn}
판매가 {#price}
소비자가 {#retailPrice}
할인판매가 {#discountPrice}
링크 {#link}
대 이미지 태그 {#imgBigTag}
중 이미지 태그 {#imgMediumTag}
소 이미지 태그 {#imgSmallTag}
축소 이미지 태그 {#imgTinyTag}
대 이미지 경로 {#imgBig}
중 이미지 경로 {#imgMedium}
소 이미지 경로 {#imgSmall}
축소 이미지 경로 {#imgTiny}
상품 요약 설명 {#summaryDesc}
상품 간략 설명 {#simpleDesc}
자체 상품 코드 {#customCode}
브랜드 코드 {#brand}
모델명 {#modelName}
트렌드 코드 {#trend}
제조사 코드 {#manu}
추가항목명 ex) {#addInfo_name_1} {#addInfo_name_n}
추가항목 내용 ex) {#addInfo_value_1} {#addInfo_value_n}
최적 할인가 {#opt_discountPrice}
쿠폰 적용가 {#coupon_discountPrice}
할인 기간 {#promotion_period}
추가 이미지 태그 ex) {#addImgTag_1} {#addImgTag_n}
추가 이미지 경로 ex) {#addImg_1} {#addImg_n}

상품목록
No 상품명/상품코드 판매가 진열상태 판매상태
1
나이키 에어 줌 베이퍼플라이 넥스트 9
P00000EE
49,500원 진열함 판매함
2
나이키 에어 줌 베이퍼플라이 넥스트 9
P00000EE
49,500원 진열함 판매함
앗!! 상품진열 무료범위를 전부 이용중입니다!(상품영역 3개, 상품진열수 각7개 가능)