쇼핑몰 상품의 옵션을 '이미지 또는 색상 버튼', '텍스트 버튼', '라디오 버튼'으로 구성할 수 있는
'옵션 스타일' 기능을 이용해 보세요.
자세히 알아보기
옵션 스타일의 유형
쇼핑몰 상품의 옵션을 '셀렉트박스' 뿐만 아니라 '이미지 버튼', '색상 버튼', '텍스트 버튼'. '라디오 버튼'으로 표시할 수 있어요.
옵션 스타일 기능을 통해 쇼핑몰 상품의 옵션을 다양한 방식으로, 직관적이고 시각적으로 구성할 수 있어요.
- 미리보기
- 이미지 또는 색상으로 등록된 옵션을 버튼으로 표시해요.
- '버튼이미지 설정', '색상 설정'에 입력한 정보로 버튼 모양이 결정되며 버튼 이미지와 색상을 모두 등록하면 옵션 버튼은 이미지로 표시되어요.
- 단, 옵션 구성 방식이 '조합 일체선택형'인 경우에는 '텍스트 버튼'으로 표시되어요.
- 텍스트 버튼
- 텍스트로 된 버튼으로 상품의 옵션이 표시되어요.
- 라디오 버튼
- 라디오로 된 버튼으로 상품의 옵션이 표시되어요.
- 표시되는 형태만 라디오 버튼인 것으로, 옵션값은 중복 선택이 가능해요.
옵션 스타일 '미리보기' 설정하기
- 다음 화면에서 조합 분리선택형, 상품 연동형, 독립 선택형 옵션 구성방식에 옵션 스타일 '미리보기'를 설정할 수 있어요.
- 의 '옵션/재고 설정'
- 의 '상품 수정' 화면의 '옵션/재고 설정'
- 의 > 상품 옵션 설정 > 품목생성형 옵션 관리 / 상품연동형 옵션 관리 > 옵션 등록 / 수정'
- 셀렉어트박스 옵션으로 구성되 있는 상품을 수정해 볼게요.
옵션 스타일의 기능 설정을 위해 수정할 상품의 '상품 수정' 화면으로 이동해요.
'상품 수정'의 '옵션/재고' 탭을 클릭하면 상품의 옵션을 설정할 수 있는 영역을 확인할 수 있어요. - 기존에 설정되어 있던 옵션을 수정하기 위해 '옵션값 수정'을 클릭해요.
-
쇼핑몰 상품의 옵션을 색상 버튼으로 구성해 볼게요.
색상을 설정하면 상품 상세 화면 뿐만 아니라 상품 목록 화면에서도 상품의 색상 옵션이 표시되어요. -
'옵션값 수정' 화면의 '옵션 스타일' 항목을 '미리보기'로 선택한 후 '옵션 입력' 항목에서 상품 옵션으로 사용할 정보를 입력하고 '색상 설정'에 '옵션값 (#헥사코드)'을 입력하여 설정해요.
※ 상품 목록 화면에 상품이 색상 옵션을 표시하기 위해서는 의 상품정보표시 설정 > 상품목록'의 '상품색상' 항목을 '표시함'으로 설정해 주세요. - 쇼핑몰 상품의 옵션을 이미지 버튼으로도 함께 구성해 볼게요.
이미지 버튼을 등록하면 등록한 이미지로 옵션이 표시되어요.'옵션값 수정' 화면의 '옵션 스타일' 항목을 '미리보기'로 선택한 후 '옵션 입력' 항목에서 상품 옵션으로 사용할 정보를 입력하고 '버튼이미지 설정'에 옵션 표시에 사용할 이미지를 등록해요. - 옵션값 수정 완료 후 '저장'을 클릭하면 '상품 수정' 화면에 수정한 옵션값이 적용된 것을 확인할 수 있어요.
설정이 완료된 것을 확인하고 '상품 수정' 화면 내 '상품수정'을 클릭해야 수정한 옵션이 최종 반영되어요. - 상품 수정이 완료되면 쇼핑몰의 상품 상세 화면에서 옵션 스타일이 색상 버튼과 이미지 버튼으로 표시된 것을 확인할 수 있어요.
옵션 스타일 '텍스트 버튼' 설정하기
- 쇼핑몰 상품의 옵션을 텍스트 버튼으로 구성해 볼게요. 텍스트로 등록한 옵션 정보로 옵션이 표시되어요.
'옵션값 수정' 화면의 '옵션 스타일' 항목을 '텍스트 버튼'으로 선택하고 '옵션 입력' 항목에 옵션명(예 : 사이즈)과 옵션값(예 : XS, S, M, L)을 입력해요. - 옵션값 수정 완료 후 '저장'을 클릭하면 '상품 수정' 화면에 수정한 옵션값이 적용된 것을 확인할 수 있어요.
설정이 완료된 것을 확인하고 '상품 수정' 화면 내 '상품수정'을 클릭해야 수정한 옵션 정보가 최종 반영되어요. - 상품 수정이 완료되면 아래와 같이 쇼핑몰 상품 상세 화면에서 옵션 스타일이 텍스트 버튼으로 표시된 것을 확인할 수 있어요.
Note
'옵션 스타일 - 셀렉트박스' 유형 이외의 옵션 스타일은 디자인 설정을 해야 적용할 수 있어요.