섹션 및 블록

이 페이지는 Mar 26, 2023에 인쇄되었습니다. 최신 버전은 https://help.shopify.com/ko/manual/online-store/themes/theme-structure/sections-and-blocks에서 확인하십시오.

테마는 섹션을 사용하여 적합한 레이아웃을 생성합니다. 대부분의 섹션은 머리글, 텍스트, 단일 이미지, 이미지 콜라주 또는 링크와 같은 특정 기능을 제공하는 블록으로 구성됩니다. 템플릿에서 섹션과 블록을 사용하면 스토어 콘텐츠를 정렬하는 방식에 더 많은 유연성을 제공하므로 코드를 편집하지 않고도 온라인 스토어의 룩앤필을 제어할 수 있습니다. 각 템플릿은 최대 25개의 섹션을 포함할 수 있습니다.

각 섹션에는 추가할 수 있는 다양한 특정 블록이 있습니다. 섹션마다 최대 50개의 블록을 추가할 수 있습니다. 사용 가능한 섹션과 블록은 테마에 따라 다를 수 있습니다. 사용 가능한 옵션에 대한 자세한 내용은 테마 문서를 참조하십시오.

일부 섹션에는 추가할 수 있는 블록 수 제한 또는 특정 유형의 블록 수 제한이 있습니다. 예를 들어 텍스트 포함 이미지 섹션에는 테마 디자이너가 테마에 지정한 블록만 표시할 수 있습니다. 무료 Shopify 테마인 Dawn에 다음 블록 중 하나만 추가할 수 있습니다.

  • 제목
  • 단락
  • 버튼

이미지를 포함하도록 설정을 편집하여 섹션을 추가로 사용자 지정하고 고객이 온라인 스토어를 방문할 때 정렬, 크기, 배경 색상 및 먼저 로드할 항목을 선택할 수 있습니다.

스토어 레이아웃에 추가하는 섹션에 필요한 설정이나 옵션이 포함되지 않는 경우 테마 코드를 편집하거나 테마 개발자에게 지원을 문의할 수 있습니다.

섹션 및 블록으로 테마 템플릿 사용자 지정

테마 편집기를 열면 스토어의 홈페이지는 기본적으로 로드됩니다. 드롭다운 메뉴를 사용하여 다른 템플릿을 선택하거나 템플릿 드롭다운의 검색 표시줄을 사용하여 특정 페이지 유형을 검색할 수 있습니다. 템플릿을 선택하면 테마 편집기로 로드되며, 변경한 모든 변경 사항은 적용할 때 편집기에서 미리 볼 수 있습니다.

섹션 추가

온라인 스토어의 모든 페이지에 새 섹션을 추가합니다.

단계:

  1. Shopify 관리자에서 온라인 스토어 > 테마로 이동합니다.
  2. 편집하려는 테마를 찾은 다음 사용자 지정을 클릭합니다.
  1. Shopify 앱에서 스토어를 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 편집을 탭합니다.
  1. Shopify 앱에서 스토어를 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 편집을 탭합니다.
  1. 드롭다운 메뉴에서 템플릿을 선택합니다.
  2. + 섹션 추가를 클릭하고 목록에서 새 섹션을 선택하거나 검색 창에서 특정 용어를 검색합니다.
  3. 섹션 내 블록을 편집하려면 새 섹션을 클릭합니다.
  4. 선택 사항: 섹션 옆에 있는 ⋮⋮ 아이콘을 클릭하고 끌어서 페이지의 섹션을 재배치합니다.
  5. 저장을 클릭합니다.

섹션 편집

  1. Shopify 관리자에서 온라인 스토어 > 테마로 이동합니다.
  2. 편집하려는 테마를 찾은 다음 사용자 지정을 클릭합니다.
  1. Shopify 앱에서 스토어를 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 편집을 탭합니다.
  1. Shopify 앱에서 스토어를 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 편집을 탭합니다.
  1. 드롭다운 메뉴에서 편집할 섹션이 포함된 템플릿을 선택합니다.
  2. 섹션을 클릭하여 콘텐츠를 미리 보기 창에 로드하고 사용 가능한 옵션에 액세스합니다.
  3. 선택 사항: 개별 블록을 클릭하여 섹션 내 블록을 편집합니다.
  4. 저장을 클릭합니다.

섹션 또는 블록 제거

  1. Shopify 관리자에서 온라인 스토어 > 테마로 이동합니다.
  2. 편집하려는 테마를 찾은 다음 사용자 지정을 클릭합니다.
  1. Shopify 앱에서 스토어를 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 편집을 탭합니다.
  1. Shopify 앱에서 스토어를 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 편집을 탭합니다.
  1. 드롭다운 메뉴에서 편집할 섹션이 포함된 템플릿을 선택합니다.
  2. 섹션을 클릭하여 콘텐츠를 미리 보기 창에 로드하고 사용 가능한 옵션에 액세스합니다.
  3. 눈 아이콘을 클릭하여 섹션 또는 블록을 숨기거나 숨김 해제합니다.
  4. 제거를 클릭하여 블록 또는 섹션을 삭제합니다.

