메타 객체 생성 및 연결

이 튜토리얼에서는 제품 하이라이트에 대한 사용자 지정 메타 객체를 생성하고 온라인 스토어에 표시하는 방법을 알아봅니다. 제품 하이라이트 메타 객체에는 이미지, 제품 이름, 캡션, 설명이 표시됩니다.

이 튜토리얼에서는 메타 객체 정의, 항목 생성, 메타 필드 참조 설정, 항목에 제품 연결, 마지막으로 온라인 스토어에 메타 객체 게시하기에 대해 소개합니다.

학습 내용

이 튜토리얼을 마치면 다음 작업을 완료하게 됩니다.

• 제품 하이라이트용 메타 객체 생성
• 생성한 메타 객체를 사용하여 제품 하이라이트용 여러 항목 생성
• 메타 객체를 참조하는 메타 필드 정의 생성
• 특정 제품에 항목 연결
• 메타 객체 항목 게시

1단계: 메타 객체 생성

1. Shopify 관리자에서 설정 > 메타 필드 및 메타 객체로 이동합니다.

2. 메타 객체 정의에서 정의 추가를 클릭합니다.

3. 메타 객체 정의의 이름을 Product highlights로 지정합니다.

4. 필드 추가를 클릭하고 이 메타 객체에 표시할 콘텐츠 유형을 선택합니다. 필드는 메타 객체에 표시되는 콘텐츠를 정의하며, 각 필드에는 고유한 옵션 및 유효성 검사 집합이 있습니다. 첫 번째 필드를 추가하려면 파일을 선택합니다.

5. 유형과 유효성 검사를 구성합니다. 필드 이름을 Image로 지정하고 간단한 설명을 입력합니다.

6. 액세스에서 스토어프론트가 자동으로 선택됩니다. 이 옵션을 선택된 상태로 유지해야 스토어에서 콘텐츠에 액세스하고 표시할 수 있습니다.

7. 메타 객체에 이미지 필드를 추가합니다. 필드 추가 > 파일을 선택합니다.

• 이 필드의 이름을 Image로 지정합니다.
• 이 메타 객체에 이미지만 표시되도록 동영상의 선택을 취소합니다.
• 설명을 입력합니다.
• 완료되면 추가를 클릭합니다.

8. 메타 객체에 제목 필드를 추가합니다. 이번에는 필드 유형으로 필드 추가 > 한 줄 텍스트를 선택하고 다음을 수행합니다.

• 이 필드의 이름을 Heading으로 지정합니다.
• 이 필드를 인덱스에서 항목 이름으로 사용하려면 이 필드를 표시 이름으로 사용을 선택합니다.
• 설명을 입력합니다.
• 완료되면 추가를 클릭합니다.

9. 메타 객체에 캡션 필드를 추가합니다. 필드 추가 > 한 줄 텍스트를 클릭하고 다음을 수행합니다.

• 이 필드의 이름을 Caption으로 지정합니다.
• 설명을 입력합니다.
• 완료되면 추가를 클릭합니다.

10. 메타 객체에 설명 필드를 추가합니다. 필드 추가 > 여러 줄 텍스트를 클릭하고 다음을 수행합니다.

• 이 필드의 이름을 Description으로 지정합니다.
• 설명을 입력합니다.
• 완료되면 추가를 클릭합니다.

11. 새 메타 객체 정의를 저장합니다.

메타 객체 정의가 저장되면 항목 생성을 시작할 수 있습니다.

2단계: 항목 생성

1. Shopify 관리자에서 콘텐츠를 클릭합니다.
2. 새 항목의 기반으로 삼을 Product highlights 메타 객체 정의를 클릭한 다음 항목 추가를 클릭합니다.
3. 항목의 필드를 입력합니다.
   • 이미지 선택을 클릭하고 이 제품 하이라이트에 사용할 이미지를 선택하거나 업로드합니다.
   • 제목과 설명을 추가합니다.
4. 상태는 자동으로 활성으로 설정됩니다. 항목을 사용할 준비가 되지 않은 경우 상태를 초안으로 변경할 수 있습니다.
5. 저장을 클릭합니다.

항목에는 생성된 핸들이 있으며, 이는 단일 콘텐츠 항목에 고유한 식별자입니다. 항목을 스토어의 여러 영역에 연결하기 시작한 후에는 핸들을 편집하지 않는 것이 좋습니다. 스토어에서 사용한 후 항목 핸들을 변경할 때의 영향에 대해 자세히 알아보십시오.

