컬렉션 페이지

컬렉션은 특정 제품을 범주별로 그룹화하기 위해 생성하는 페이지입니다. 자동 컬렉션수동 컬렉션을 사용할 수 있습니다.

기본적으로 컬렉션 페이지에는 테마 편집기의 컬렉션 배너 섹션과 제품 그리드 섹션이 있습니다.

컬렉션 배너 섹션 설정

컬렉션 배너 섹션에는 현재 보고 있는 컬렉션의 설명과 추천 이미지가 표시됩니다.

컬렉션 페이지의 컬렉션 배너 섹션에 대한 설정
설정설명
컬렉션 설명 표시컬렉션에 대한 설명을 표시합니다.
컬렉션 이미지 표시컬렉션 이미지를 표시합니다.
색상 배합이 섹션에 적용할 수 있는 색상의 집합입니다. 색상 구성표에 대해 자세히 알아보십시오.

제품 그리드 섹션 설정

제품 그리드 섹션에는 현재 보고 있는 컬렉션에 포함된 제품이 표시됩니다.

컬렉션 페이지의 제품 그리드 섹션에 대한 설정
설정설명
페이지당 제품각 페이지에 표시할 제품 수. 8~36 범위에서 4의 배수로 선택합니다.
데스크톱의 열 수데스크톱 컴퓨터에서 제품이 표시되는 열 수를 설정합니다. 1에서 6 사이의 숫자를 선택하십시오.
색상 배합이 섹션에 적용할 수 있는 색상의 집합입니다. 색상 구성표에 대해 자세히 알아보십시오.
이미지 비율제품 그리드에 표시되는 제품 추천 이미지의 이미지 비율을 설정합니다. 다음 옵션 중에서 선택하십시오.
  • 이미지에 맞춤 - 이미지의 가로 세로 비율을 사용합니다. 이렇게 하면 이미지가 잘리는 것을 방지합니다.
  • 세로형 - 2:3 비율을 사용하도록 이미지를 자릅니다.
  • 정사각형 - 1:1 비율을 사용하도록 이미지를 자릅니다.
이미지 모양제품 이미지에 대해 다음 이미지 모양 중 하나를 선택합니다.
  • 기본 - 제품 이미지를 직사각형 모양으로 변경합니다.
  • 아치 - 제품 이미지 위쪽을 곡선으로 만듭니다.
  • 블롭 - 제품 이미지를 마우스를 올릴 때 고유한 애니메이션이 있는 6개의 무작위 블롭 모양 중 하나로 둥글게 만듭니다.
  • 왼쪽 방향 표시 - 제품 이미지를 왼쪽으로 급격하게 휘어진 갈매기 모양으로 변경합니다.
  • 오른쪽 방향 표시 - 제품 이미지를 오른쪽으로 급격하게 휘어진 갈매기 모양으로 변경합니다.
  • 다이아몬드 - 제품 이미지를 4면 다이아몬드 모양으로 변경합니다.
  • 평행사변형 - 제품 이미지를 두 쌍의 평행선이 있는 모양으로 변경합니다.
  • 원형 - 제품 이미지를 마우스를 올릴 때 고유한 애니메이션이 있는 원이나 타원 모양으로 둥글게 만듭니다.
마우스를 올리면 보조 배경 표시고객이 데스크톱 컴퓨터에서 제품 이미지 위에 커서를 올리면 두 번째 제품 이미지가 표시됩니다(이미지가 2개인 경우).
공급업체 표시각 제품의 공급업체를 표시합니다.
제품 평점 표시제품 평점을 별점으로 표시하고 괄호 안에 리뷰 수(예: ★★★★★(8))를 표시합니다. 제품 리뷰 앱reviews.rating_count메타 필드 정의가 필요하고 reviews.rating의 메타 필드 정의도 있어야 합니다.
빠른 추가 빠른 추가 옵션을 활성화하면 고객이 제품 카드에서 카트에 품목을 추가할 수 있습니다. 다음 옵션 중에서 선택하십시오.
  • 없음 - 빠른 추가 기능이 표시되지 않습니다.
  • 표준 - 제품 카드에 다음 빠른 추가 버튼 중 하나가 표시됩니다.
    • 카트에 추가 - 단일 이형 제품의 경우. 고객이 버튼을 클릭하면 해당 제품이 자동으로 카트에 추가됩니다.
    • 옵션 선택 - 이형 상품이 있는 제품의 경우. 고객이 버튼을 클릭하면 이형 상품을 선택하고 구매를 진행할 수 있는 팝업 대화 상자가 표시됩니다.
  • 대량 - 빠른 주문 목록 기능을 표시합니다.
필터 사용고객에게 제품 그리드 필터링 옵션을 제공하려면 이 옵션을 선택합니다 .
데스크톱 필터 레이아웃데스크톱 컴퓨터에서 필터가 표시되는 방식을 설정합니다. 가로, 세로, 서랍형 레이아웃 중에서 선택할 수 있습니다.
정렬 사용이 옵션을 선택하면 고객이 제품 표시 순서를 정렬하는 옵션을 사용할 수 있습니다.
모바일의 열 수모바일 장치에서 제품이 표시되는 열 수를 설정합니다. 열을 1개 또는 2개 선택합니다.
상단 패딩섹션 상단의 공간 크기를 설정합니다.
하단 패딩섹션 하단의 공간 크기를 설정합니다.

제품 그리드 섹션 설정 외에도 제품 카드의 테마 설정을 보고 사용자 지정할 수 있으며, 나만의 섹션별 사용자 지정 CSS를 추가할 수 있습니다.

적절한 답변을 찾을 수 없습니까? 언제든지 도와드리겠습니다.