일부 섹션에는 고정 블록 유형 및 제한이 있습니다. 특정 섹션이나 블록에 제한이 있는 경우 인터페이스에는 사용 가능한 X개 블록 중 X개를 사용했음이 표시됩니다. 최대 블록 수를 사용했다면 기존 블록을 삭제하기 전까지는 블록을 더 추가할 수 없습니다.

블록으로 작업

블록은 페이지 템플릿 내 섹션을 구성하는 사용자 지정 가능한 모듈입니다. 블록을 사용하여 텍스트, 이미지, 링크, 버튼 등을 추가할 수 있습니다.

Shopify 테마에는 사용자 지정할 수 있는 섹션과 블록이 있습니다. 일부 섹션에는 고정 블록 유형이 있어서 테마 디자이너가 해당 섹션에서 사용 가능한 블록만 선택할 수 있습니다. 다른 섹션에서는 블록을 선택할 수 있지만 섹션에 추가할 수 있는 총 블록 수는 제한됩니다. 섹션이 사용 가능한 최대 블록 수에 도달하면 한계에 도달했다는 메시지가 표시되고 + 블록 추가 옵션은 기존 블록이 제거될 때까지 회색으로 표시됩니다.

블록 추가

  1. Shopify 관리자에서 온라인 스토어 > 테마로 이동합니다.
  2. 편집하려는 테마를 찾은 다음 사용자 지정을 클릭합니다.
  1. Shopify 앱에서 스토어를 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 편집을 탭합니다.
  1. Shopify 앱에서 스토어를 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 편집을 탭합니다.
  1. 드롭다운 메뉴에서 편집할 섹션이 포함된 템플릿을 선택합니다.
  2. 섹션을 클릭하여 콘텐츠를 미리 보기 창에 로드하고 사용 가능한 옵션에 액세스합니다.
  3. + 블록 추가를 클릭하고 새 블록을 선택하거나 검색 창을 클릭하여 검색어를 입력합니다.
  4. 저장을 클릭합니다.

메타 필드 및 다이나믹 소스 사용

메타 필드를 사용하면 온라인 스토어에 동적 정보를 표시할 수 있습니다. 메타 필드를 지원하는 테마가 있는 경우 테마 편집기에서 메타 필드를 섹션이나 블록에 연결할 수 있습니다.

예를 들어, 양초 판매자가 사용 가능한 각 유형의 양초에 대한 연소 시간을 표시하려는 경우, 판매자는 연소 시간의 제품 메타 필드를 설정한 후 제품 템플릿에 연소 시간에 대한 블록을 추가한 다음, 제품 메타 필드에 연결할 수 있습니다. 연소 시간을 나열하는 페이지에 컬렉션 메타 필드를 설정하고 나면 판매자가 컬렉션 템플릿에 블록을 추가하여 컬렉션 메타 필드에 연결할 수 있습니다.

다이나믹 소스를 사용할 수 있는 섹션이나 블록을 추가하여 온라인 스토어에 동적 정보를 표시할 수 있습니다. 다이나믹 소스는 제품 템플릿의 섹션 또는 블록에서 사용할 수 있습니다. 제품이 아닌 템플릿에서는 제품을 표시하는 섹션이나 블록에서 다이나믹 소스를 사용할 수 있습니다. 템플릿에서 연결하기 전에 메타 필드를 추가해야 합니다. 테마에서 메타 필드 및 다이나믹 소스 사용에 대한 자세한 내용은 다이나믹 소스를 참조하십시오.

설정 프로세스를 완료한 후 다음 단계를 수행하여 다이나믹 소스를 템플릿에 삽입합니다.

  1. Shopify 관리자에서 온라인 스토어 > 테마로 이동합니다.
  2. 편집하려는 테마를 찾은 다음 사용자 지정을 클릭합니다.
  1. Shopify 앱에서 스토어를 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 편집을 탭합니다.
  1. Shopify 앱에서 스토어를 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 편집을 탭합니다.
  1. 드롭다운 메뉴에서 편집할 섹션이 포함된 템플릿을 선택합니다.
  2. 기존 섹션을 클릭하여 콘텐츠를 미리 보기 창에 로드하고 사용 가능한 옵션에 액세스하거나 + 섹션 추가를 클릭합니다.
  3. + 블록 추가를 클릭한 다음, 다이나믹 소스를 연결합니다.
  • 다이나믹 소스 연결 아이콘이 표시되는 경우 아이콘을 클릭하면 단일 메타 필드를 선택할 수 있습니다.
    Connect dynamic source
  • 다이나믹 소스 연결 아이콘에 +가 표시된 경우 아이콘을 클릭하면 한 번에 하나씩 추가해 메타 필드를 20개까지 선택할 수 있습니다.
    Insert dynamic source icon
  1. 저장을 클릭합니다.

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

무료 체험