위 단계를 반복하여 제품 하이라이트 메타 객체 정의에 따라 항목 3개를 추가로 생성합니다.

메타 객체 정의와 항목을 저장한 후에는 메타 객체를 참조하는 메타 필드 정의를 생성할 수 있습니다.

3단계: 메타 객체를 참조하는 메타 필드 정의 생성

1. Shopify 관리자에서 설정 > 메타 필드 및 메타 객체로 이동합니다.

2. 메타 필드 섹션에서 제품을 클릭합니다.

3. 정의 추가를 클릭합니다. 고유한 이름과 설명을 입력한 다음 콘텐츠 유형 선택을 클릭합니다.

4. 유형 선택을 클릭한 다음 메타 객체를 선택합니다.

5. 참조 섹션에서 참조하려는 메타 객체 정의를 선택합니다. Product highlights를 선택합니다. 이렇게 하면 메타 필드 제품 정의가 제품 하이라이트 메타 객체와 관련된 항목만 표시하도록 제한됩니다.

6. 이 정의에 단일 항목을 표시할지 또는 항목 목록을 표시할지 정의합니다. 이 예에서는 항목 목록 옵션을 선택합니다.

7. 액세스 섹션에서 스토어프런트 옵션이 기본적으로 선택되어 있습니다.

8. 저장을 클릭합니다.

4단계: 제품을 항목에 연결하기

1. Shopify 관리자에서 제품으로 이동합니다.

2. 제품 하이라이트를 표시할 제품을 선택합니다.

3. 이 예시에서는 생성한 제품 하이라이트 항목 중 일부만 표시합니다. 제품 메타 필드 섹션에서 제품 하이라이트 메타 필드 옆의 항목 필드를 클릭하십시오. 메타 필드 목록에 제품 하이라이트가 없는 경우 모두 표시를 클릭하십시오.

4. 항목 선택을 클릭합니다. 이 단계에서는 해당 제품에 표시할 항목을 선택합니다. 제품 하이라이트 두 개를 선택하십시오.

5. 제품 페이지로 돌아갑니다. 다른 제품을 선택한 다음 이전 단계를 따라 두 개의 다른 제품 하이라이트 항목을 해당 제품에 할당하십시오.

다음으로 온라인 스토어에 메타 객체를 게시합니다.

5단계: 온라인 스토어에 항목 게시하기

항목을 제품에 연결했으므로 이제 스토어에 항목을 표시할 차례입니다. 이 단계에서는 테마 편집기를 사용하여 메타 객체 항목이 연결될 블록 및 섹션을 선택합니다.

섹션이나 블록을 추가한 후 버튼을 클릭하여 메타 필드를 선택할 수 있습니다.

단계:

1. Shopify 관리자에서 온라인 스토어 > 테마로 이동합니다.

2. 편집할 테마를 찾은 다음 테마 편집을 클릭합니다.

3. 화면 상단의 드롭다운 메뉴에서 제품 > 기본 제품을 선택합니다. 그러면 테마 편집기에 기본 제품 템플릿이 로드됩니다.

4. 사이드바에서 섹션 추가를 클릭하고 새 섹션 유형으로 다중 행을 선택합니다.

5. 다중 행 섹션의 첫 번째 행을 클릭합니다.

   • 첫 번째 블록에 대한 설정이 오른쪽 사이드바에 표시됩니다. 열 블록에서 이미지를 수동으로 선택하고, 머리글을 삽입하고, 캡션을 추가하고, 설명을 추가할 수 있습니다. 또한 각 개별 데이터 소스 아이콘을 클릭하여 블록 설정을 원하는 항목에 연결할 수 있습니다.

6. 블록 이름 옆의 동적 소스 연결을 클릭하여 제품 하이라이트를 선택합니다. 그러면 테마 편집기가 새 다중 행 블록을 제품 하이라이트 항목으로 채웁니다.

7. 다중 행 섹션의 나머지 블록을 구성하거나 사용하지 않는 블록을 제거합니다.

8. 저장을 클릭하여 제품 하이라이트 항목을 게시합니다.

항목은 연결된 제품에만 표시됩니다. 제품에 할당된 항목이 없는 경우 섹션이 완전히 제거되지 않고 공백으로 남습니다. 정확한 동작은 사용하는 테마 및 섹션에 따라 다를 수 있으므로 템플릿을 테스트하여 요구 사항을 충족하는지 확인하십시오.

제품에 항목이 없을 때 섹션이 원하는 대로 표시되지 않으면 새 제품 템플릿을 생성하여 항목이 있는 제품에 할당해 보십시오.