별찌 사용가이드


포토샵을 못해도 코딩을 못해도 쉽고 간편하게 관리 해보세요

관리자페이지

쇼핑몰 설정상품 카테고리별 다른 디자인 적용하기

시작에 앞서

쇼핑 위젯쇼핑 기획전 위젯 2가지를 함께 사용해, 메뉴마다 다른 디자인으로 페이지를 꾸미고 상품을 진열할 수 있습니다. 

다음 사이트에서 샘플을 확인하실 수 있습니다.

본 튜토리얼을 진행하기에 앞서 기본 쇼핑설정을 하지 않으셨다면 다음 도움말을 먼저 읽어주세요.



PART 1. 숨김 쇼핑 메뉴 만들기

쇼핑 위젯이 삽입된 숨김 메뉴를 제작합니다. 

본 숨김 메뉴는 쇼핑몰 자동 구성을 위한 메뉴이며, 실제 페이지에는 표시되지 않습니다.


1단계, 빈 메뉴 추가하기
  1. 디자인 모드에 접속합니다.
  2. 왼쪽 상단 메뉴 관리를 클릭합니다.
  3. 상단 메뉴 오른쪽 끝 ⨁를 클릭해 새로운 빈 메뉴를 추가합니다.

  4. 메뉴명을 입력하고 확인을 클릭합니다. (예시 메뉴명 : SHOP 숨김)


2단계, 메뉴 숨기기
  1. 새로 추가한 메뉴에 마우스 오른쪽 버튼을 클릭해 메뉴 설정을 켭니다.
  2. 설정 창 하단 옵션 항목에서 메뉴 숨김를 체크합니다.

  3. 상단 메뉴바에서 상품 메뉴가 숨겨집니다.

3단계, 쇼핑 위젯 추가 및 설정 열기
  1. 왼쪽 상단 더하기를 클릭해 쇼핑 위젯을 추가합니다.
  2. 추가한 쇼핑 위젯에 마우스 오른쪽 버튼을 클릭해 위젯 설정을 엽니다.

4단계, 위젯 설정하기

쇼핑 위젯에 상품 카테고리를 연동하고 주요 설정 요소들을 수정합니다.

*참조 : 일부 설정 값들은 쇼핑 위젯 및 쇼핑 기획전 위젯 디자인에 영향을 줄 수 있습니다.

  1. 진열 항목에서 상품 카테고리를 선택합니다.
  2. 디자인 항목에서 이미지 비율 지정합니다.
    *주의 : 이곳에서 지정한 비율이 상품 상세페이지 이미지에도 적용됩니다.
  3. Hover 효과를 지정합니다. *예 : 상품명, 가격 표시

5단계, 글로벌 메뉴 확인하기
  1. 디자인 모드 왼쪽 상단 메뉴 관리를 클릭합니다.
  2. 글로벌 메뉴에 상품 상세페이지, 장바구니, 마이페이지 메뉴가 생성 되었는지 확인합니다. *쇼핑 위젯 추가 시 자동 생성




PART 2. 상품 카테고리 메뉴 디자인

상품 카테고리 수만큼 메뉴를 만들고, 추가한 메뉴에 쇼핑 기획전 위젯 외 기타 위젯들을 사용해 페이지를 디자인하고 상품을 진열하는 방법을 알아봅니다.


1단계, 메뉴 추가하기
  1. 디자인 모드 왼쪽 상단 메뉴 관리를 켭니다.
  2. 상품 카테고리 메뉴로 사용할 메뉴를 추가(4개) 합니다. *상품 카테고리 수에 따라 메뉴 개수는 달라질 수 있습니다.


2단계, 메뉴 그룹화 및 메뉴명 수정하기
  1. 메뉴를 다음 그림처럼 그룹 메뉴로 구성합니다.

  2. (필요한 경우) 메뉴명과 메뉴별 주소(URL)를 수정합니다.

3단계, 상위 메뉴 디자인 및 상품 진열하기

SHOP(상위 메뉴)에 상품을 진열하고 페이지를 디자인합니다.

참고 : SHOP 메뉴 클릭 시 바로 아래 하위 메뉴(Beans)로 이동하게 하려면 다음 도움말을 참조하세요.

  1. SHOP(상위 메뉴)로 이동합니다.
  2. 원하는 구성으로 SHOP 페이지를 디자인합니다.
  3. 기획전 위젯을 추가합니다.
  4. 추가한 위젯에 마우스 오른쪽 버튼을 클릭하고 쇼핑 기획전 설정을 클릭합니다.
  5. 표시 대상 항목에서 표시할 상품 카테고리를 선택합니다.


4단계, 하위 메뉴 디자인 및 상품 진열하기
  1. Beans(하위 메뉴)로 이동합니다.
  2. 원하는 구성으로 Beans 페이지를 디자인합니다.
  3. 기획전 위젯을 추가합니다.
  4. 추가한 위젯에 마우스 오른쪽 버튼을 클릭하고 쇼핑 기획전 설정을 클릭합니다.
  5. 표시 대상 항목에서 표시할 상품 카테고리를 선택합니다.

  6. 나머지 Cup, Equipment 메뉴도 위 절차에 따라 제작합니다.


5단계, 사이트 미리보기 및 게시하기

미리보기를 클릭해 작업한 내용을 확인하고 게시하기를 클릭해 방문자가 보고 구매할 수 있도록 적용합니다.

INFORMATION


상호명 : (주)위멘토


사업자등록번호 : 506-87-00931

통신판매업신고번호 : 서울금천-1375

고객센터 : 1800-2142 ∣ 이메일 : sales@wemento.kr

대표자 : 김성진 ∣ 개인정보책임자 : 박예린

주소 : 서울특별시 금천구 가산디지털1로 168, 우림라이온스밸리 A동 703호

호스팅주소 : 서울특별시 금천구 가산디지털1로 168, 우림라이온스밸리 A동 703호

BYULZZI


2012년 3월 자체 개발한 솔루션으로부터 모바일앱 제작을 시작으로, 2014년 6월 부터는 PC홈페이지와 모바일웹, 어플이 연동되는 시스템을 개발 및 제작해 왔습니다.

그동안의 노하우를 바탕으로 2016년 1월 반응형웹앱/쇼핑몰웹앱을 출시하여 다양한 업종의 웹사이트를 구축 하였습니다.  

특히, 웹사이트에서의 모든 활동은 스마트폰으로 실시간 알림을 주고 받을 수 있게 연동되어야만 한다는 슬로우건 아래 시장을 선도하고 있습니다.


© BYULZZI Corp. All Rights Reserved. hosting by byulzzi