페이지 유형

각 페이지에는 자체적인 기본 섹션과 설정이 있습니다.

제품 페이지

기본적으로 제품 페이지에는 제품 정보 섹션과 제품 추천 섹션이 있습니다.

제품 정보 섹션에 포함된 기본 블록은 다음과 같습니다.

  • 텍스트(기본값은 vendor 특성을 표시함)
  • 제목
  • 텍스트(기본값은 product subtitle 특성을 표시함)
  • 가격
  • 이형 상품 피커
  • 수량 선택기
  • 구매 버튼
  • 설명
  • 공유

또한 다음 블록을 추가할 수 있습니다.

  • 텍스트
  • 사용자 지정 Liquid
  • 제품 평점
  • 축소 가능 탭
  • 팝업
  • 보완 제품
  • 재고
  • SKU
  • 텍스트 포함 아이콘

제품 정보 섹션은 최대 16개 블록을 포함할 수 있습니다.

제품 정보 섹션 설정

제품 정보 섹션의 설정
설정 설명
데스크톱에서 콘텐츠 고정 활성화 페이지를 아래로 스크롤할 때 제품 정보 열은 모든 이미지가 스크롤될 때까지 스크롤되지 않습니다.
데스크톱 미디어 너비 미디어 너비를 작게, 보통, 크게 중에서 선택합니다. 모바일 장치의 경우 미디어 위치가 자동으로 최적화되므로 이 설정은 데스크톱 컴퓨터에서 페이지에 액세스하는 사용자에게만 적용됩니다.
미디어를 화면 높이로 제한 이 옵션을 선택하면 장치의 브라우저 창 높이를 기준으로 최대 미디어 높이가 설정됩니다.
미디어 맞춤 원본을 선택하여 미디어의 원래 가로 세로 비율을 유지하거나 채우기를 선택하여 미디어를 컨테이너에 맞춥니다.
데스크톱 레이아웃

