디스플레이/디자인 관리

쇼핑몰의 디스플레이 위젯을 관리합니다. 항목별, 기기별로 구분하여 위젯의 문구 및 이미지를 변경하고 디자인적인 요소들을 수정할 수 있습니다.

일반 디스플레이(일반위젯)

#메인이미지, #위젯, #일반위젯, #배너 등록하기, #로고 등록하기

일반위젯 설정하기

 메인 슬라이드 위젯 등록하기 (메인 화면 이미지)

1. 우측 상단의 녹색 폴더 버튼을 클릭하여 위젯을 조회하겠습니다.

image.png

2. "메인"으로 검색시 모바일, 테블릿, 데스크탑 디바이스별 위젯이 조회됩니다. 

수정 및 추가하기 위해 위젯번호를 클릭합니다.

image.png

3. 아래와 같이 수정하려는 위젯이 지정되었습니다. 우측 중간에 위젯 컨텐츠(내용) 추가 버튼을 클릭합니다.

image.png

4. 1행이 추가됩니다. 이미지 업로드를 위해서 미디어 업로드를 클릭합니다.

image.png

5. Browse 버튼을 클릭하여 수정 및 추가하려는 이미지를 선택합니다.

미디어 붙여넣기 클릭시 이미 미디어라이브러리에 업로드했던 이미지들을 가져와서 붙여넣을 수 있습니다.

image.png

6. 이미지를 업로드한 후 반드시 저장버튼을 통해 save 합니다.

image.png

 

서브배너 등록하기

1. 우측 상단 저장 버튼 옆 화살표 버튼 -> 새 위젯 버튼 클릭

image.png

2. 위젯코드를 "mb-sub-slider"로 선택합니다. 

image.png

3. 예시 이미지를 참고하여 아래 사항들을 작성해줍니다.

언어구분 : 한국어 선택

기기구분 : 디바이스를 선택합니다.

일자 : 등록일자를 지정합니다.

위젯명 : 사용자(관리자)가 인식하기 어렵지 않도록 작성합니다.

디자이너 참조용 미디어크기 :  "input media size for web designers" 를 작성합니다.

image.png

4. 위젯 컨텐츠(내용) 추가 버튼을 클릭합니다.

image.png

 5. 미디어 업로드 버튼을 클릭하여 메인 중간 배너로 들어갈 이미지를 선택합니다.

image.png

6. 저장버튼을 통해 추가해준 위젯을 반드시 저장해야합니다.

image.png

 


 

 

서브배너 참고 이미지

실제 서브배너가 적용된 예시 이미지입니다.

image.png

image.png

image.png

 


 

메인로고 등록하기

1. 우측 상단 저장 버튼 옆 화살표 버튼 -> 새 위젯 버튼 클릭

image.png

2. 위젯코드를 "mb-sub-slider"로 지정합니다. 

image.png

3. 예시 이미지를 참조하여 아래 사항들을 작성합니다.

언어구분 : 한국어 선택

기기구분 : 디바이스를 선택합니다.

일자 : 등록일자를 지정합니다.

위젯명 : 사용자(관리자)가 인식하기 어렵지 않도록 작성합니다.

디자이너 참조용 미디어크기 :  "input media size for web designers" 를 작성

image.png

4. 위젯 컨텐츠(내용) 추가 버튼을 클릭합니다.

image.png

5. 미디어 업로드 버튼을 통해 메인 메인로고로 들어갈 이미지를 선택합니다.

image.png

6. 저장버튼을 통해 추가해준 위젯을 저장합니다.

image.png


 

메인로고 참고용 이미지

실제 메인로고가 적용된 예시 이미지입니다.

image.png

image.png

image.png

 


 

메인텍스트 입력하기

1. 

 









품목 디스플레이(품목위젯)

#품목, #품목위젯, #아이템

해당 메뉴에서 홈페이지의 best 상품/ 신상품 / 추천상품 등 다양한 상품 카테고리를 구성하여 아이템을

메인페이지에 구성할 수 있습니다.

품목위젯 활용하기

1. 품목위젯이란?

기본적으로 활용할 수 있는 다양한 품목위젯이 존재합니다. (사이트별로 다를 수 있습니다.)

new 신상품
best 인기상품
recommended 추천상품
event 이벤트상품
기타 커스터마이징(기획상품 등등)

2. 예시 이미지

image.png

image.png


 3. 품목위젯 등록하기

 (1). 우측 상단의 저장버튼 좌측 녹색폴더 버튼을 클릭합니다.

image.png


(2). 품목분류조회 모달창에서 등록학 품목위젯번호를 클릭합니다. new를 예제로 진행하겠습니다.

image.png


(3). 품목분류 이름을 작성합니다. 관리자가 인식하기 쉬운 이름으로 네이밍합니다.

image.png

(4). 위젯추가 버튼을 클릭하면 하단에 품목을 입력할 수 있는 칸이 생깁니다.


(5). 품목코드 입력창에 마우스 커서를 클릭하고 키보드의 enter 키를 누릅니다.

image.png


(6). 등록된 품목리스트 중 품목위젯에 등록할 아이템을 선택합니다.

image.png


(7). 우측에 저장버튼을 눌러 저장합니다.

image.png

타임 세일 디스플레이