portfolio
상세페이지에서 다른 상품들과 연결해서 구매하기
0
공유하기
쇼핑몰에서 상품을 등록하면 각 상품은 고유한 상품번호와 상세페이지를 갖게 됩니다.
기존에는 서로 다른 상품을 함께 구매하려면 각 상품의 상세페이지를 각각 방문해 장바구니에 담은 뒤, 장바구니 페이지로 이동하여 최종 구매를 진행해야 했습니다.
예를 들어 상품번호가 다른 상품 4개를 구매하려면, 총 4번의 상세페이지를 방문해야 하는 불편이 있었습니다.
개발놀이터의 고도몰 튜닝을 통해 이러한 불편을 개선했습니다.
상품 상세페이지에서 다른 상품들을 체크박스로 선택하여, 페이지 이동 없이 여러 상품을 묶음으로 구매할 수 있습니다.
찜리스트 및 장바구니 기능도 함께 구현했습니다.
※ 추가 튜닝 기능
- 연결 상품 정보를 엑셀 파일로 업로드·다운로드 가능 → 관리 효율성 향상
- 옵션이 없는 단품 상품을 전제로 구현
- 쇼핑몰 운영에 필요한 판매상태, 판매단위 입력 기능 추가
- 상세페이지 UI 디자인 부분 리뉴얼 진행
관리자 상품 등록 페이지에서는 한 상품에 연결할 다른 상품들을 ‘연결상품’으로 선택할 수 있으며, 필요에 따라 판매상태, 판매단위를 추가로 입력할 수 있습니다.
관리자 상품 등록 페이지에서 1개 상품에 연결할 다른 상품들을 연결상품으로 선택합니다.
- 추가로 필요한 판매상태, 판매단위로 입력합니다.
연결상품 메뉴에서 상품 선택 버튼을 누르면 상품 선택 팝업창이 나타납니다.
- 에를 들어 A 상품 연결상품 등록시 B,C,D 상품을 선택하면 B,C,D 상품 상세 페이지에서도 A 상품이 묶음 상품으로 서로 자동 연결됩니다.
- 연결할 상품을 선택하고 상품 등록 페이지에서 저장하기 버튼을 누르면 연결할 상품 설정이 완료됩니다.
A 상품 등록 페이지에서 묶음 구매로 설정된 B,C,D 상품은 A 상품의 상세 페이지에서 리스트로 나열되며 묶음 상품처럼 함께 구매가 가능합니다.
A 상품에서 묶음 상품으로 연결된 B,C,D 상세 페이지에도 마찬가지로 A 상품이 리스트에 묶음 상품으로 보여집니다.
- A, B, C, D 상세 페이지 어디에서나 A,B,C,D 상품이 묶음 상품처럼 취급되어 함께 주문이 가능합니다.
모바일도 동일한 기능으로 제작 되었습니다.
국내 1위 인지도를 가진 소모품, 공구, 유지관리 용품 업체인 나비엠알오(NAVIMRO) 쇼핑몰의 상세페이지의 [자주함께 구매하는 상품] 을 참조하였습니다.
개발놀이터의 튜닝 소스 코드는 불필요한 부분을 최소화해 간결하면서도 분석하기 쉽습니다.
또한 타 개발사 개발자나 프리랜서 개발자도 쉽게 이해할 수 있는 구조로 설계되어 유지 관리 효율성을 극대화했습니다.
아울러 고도몰에서 제공하는 기본 치환코드와 동일한 방식으로 제작되어, 비개발자도 레이아웃을 손쉽게 조정하고 수정할 수 있습니다.
- 고도몰 기본 치환코드와 동일한 방식으로 개발 {=includeWidget('goods/_goods_display_connect.html')}
#연결상품 #관련상품 #연결
댓글 0개
댓글을 불러오는 중입니다.
친절한 개발자에게
무엇이든 물어보세요
1
상세페이지에서 다른 상품들과 연결해서 구매하기