아임웹 팁&테크

다양한 활용법, 최신 기능을 알고 싶을 땐 아임웹 팁&테크

쇼핑상품 상세페이지에 기획 상품 추가 진열하기



시작에 앞서

온라인 쇼핑몰들을 보면 상품 상세페이지 최하단에 '베스트셀링' 같은 이름으로 해당 상품 외 추가 상품들을 진열하는 경우가 있습니다.

기본적으로 글로벌 메뉴인 '상품 상세페이지'는 일반 페이지처럼 마음껏 편집하는 것이 불가능합니다. 아무래도 매출과 직결되는 부분인 만큼 주의가 필요하기 때문입니다. 단, 고정된 메뉴를 편집할 수는 없지만 섹션과 위젯을 추가하는 건 가능합니다.

오늘은 매 상품 상세페이지마다 아래 그림처럼 BEST ITEM이라는 이름으로 기획 상품들을 진열하는 방법을 알아보겠습니다.






1단계, 메뉴 관리 열기

디자인 모드 좌측 상단에 위치한 3줄 아이콘을 클릭해 [메뉴 관리] 메뉴 패널을 열어주세요.





2단계, 상품 상세페이지로 이동하기

여러 메뉴 중 글로벌 메뉴 아래 위치한 [상품 상세페이지]를 클릭해주세요.

*글로벌 메뉴는 쇼핑과 예약 위젯을 넣는 경우 자동으로 생성되며, 반대로 쇼핑과 예약 위젯을 삭제하면 관련된 메뉴가 함께 사라집니다.





3단계, 빈 섹션 추가하기

상품 상세페이지 상단에 편집 불가능한 영역 아래 새로운 빈 섹션을 추가해줍니다.

1) 먼저 위젯이 없는 부분에 마우스 커서를 놓고 마우스 오른쪽 버튼을 클릭해주세요.
2) 보조 메뉴가 나타나면 [빈 섹션추가]를 클릭합니다.





4단계, 위젯 추가하기

빈 섹션이 추가되면 아래 그림처럼 + 버튼이 나타납니다. 추가한 섹션 내 위젯을 추가하려면 + 버튼을 클릭해주세요.





5단계, 쇼핑 기획전 추가하기

위젯 목록이 나타나면 [쇼핑 기획전]을 선택해주세요.





6단계, 쇼핑 기획전 위젯 설정 창 켜기

추가된 쇼핑 기획전 위젯에 마우스를 대고, 마우스 우클릭하면 나타나는 [쇼핑 기획전 설정]을 클릭해 설정 창을 켜주세요.





7단계, 쇼핑 기획전 설정하기

슬라이드 또는 리스트 중 하나로 상품 표시 형식을 정할 수 있습니다. 그 외 1줄에 몇 개를 표시할지 정할 수 있으며, 텍스트 색상을 정할 수 있죠. 그러나 여기서 가장 중요한 [표시 대상]입니다.

1) 카테고리 구분 : 어떤 카테고리에 속한 상품을 추가할지 선택합니다. 저는 SHOP 카테고리에 들어 있는 모든 상품들을 표시하기로 했습니다.
2) 기획전 구분 : 카테고리와 관계없이 특정 상품들을 기획전으로 묶어두었다면, 기획전 상품들을 선택합니다. 저는 NEW ARRIVAL과 SPECIAL ITEMS가 모두 나타나도록 설정했습니다.





8단계, 섹션 헤더 만들기

텍스트 위젯과 가로선 위젯을 사용해, 섹션 헤더를 추가해주세요. 표시된 상품들이 어떤 상품들인지 방문자들에게 알려줄 수 있습니다.