데스크톱에서 제품 미디어 표시 방식

  • 썸네일 캐러셀 - 제품에 미디어 유형이 두 가지 이상인 경우 나머지 미디어는 제품 기본 미디어 아래의 캐러셀에 썸네일로 표시됩니다. 고객은 썸네일을 클릭하여 미디어를 로드하거나 캐러셀 탐색 화살표를 사용하여 다른 미디어를 표시할 수 있습니다.
  • 썸네일 - 제품에 미디어 유형이 두 가지 이상인 경우 나머지 미디어는 제품 기본 미디어 아래에 썸네일로 표시됩니다. 고객은 썸네일을 클릭하여 미디어를 로드할 수 있습니다.
  • 스택 - 모든 제품 미디어를 서로 겹치게 표시합니다. 스택 미디어 유형을 클릭하면 선택한 미디어를 더 크게 표시하는 팝업 창이 열립니다.
  • 데스크톱 미디어 위치 추천 제품 미디어를 왼쪽에 둘지 오른쪽에 둘지 선택합니다. 이 설정은 데스크톱 컴퓨터에서 페이지에 액세스하는 사용자에게만 적용됩니다.
    이미지 확대/축소

    데스크톱에서 이미지를 확대/축소하는 방법을 선택합니다:

  • 라이트박스 열기 - 큰 이미지를 엽니다. 모바일에서의 기본값입니다.
  • 확대/축소 안 함 - 이미지 확대/축소를 비활성화합니다. 고해상도가 아닌 이미지에 권장됩니다.
  • 클릭 및 커서 올리기 - 클릭하여 이미지를 확대한 다음 마우스를 올려 확대된 다른 섹션을 봅니다. 마우스가 위치하면 확대/축소는 확대된 이미지를 다시 클릭하거나 마우스가 이미지의 컨테이너를 벗어나면 비활성화됩니다. 이 설정이 활성화되어 있고 사용자가 모바일 장치를 사용하는 경우 이미지는 기본적으로 모달(라이트박스)에서 열립니다.
  • 모바일 레이아웃 모바일에서 썸네일을 숨기거나 표시하도록 선택합니다.
    이형 상품 선택 시 다른 이형 상품의 미디어 숨기기 이형 상품을 선택하면 다른 이형 상품의 이미지가 보기에서 숨겨집니다. 이형 상품을 선택 취소하면 이미지가 다시 나타납니다.
    동영상 루프 활성화 동영상을 루프에서 재생하도록 설정하여 동영상이 끝나면 자동으로 리플레이됩니다.
    섹션 패딩 제품 정보 섹션의 상단이나 하단에 간격을 추가합니다. 범위 슬라이더를 사용하여 0px~100px의 공백을 제품 정보 위 또는 아래에 추가할 수 있습니다.

    제품 정보 블록

    다음 블록을 제품 정보 섹션에 추가할 수 있습니다.

    텍스트 블록

    텍스트 블록은 다이나믹 소스를 사용하여 정적 텍스트 또는 가변 데이터를 표시하기 위해 사용될 수 있습니다. 예를 들어 "$100 USD 이상 무료 배송"과 같은 마케팅 메시지를 표시하는 텍스트를 각 제품에 동일하게 표시되도록 추가할 수 있습니다. 또한 제품의 공급업체 필드와 같이 제품이 표시되는 제품에 따라 달라질 수 있는 다이나믹 소스를 추가할 수도 있습니다.

    제품 정보 섹션의 텍스트 블록에 대한 설정
    설정 설명
    텍스트 제품 페이지에 정보를 추가합니다. 텍스트 또는 다이나믹 소스를 지원합니다.
    텍스트 스타일

    텍스트 스타일을 변경합니다.

    • 본문 - 텍스트를 단락 스타일 텍스트로 변경합니다.
    • 소제목 - 텍스트를 단락 스타일 텍스트보다 약간 큰 소제목 텍스트로 변경합니다.
    • 대문자 - 텍스트를 단락 스타일 텍스트보다 작게 변경하고 모든 문자를 대문자로 표시합니다.

    제목 블록

    이 블록에는 제품 이름이 표시됩니다. 조정 가능한 설정이 없습니다.

    가격 블록

    이 블록에는 가격 및 비교 가격과 같은 제품의 가격 책정 정보가 표시됩니다. 조정 가능한 설정은 없습니다.

    이형 상품 피커 블록

    이 블록은 제품의 이형 상품 옵션을 표시합니다.

    제품 정보 섹션의 이형 상품 피커 블록에 대한 설정
    설정 설명
    유형

    이형 상품이 고객에게 표시되는 방식을 변경합니다.

    • 타원형 - 이형 상품을 클릭 가능한 버튼으로 표시합니다. 견본 또는 텍스트로만 표시할 수 있습니다.
    • 드롭다운 - 확장 가능한 드롭다운 메뉴에 이형 상품을 표시합니다. 견본 또는 텍스트로만 표시할 수 있습니다.

    구매 버튼 블록

    이 블록은 "카트에 추가" 버튼 및 모든 매장 내 픽업 정보를 표시합니다. 또한 모든 동적 결제 버튼을 표시합니다.

    제품 정보 섹션의 구매 버튼 블록에 대한 설정
    설정 설명
    동적 결제 버튼 표시 결제 설정에서 활성화한 모든 동적 결제 옵션을 표시합니다.
    기프트 카드 제품의 수취인 정보 양식 표시 고객이 개인 메시지와 함께 수취인에게 기프트 카드를 보내고 예약할 수 있는 기프트 카드 제품에 선택적인 확인란을 표시합니다.

    설명 블록

    이 블록에는 제품 설명이 표시됩니다. 조정 가능한 설정이 없습니다.

    제품 평점 블록

    이 블록은 별점으로 평균 제품 평가를 표시하고 괄호 안에 리뷰 수(예: ★★★★★(8))를 나타냅니다.

    제품 평점을 표시하려면 Shopify 제품 리뷰와 같은 제품 리뷰 앱과 reviews.rating_countreviews.rating에 대한 메타 필드 정의가 필요합니다.

    보완 제품 블록

    이 블록에 표시되는 보완 제품은 Shopify Search & Discovery 앱을 사용해 설정해야 합니다.

    제품 정보 섹션에서 보완 제품 블록의 설정
    설정 설명
    제목

    블록의 제목입니다.

    축소 가능한 행으로 표시

    이 옵션을 선택하면 행 탭 아래에 콘텐츠가 축소되어 표시됩니다. 고객이 제목을 클릭하면 탭이 확장되어 콘텐츠가 추가로 표시됩니다.

    아이콘

    보완 제품이 축소되어 표시되는 경우 제목에 연결할 아이콘을 선택합니다.

    표시할 제품의 최대 수

    표시할 보완 제품의 최대 수를 선택합니다. 최소 1개부터 최대 10개까지 선택할 수 있습니다.

    페이지당 제품 수

    슬라이더 페이지 1개당 표시할 보완 제품 수입니다. 값은 1~4 중에서 선택합니다.

    페이지 매김 스타일

    이미지 아래에 나타나는 슬라이더 탐색의 스타일입니다.

    • 카운터(기본값)
    • 번호
    이미지 비율

    제품 카드 이미지의 가로 세로 비율을 지정합니다.

    • 세로형
    • 정사각형(기본값)
    빠른 추가 버튼 표시

    "빠른 추가" 버튼을 사용하면 고객이 제품 카드에서 품목을 선택해 카트에 추가할 수 있습니다. 제품에 이형 상품이 있으면 버튼에 옵션 선택이 표시되고 팝업에 관련 제품 세부 정보가 표시됩니다. 고객은 이형 상품을 선택하여 카트에 추가할 수 있고, 지금 구매하기 옵션을 사용해 바로 결제하거나 품목을 클릭하여 세부 정보를 볼 수 있습니다. 지금 구매하기 옵션은 제품 페이지에서 별도로 설정해야 빠른 추가 옵션에 표시됩니다. 지금 구매하기 옵션이 설정되지 않아도 고객은 품목을 카트에 추가할 수 있습니다.

    블록 공유

    이 블록에는 고객이 소셜 미디어에서 제품을 공유할 수 있는 클릭 가능한 링크가 표시됩니다.

    제품 정보 섹션의 공유 블록에 대한 설정
    설정 설명
    텍스트 고객이 클릭하여 제품을 소셜 미디어에 공유하는 클릭 가능한 텍스트입니다.

    SKU 블록

    이 블록에는 제품과 관련된 SKU(Stock Keeping Unit)가 표시됩니다(해당하는 경우).

    제품 정보 섹션의 SKU 블록에 대한 설정
    설정 설명
    텍스트 스타일

    텍스트 스타일을 변경합니다.

    • 본문 - 텍스트를 단락 스타일 텍스트로 변경합니다.
    • 소제목 - 텍스트를 단락 스타일 텍스트보다 약간 큰 소제목 텍스트로 변경합니다.
    • 대문자 - 텍스트를 단락 스타일 텍스트보다 작게 변경하고 모든 문자를 대문자로 표시합니다.

    텍스트 포함 아이콘 블록

    이 블록에는 텍스트 포함 아이콘이 3개까지 표시됩니다. 표준 로고 중에서 선택하거나 자체 로고 이미지를 선택할 수 있습니다.

    제품 정보 섹션의 텍스트 포함 아이콘 블록에 대한 설정
    설정 설명
    레이아웃 이 섹션에 대해 가로 레이아웃 또는 세로 레이아웃 중에서 선택합니다.
    첫 번째 아이콘 표준 아이콘을 선택합니다.
    첫 번째 이미지 첫 번째 아이콘에 대한 이미지를 선택합니다. 이미지를 선택하면 첫 번째 아이콘 설정에서 선택한 아이콘보다 우선 적용됩니다. 이미지 선택을 클릭하여 이미지를 선택하거나 변경 버튼을 클릭하여 이미지를 변경 또는 제거합니다.
    대체 텍스트 편집 SEO를 개선하거나 화면 리더를 사용하는 고객에게 이미지 설명을 제공하기 위해 간단한 이미지 설명을 추가합니다.
    첫 번째 제목 첫 번째 아이콘에 대한 제목을 추가합니다.
    두 번째 아이콘 표준 아이콘을 선택합니다.
    두 번째 이미지 두 번째 아이콘에 대한 이미지를 선택합니다. 이미지를 선택하면 두 번째 아이콘 설정에서 선택한 아이콘보다 우선 적용됩니다. 이미지 선택을 클릭하여 이미지를 선택하거나 변경 버튼을 클릭하여 이미지를 변경 또는 제거합니다.
    대체 텍스트 편집 SEO를 개선하거나 화면 리더를 사용하는 고객에게 이미지 설명을 제공하기 위해 간단한 이미지 설명을 추가합니다.
    두 번째 제목 두 번째 아이콘에 대한 제목을 추가합니다.
    세 번째 아이콘 표준 아이콘을 선택합니다.
    세 번째 이미지 세 번째 아이콘에 대한 이미지를 선택합니다. 이미지를 선택하면 세 번째 아이콘 설정에서 선택한 아이콘보다 우선 적용됩니다. 이미지 선택을 클릭하여 이미지를 선택하거나 변경 버튼을 클릭하여 이미지를 변경 또는 제거합니다.
    대체 텍스트 편집 SEO를 개선하거나 화면 리더를 사용하는 고객에게 이미지 설명을 제공하기 위해 간단한 이미지 설명을 추가합니다.
    세 번째 제목 세 번째 아이콘에 대한 제목을 추가합니다.

    재고 상태 블록

    이 블록에는 제품의 재고 상태가 표시됩니다.

    제품 정보 섹션의 재고 상태 블록에 대한 설정
    설정 설명
    텍스트 스타일 텍스트의 스타일을 선택합니다. 본문, 부제목 또는 대문자 중에서 선택합니다.
    재고 부족 임계값 슬라이더를 사용하여 제품 재고가 부족한 경우를 표시하는 임계값을 0에서 100 사이로 설정합니다. 슬라이더를 0으로 설정하면 재고가 완전히 품절될 때까지 항상 사용 가능으로 표시됩니다.
    재고 수 표시 제품의 재고가 있는 재고 수를 표시하려면 이 옵션을 선택합니다.

    수량 선택기 블록

    이 블록은 고객이 구매할 제품의 수량 단위를 변경하기 위해 사용할 수 있는 수량 선택기를 표시합니다. 조정 가능한 설정은 포함하지 않습니다. 기본 수량은 1입니다.

    사용자 지정 Liquid 블록

    이 블록에는 블록에 추가할 수 있는 사용자 지정 Liquid 또는 HTML 코드가 표시됩니다.

    제품 정보 섹션의 사용자 지정 Liquid 블록에 대한 설정
    설정 설명
    사용자 지정 Liquid Liquid 또는 HTML 코드로 입력할 수 있는 콘텐츠를 표시합니다.

    축소 가능 탭 블록

    이 블록은 제목이 있는 축소 가능한 탭을 표시합니다. 고객이 제목을 클릭하면 탭이 확장되어 추가 콘텐츠가 표시됩니다.

    제품 정보 섹션의 축소 가능한 탭 블록에 대한 설정
    설정 설명
    제목 탭의 제목입니다. 축소 및 확대 시 표시됩니다.
    탭 콘텐츠 탭의 콘텐츠입니다. 탭이 확장된 경우에만 표시됩니다.
    페이지의 탭 콘텐츠 탭에 있는 페이지의 콘텐츠를 표시합니다. 페이지 편집기에서 페이지 콘텐츠만 표시하고 페이지 템플릿의 Liquid 스타일 지정이 이 블록에 표시됩니다. 탭 콘텐츠에 입력된 모든 콘텐츠는 페이지 콘텐츠 위에 표시됩니다.

    팝업 블록

    이 블록은 클릭했을 때 팝업 창을 열어 주는 클릭 가능한 텍스트를 표시합니다. 이 팝업은 페이지 중 하나의 콘텐츠를 표시합니다.

    제품 정보 섹션의 팝업 블록에 대한 설정
    설정 설명
    링크 레이블 고객이 클릭하여 팝업 창을 표시하는 클릭 가능한 텍스트입니다.
    페이지 팝업 창에 표시할 콘텐츠가 포함된 페이지입니다. 페이지 편집기의 페이지 콘텐츠만 표시합니다. 페이지 템플릿의 Liquid 스타일은 팝업에 표시되지 않습니다.

    SKU 블록

    이 블록에는 이형 상품과 연결된 SKU(Stock Keeping Unit)가 있으면 제품의 SKU가 표시됩니다. 관리자에서 제품 이형에 SKU 번호를 추가하는 방법을 자세히 알아보십시오.

    텍스트 포함 아이콘 블록

    이 블록에는 사전 설치한 아이콘 목록이나 업로드한 이미지에서 선택할 수 있는 아이콘이 3개까지 표시됩니다. 이미지 업로드를 선택하면 업로드한 이미지가 아이콘 드롭다운 선택보다 우선 적용됩니다.

    아이콘 레이아웃의 경우 세로 또는 가로를 선택할 수 있습니다. 아이콘을 삭제하려면 제목 필드를 지우십시오. 아이콘을 3개 이상 표시하려면 다른 텍스트 포함 아이콘 블록을 추가하십시오.

    재고 상태 블록

    이 블록에는 재고 있음, 재고 부족 또는 품절 등의 제품 재고 상태가 표시됩니다. 기본적으로 재고 부족 임계값은 10으로 설정됩니다. 재고 부족 임계값을 0에서 100 사이의 숫자로 변경할 수 있습니다. 재고 수 표시 확인란을 선택하면 재고가 있는 품목의 정확한 수가 고객에게 표시됩니다.

    품목이 품절되면 품절 상태가 표시됩니다. 그러나 품절 시 계속 판매를 선택한 경우 재고가 0 이하가 된 후에도 재고 있음 재고 상태가 계속 표시됩니다.

    제품 추천 섹션 설정

    현재 조회되고 있는 제품을 기준으로 유사한 제품이나 설명이 비슷한 제품, 이 제품과 주로 함께 구매되는 제품이 이 섹션에 표시됩니다.

    제품 추천 섹션에 대한 설정
    설정 설명
    제목 섹션의 제목입니다. 섹션 제목에 동적 소스를 사용할 수 있습니다.
    제목 사이즈 제목 텍스트의 사이즈를 변경합니다. 작게, 보통, 크게 중에서 선택합니다.
    표시할 제품의 최대 수 범위 슬라이더를 사용하여 표시하는 권장 제품의 최대 수를 선택합니다. 최소: 2. 최대: 10
    데스크톱의 열 수 데스크톱 컴퓨터에 표시되는 열의 수입니다. 최소: 1. 최대: 4.
    색상 배합 이 섹션에 적용할 수 있는 색상의 집합입니다. 색상 구성표에 대해 자세히 알아보십시오.
    이미지 비율 권장 제품의 이미지에 대한 이미지 비율:
    • 이미지에 맞춤 - 이미지의 가로 세로 비율을 사용합니다. 이렇게 하면 이미지가 잘리는 것을 방지합니다.
    • 세로형 - 2:3 비율을 사용하도록 이미지를 자릅니다.
    • 정사각형 - 1:1 비율을 사용하도록 이미지를 자릅니다.
    마우스를 올리면 보조 배경 표시 고객이 커서를 이미지 위에 올리면 제품에 두 번째 이미지가 있는 경우 해당 이미지를 표시합니다.
    공급업체 표시 각 제품의 공급업체를 표시합니다.
    제품 평점 표시 별점으로 평균 제품 평가를 표시하고 괄호 안에 리뷰 수(예: ★★★★★(8))를 나타냅니다. Shopify 제품 리뷰와 같은 제품 리뷰 앱과 리뷰.평점_수에 대한 메타 필드 정의가 필요합니다. 리뷰.평점에 대한 정의도 있어야 합니다.
    모바일의 열 수 모바일 장치의 구체적인 열 레이아웃을 설정합니다. 1~2열 중에서 선택합니다.
    섹션 패딩 섹션의 상단이나 하단에 간격을 추가합니다. 범위 슬라이더를 사용하여 0px~100px의 공백을 섹션의 위 또는 아래에 추가할 수 있습니다.

    제품 추천에 대해 자세히 알아보려면 제품 추천 이해를 참조하십시오.

    빠른 주문 목록 섹션 설정

    제품 템플릿에 빠른 주문 목록 섹션을 추가하면 고객이 서로 다른 제품 이형에서 여러 제품 수량의 대량 주문을 손쉽게 구매할 수 있습니다.

    빠른 주문 목록 섹션의 설정
    설정 설명
    색상 배합 이 섹션에 적용할 수 있는 색상의 집합입니다. 색상 구성표에 대해 자세히 알아보십시오.
    섹션 패딩 섹션의 상단이나 하단에 간격을 추가합니다. 범위 슬라이더를 사용하여 0px~100px의 공백을 섹션의 위 또는 아래에 추가할 수 있습니다.
    이미지 표시 이형 상품 이미지가 표시됩니다.
    SKU(재고 관리 코드) 표시 이형 상품 SKU(재고 관리 코드)를 표시합니다.

    제품 페이지에 빠른 주문 목록 섹션을 추가하는 방법을 자세히 알아보십시오.

    컬렉션 페이지

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

    컬렉션 배너 섹션 설정

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

    제품 그리드 섹션 설정

    제품 그리드 섹션에 대한 설정
    설정 설명
    페이지당 제품 각 페이지에 표시할 제품 수입니다. 8에서 24까지 4의 배수일 수 있습니다. 기본값은 16입니다.
    데스크톱의 열 수 범위 척도를 사용하여 데스크톱 컴퓨터에 표시되는 열 수를 선택합니다. 최소: 1. 최대: 5.
    이미지 비율 제품 이미지의 이미지 비율:
    • 이미지에 맞춤(기본값) - 이미지의 가로 세로 비율을 사용합니다. 이렇게 하면 이미지가 잘리는 것을 방지합니다.
    • 세로형 - 2:3 비율을 사용하도록 이미지를 자릅니다.
    • 정사각형 - 1:1 비율을 사용하도록 이미지를 자릅니다.
    이미지 모양 제품 이미지에 대해 다음 이미지 모양 중 하나를 선택합니다.
    • 기본 - 제품 이미지를 직사각형 모양으로 변경합니다.
    • 아치 - 제품 이미지 위쪽을 곡선으로 만듭니다.
    • 블롭 - 제품 이미지를 마우스를 올릴 때 고유한 애니메이션이 있는 6개의 무작위 블롭 모양 중 하나로 둥글게 만듭니다.
    • 왼쪽 방향 표시 - 제품 이미지를 왼쪽으로 급격하게 휘어진 갈매기 모양으로 변경합니다.
    • 오른쪽 방향 표시 - 제품 이미지를 오른쪽으로 급격하게 휘어진 갈매기 모양으로 변경합니다.
    • 다이아몬드 - 제품 이미지를 4면 다이아몬드 모양으로 변경합니다.
    • 평행사변형 - 제품 이미지를 두 쌍의 평행선이 있는 모양으로 변경합니다.
    • 원형 - 제품 이미지를 마우스를 올릴 때 고유한 애니메이션이 있는 원이나 타원 모양으로 둥글게 만듭니다.
    마우스를 올리면 보조 배경 표시 고객이 커서를 제품 이미지 위에 올리면 두 번째 제품 이미지가 표시됩니다(제품에 포함된 경우).
    공급업체 표시 각 제품의 공급업체를 표시합니다.
    제품 평점 표시 별점으로 평균 제품 평가를 표시하고 괄호 안에 리뷰 수(예: ★★★★★(8))를 나타냅니다. Shopify 제품 리뷰와 같은 제품 리뷰 앱과 리뷰.평점_수에 대한 메타 필드 정의가 필요합니다. 리뷰.평점에 대한 정의도 있어야 합니다.
    빠른 추가 버튼 활성화 빠른 추가 버튼을 사용하면 고객이 제품 카드에서 카트에 품목을 추가할 수 있습니다. 제품에 이형 상품이 있는 경우 버튼에 옵션 선택이 표시되며 팝업으로 제품 세부 정보를 표시합니다. 이 팝업에서 고객은 원하는 이형 상품을 선택하고, 카트에 품목을 추가하고, 지금 구매하기를 통해 즉시 결제하거나 클릭하여 품목의 전체 세부 정보를 확인할 수 있습니다. 이 설정은 지금 구매하기 버튼이 제품 페이지에서 활성화되었는지에 따라 달라집니다. 제품 템플릿에서 지금 구매하기 버튼이 활성화되지 않은 경우 고객은 카트에 제품을 추가하는 옵션을 사용할 수 있지만 빠른 지금 구매하기 결제 워크플로는 표시되지 않습니다. 빠른 추가 모달에서 미디어가 어느 쪽에 표시될지는 페이지의 데스크톱 미디어 위치 설정에 따라 결정됩니다.
    필터 사용 고객이 탐색 설정의 필터에 따라 컬렉션의 제품을 필터링할 수 있습니다.
    데스크톱 필터 레이아웃 가로(기본값), 세로 또는 서랍형 레이아웃 중 선택합니다.
    정렬 사용 고객이 검색 결과를 정렬할 수 있습니다.
    모바일의 열 수 모바일 장치의 구체적인 열 레이아웃을 설정합니다. 1~2열 중에서 선택합니다.
    섹션 패딩 제품 그리드의 상단이나 하단에 간격을 추가합니다. 범위 슬라이더를 사용하여 0px~100px의 공백을 제품 그리드의 위 또는 아래에 추가할 수 있습니다.

    컬렉션 목록 페이지

    컬렉션 목록 페이지에는 온라인 스토어 판매 채널에서 사용 가능한 모든 컬렉션이 표시됩니다.

    컬렉션 목록 페이지에 대한 설정
    설정 설명
    제목 페이지의 제목입니다.
    컬렉션 정렬 기준

    컬렉션을 표시할 순서를 결정합니다.

    • 알파벳순(A-Z) - 컬렉션을 알파벳순으로 표시합니다.
    • 알파벳순(Z-A) - 컬렉션을 알파벳 역순으로 표시합니다.
    • 날짜(최신 날짜부터) - 스토어에서 각 컬렉션이 생성된 날짜에 따라 최근 컬렉션부터 가장 오래된 컬렉션으로 표시합니다.
    • 날짜(오래된 날짜부터) - 스토어에서 각 컬렉션이 생성된 날짜에 따라 가장 오래된 컬렉션부터 최근 컬렉션으로 표시합니다.
    • 제품 개수(높은 개수부터) - 포함된 제품 수에 따라 컬렉션을 가장 높은 개수부터 가장 낮은 개수로 표시합니다.
    • 제품 개수(낮은 개수부터) - 포함된 제품 수에 따라 컬렉션을 가장 낮은 개수부터 가장 높은 개수로 표시합니다.
    이미지 비율 컬렉션 이미지의 이미지 비율:
    • 이미지에 맞춤(기본값) - 이미지의 가로 세로 비율을 사용합니다. 이렇게 하면 이미지가 잘리는 것을 방지합니다.
    • 세로형 - 2:3 비율을 사용하도록 이미지를 자릅니다.
    • 정사각형 - 1:1 비율을 사용하도록 이미지를 자릅니다.
    데스크톱의 열 수 데스크톱 컴퓨터에 표시되는 열의 수입니다. 최소: 1. 최대: 5.
    모바일의 열 수 모바일 장치의 구체적인 열 레이아웃을 설정합니다. 1~2열 중에서 선택합니다.

    페이지

    Shopify Admin에서 사용자 지정 페이지를 생성하여 고객용 콘텐츠(예: 정보 페이지 또는 제품에 관한 추가 정보)를 만들 수 있습니다. 이러한 페이지에는 테마 편집기 내에 추가 설정이 없습니다.

    블로그 페이지

    블로그 페이지는 Shopify Admin 내에서 생성한 모든 블로그의 홈페이지입니다. 기본적으로 블로그 게시물 섹션이 포함되어 있습니다.

    블로그 게시물 섹션 설정

    블로그 게시물 섹션에는 블로그의 최신 게시물이 표시됩니다. 각 블로그 게시물에는 블로그 이미지, 블로그 제목, 블로그 게시물의 요약 또는 처음 몇 단어가 표시됩니다. 큰 화면에서는 블로그 게시물을 그리드 형식 또는 콜라주 형식으로 표시하도록 선택할 수 있습니다.

    블로그 게시물 섹션에 대한 설정
    설정 설명
    큰 화면 레이아웃 블로그 게시물을 그리드 또는 콜라주 형식으로 표시합니다.
    추천 이미지 표시 블로그 게시물의 추천 이미지를 표시합니다.
    추천 이미지 높이 드롭다운 메뉴를 사용하여 기본 이미지에 맞춤, 소형, 중형, 대형 중에서 선택할 수 있습니다.
    날짜 표시 각 블로그 게시물에 대해 블로그 게시물이 게시된 날짜를 표시합니다.
    작성자 표시 각 블로그 게시물에 대해 블로그 게시물의 작성자를 표시합니다.

    블로그 게시물 페이지

    블로그 게시물 페이지에는 블로그 게시물의 콘텐츠가 표시됩니다. 기본적으로 블로그 게시물 섹션이 포함되어 있습니다. 블로그 게시물 섹션 자체에는 사용자 지정 가능한 설정이 없지만 다음 기본 블록이 포함되어 있습니다.

    • 추천 이미지
    • 제목
    • 공유
    • 콘텐츠

    추천 이미지 블록

    블로그 게시물 페이지의 추천 이미지 블록에 대한 설정
    설정 설명
    추천 이미지 높이

    블로그 게시물의 추천 이미지 높이를 결정합니다.

    • 이미지에 맞춤(기본) - 이미지의 원래 가로 세로 비율을 유지합니다.
    • 이미지 규격은 아래에 나열되어 있습니다. 소형, 중형 또는 대형 추천 이미지 중에서 선택합니다.

    추천 이미지 사이즈

    블로그 게시물 페이지의 추천 이미지 블록 사이즈
    소형 카드 대형 카드
    소형 추천 이미지 높이

    • 데스크톱 - 177px
    • 태블릿 - 143px
    • 모바일 - 해당 없음
    대형 추천 이미지 높이

    • 데스크톱 - 275px
    • 태블릿 - 220px
    • 모바일 - 110px
    중형 추천 이미지 높이

    • 데스크톱 - 307px
    • 태블릿 - 219px
    • 모바일 - 해당 없음
    중형 추천 이미지 높이

    • 데스크톱 - 550px
    • 태블릿 - 440px
    • 모바일 - 220px
    대형 추천 이미지 높이

    • 데스크톱 - 407px
    • 태블릿 - 275px
    • 모바일 - 해당 없음
    대형 추천 이미지 높이

    • 데스크톱 - 825px
    • 태블릿 - 660px
    • 모바일 - 330px

    제목 블록

    블로그 게시물 페이지의 제목 블록에 대한 설정
    설정 설명
    날짜 표시 블로그 게시물이 게시된 날짜를 표시합니다.
    작성자 표시 블로그 게시물의 작성자를 표시합니다.

    블록 공유

    이 블록은 고객이 소셜 미디어에서 블로그 게시물을 공유할 수 있는 클릭 가능한 링크를 표시합니다.

    블로그 게시물 페이지의 공유 블록에 대한 설정
    설정 설명
    텍스트 고객이 클릭하여 블로그 게시물을 소셜 미디어에 공유하는 클릭 가능한 텍스트입니다.

    콘텐츠 블록

    콘텐츠 블록에는 블로그 게시물의 콘텐츠가 표시됩니다. 사용자 지정 가능한 설정이 없습니다.

    카트 페이지

    기본적으로 카트 페이지에는 품목소계 섹션이 있습니다.

    품목 섹션 설정

    품목 섹션은 고객이 카트에 추가한 제품 및 수량을 표시합니다.

    카트 페이지의 품목 섹션에 대한 설정
    설정 설명
    공급업체 표시 카트에 있는 각 제품의 공급업체를 표시합니다.

    소계 섹션 설정

    소계 섹션에는 소계 가격결제 버튼 블록이 있습니다. 두 블록은 모두 사용자 지정 가능한 설정이 없습니다.

    카트 페이지의 소계 섹션에 대한 설정
    설정 설명
    카트 참고 사항 사용 고객이 추가 정보를 입력할 수 있는 카트 참고 사항 필드를 표시합니다.

    비밀번호 페이지

    비밀번호 보호가 온라인 스토어에 설정되어 있고 고객이 웹사이트를 방문할 때 비밀번호 페이지가 표시됩니다. 이 페이지에는 고유 머리글 및 바닥글이 있고 기본적으로 이메일 가입 섹션이 있습니다.

    비밀번호 머리글 섹션

    비밀번호 페이지의 비밀번호 헤더 섹션에 대한 설정
    설정 설명
    색상 배합 이 섹션에 적용할 수 있는 색상의 집합입니다. 색상 구성표에 대해 자세히 알아보십시오.

    이메일 가입 섹션

    이 섹션은 고객이 비즈니스 개시일과 같이 비즈니스에 대해 자세히 알아볼 수 있도록 이메일 마케팅에 가입할 수 있는 방법을 제공합니다.

    비밀번호 페이지의 이메일 가입 섹션에 대한 설정
    설정 설명
    색상 배합 이 섹션에 적용할 수 있는 색상의 집합입니다. 색상 구성표에 대해 자세히 알아보십시오.
    섹션을 전체 폭 사용 섹션을 브라우저 창의 폭으로 확장합니다.

    제목 블록

    비밀번호 페이지의 비밀번호 머리글 섹션에 있는 제목 블록에 대한 설정
    설정 설명
    제목 섹션 제목입니다.

    소제목 블록

    비밀번호 페이지의 비밀번호 머리글 섹션에 있는 제목 블록에 대한 설정
    설정 설명
    설명 섹션의 텍스트 콘텐츠입니다.

    이메일 양식 블록

    이 블록은 고객이 이메일 주소를 입력할 수 있는 이메일 양식 필드를 표시합니다. 이 블록에는 사용자 지정 가능한 설정이 없습니다.

    비밀번호 바닥글 섹션

    비밀번호 페이지의 비밀번호 바닥글 섹션에 대한 설정
    설정 설명
    색상 배합 이 섹션에 적용할 수 있는 색상의 집합입니다. 색상 구성표에 대해 자세히 알아보십시오.

    404 페이지

    404 페이지는 스토어에서 삭제된 제품의 제품 페이지와 같이 존재하지 않는 사이트 링크를 고객이 방문하려고 시도할 때 표시됩니다. 이 페이지에는 사용자 지정 가능한 설정이 없습니다.

    검색 페이지

    검색 페이지에서는 고객이 온라인 스토어 내에서 특정 제품 또는 페이지를 검색할 수 있습니다. 이 페이지에는 기본적으로 검색 결과 섹션이 포함되어 있습니다.

    검색 결과 섹션 설정

    검색 결과 섹션에 대한 설정
    설정 설명
    데스크톱의 열 수 데스크톱 컴퓨터에 표시되는 열의 수입니다. 최소: 1. 최대: 5.
    이미지 비율 권장 제품의 이미지에 대한 이미지 비율:
    • 이미지에 맞춤(기본값) - 이미지의 가로 세로 비율을 사용합니다. 이렇게 하면 이미지가 잘리는 것을 방지합니다.
    • 세로형 - 2:3 비율을 사용하도록 이미지를 자릅니다.
    • 정사각형 - 1:1 비율을 사용하도록 이미지를 자릅니다.
    이미지 모양 제품 이미지에 대해 다음 이미지 모양 중 하나를 선택합니다.
    • 기본 - 제품 이미지를 직사각형 모양으로 변경합니다.
    • 아치 - 제품 이미지 위쪽을 곡선으로 만듭니다.
    • 블롭 - 제품 이미지를 마우스를 올릴 때 고유한 애니메이션이 있는 6개의 무작위 블롭 모양 중 하나로 둥글게 만듭니다.
    • 왼쪽 방향 표시 - 제품 이미지를 왼쪽으로 급격하게 휘어진 갈매기 모양으로 변경합니다.
    • 오른쪽 방향 표시 - 제품 이미지를 오른쪽으로 급격하게 휘어진 갈매기 모양으로 변경합니다.
    • 다이아몬드 - 제품 이미지를 4면 다이아몬드 모양으로 변경합니다.
    • 평행사변형 - 제품 이미지를 두 쌍의 평행선이 있는 모양으로 변경합니다.
    • 원형 - 제품 이미지를 마우스를 올릴 때 고유한 애니메이션이 있는 원이나 타원 모양으로 둥글게 만듭니다.
    마우스를 올리면 보조 배경 표시 고객이 커서를 제품 이미지 위에 올리면 두 번째 제품 이미지가 표시됩니다(제품에 포함된 경우).
    공급업체 표시 각 제품의 공급업체를 표시합니다.
    제품 평점 표시 별점으로 평균 제품 평가를 표시하고 괄호 안에 리뷰 수(예: ★★★★★(8))를 나타냅니다. Shopify 제품 리뷰와 같은 제품 리뷰 앱과 리뷰.평점_수에 대한 메타 필드 정의가 필요합니다. 리뷰.평점에 대한 정의도 있어야 합니다.
    필터 사용 검색 결과 필터링을 활성화하려면 클릭하십시오.
    데스크톱 필터 레이아웃 가로(기본값), 세로 또는 서랍형 레이아웃 중 선택합니다.
    정렬 사용 검색 결과 정렬을 활성화하려면 클릭하십시오.
    날짜 표시 각 블로그 게시물에 대해 블로그 게시물이 게시된 날짜를 표시합니다.
    작성자 표시 각 블로그 게시물에 대해 블로그 게시물의 작성자를 표시합니다.
    모바일의 열 수 모바일 장치의 구체적인 열 레이아웃을 설정합니다. 1~2열 중에서 선택합니다.
    섹션 패딩 검색 결과의 상단이나 하단에 간격을 추가합니다. 범위 슬라이더를 사용하여 0px~100px의 공백을 검색 결과의 위 또는 아래에 추가할 수 있습니다.

    Shopify와 함께 사업을 시작할 준비가 되셨습니까?

    무료 체험