테마 편집기에서 테마 블록 자동 생성

Shopify Magic에서는 AI(인공 지능)를 사용하여 판매자가 제공한 세부 정보를 기반으로 테마 편집기에서 새로운 테마 블록을 생성할 수 있습니다.

테마 블록 생성 시 고려 사항

테마 블록을 생성하기 위한 다음 고려 사항을 검토하세요.

  • AI가 생성한 코드는 항상 완벽하지 않을 수 있습니다. 경우에 따라 오류나 예상치 못한 결과, 또는 접근성이나 성능 모범 사례를 완전히 충족하지 못하는 코드가 생성될 수 있습니다. 생성된 블록이 기준을 충족하고 올바르게 작동하는지 검토하고, 이를 테스트하고 확인하는 것은 귀하의 책임입니다.
  • 테마 편집기 미리 보기에서 데스크톱 및 모바일 모두에 표시되는 블록 모양을 미리 봅니다.
  • 블록에 맞춤 설정이 포함된 경우, 블록을 추가한 후 테스트하여 예상대로 작동하는지 확인합니다.
  • 테마 모듈을 생성하면, 블록에 대한 새로운 Liquid 파일이 테마 코드의 블록 폴더에 추가됩니다. - 테마 블록은 Shopify의 템플릿 언어인 Liquid로 구성됩니다. 테마 블록 파일에는 HTML, CSS, JSON 및 JavaScript도 포함되어 있습니다. 테마 블록을 생성하면, 블록에 대한 새로운 Liquid 파일이 테마 코드의 블록 폴더에 추가됩니다.
    The theme code editor blocks folder
    - 생성된 테마 모듈을 코드로 수정하고 싶다면, 테마 코드를 편집할 수 있습니다. HTML과 CSS를 알고 있고 Liquid에 대한 기본적인 이해가 있는 경우에만 테마 코드를 편집하세요. - Shopify Magic으로 생성된 Liquid 파일은 독립적입니다. 새로운 버전이 테마 스토어에 게시되면 테마를 업데이트할 수 있습니다.

테마 블록 생성을 위한 자격 요건

테마 블록을 생성하기 위한 다음 요구 사항을 검토하세요.

가격 책정 플랜 요구 사항

스토어가 다음 가격 책정 플랜 중 하나를 이용해야 합니다.

  • 무료 체험
  • 기본
  • Grow
  • Advanced

이 기능은 Spotlight 테마를 사용하고 사용자 지정 테마 섹션이나 블록을 추가할 수 없는 Starter 플랜에서는 사용할 수 없습니다.

언어 요구 사항

계정의 기본 언어가 영어로 설정되어 있어야 합니다.

테마 호환성

테마 블록 생성 기능은 Shopify에서 제작한 테마(예:Shopify Theme Store의 무료 테마)에서만 사용할 수 있습니다. 사용 중인 테마는 테마 블록을 수용할 수 있는 섹션을 지원해야 합니다. 테마 모듈을 허용하는 섹션에 대해서만 블록을 생성할 수 있습니다.

다양한 블록 출처에 대해 자세히 알아보세요.

효과적인 프롬프트 작성을 위한 팁

생성된 블록의 품질은 종종 프롬프트의 품질에 따라 달라집니다. 프롬프트 작성에 대해 다음과 같은 모범 사례를 검토하세요.

구체적이고 설명이 포함된 형태로 작성

프롬프트는 5단어 이상을 포함하여 작성해야 합니다. 세부 정보가 더 많이 포함된 긴 프롬프트일수록 더 정확한 결과를 얻을 가능성이 높습니다.

예를 들어 이미지 및 텍스트 추가라고 입력하는 대신 왼쪽에 이미지가 있고 오른쪽에 제목, 단락 텍스트, '지금 쇼핑하기' 버튼이 있는 블록을 생성합니다. 모바일에서는 스택 형태로 표시됩니다.라고 입력합니다.

콘텐츠 요소 설명

제목, 단락, 이미지, 버튼, 양식, 아이콘 등 블록에 필요한 콘텐츠 유형을 나열합니다.

레이아웃 제안

블록 내 요소의 배치를 설명합니다(예: 나란히 배치, 그리드 배치, 가운데 배치, 행 번갈아 배치).

맞춤 설정 포함

테마 편집기에서 블록에 특정 편집 가능한 설정(예: 이미지, 텍스트 또는 버튼 링크 변경)을 적용하려면 프롬프트에 해당 설정을 포함합니다.

예를 들어 동영상이 있는 블록에 애니메이션 속도를 제어하는 설정을 포함하려면 애니메이션 속도를 제어하는 설정 포함을 입력합니다.

후속 지침으로 반복

첫 번째 결과가 적합하지 않으면 프롬프트를 더 세부적으로 조정하거나 다른 문구를 사용하여 다시 생성합니다.

예제 프롬프트

모범 사례를 따르는 다음 예제 프롬프트를 검토합니다.

  • 추천 블록: 고객 사진, 견적 텍스트, 고객 이름, 별점 5점 평가가 표시됩니다.
  • 나란히 배치된 기능 블록: 왼쪽에는 아이콘과 제목이 있고, 오른쪽에는 설명 텍스트가 포함됩니다.
  • 전체 너비의 배너: 배경 이미지, 가운데 배치된 큰 제목 텍스트, 그 아래에 작은 소제목 텍스트, 구매 유도 문구(CTA) 버튼이 포함됩니다.

테마 블록 생성

블록을 생성한 후 유지하기로 결정하면 새 블록이 블록 선택기에 추가됩니다. 테마 블록을 허용하는 호환 섹션에 블록을 추가할 수 있습니다.

단계:

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

  2. 편집하려는 테마를 찾은 다음 맞춤 설정을 클릭합니다.

  3. 홈페이지를 맞춤 설정하거나 홈페이지 드롭다운 메뉴를 탭한 다음 섹션을 추가할 템플릿을 선택합니다.

  4. 블록을 생성하려는 섹션을 클릭합니다.

  5. 블록 추가를 클릭합니다.

  6. 생성을 클릭합니다.

  7. 생성하려는 블록에 대한 설명을 입력합니다.

  8. 생성을 클릭합니다. Shopify Magic이 요청을 처리하고 코드를 생성합니다.

  9. 테마 편집기에서 생성된 블록을 직접 미리 봅니다. 맞춤 설정이 생성된 경우 블록을 맞춤 설정할 수 있습니다.

  10. 생성된 블록에 만족하는 경우 유지를 클릭합니다. 만족하지 않으면 블록을 삭제하거나 후속 지침을 제공할 수 있습니다.

테마에서 생성된 테마 블록 삭제

테마 블록을 생성하면 블록에 대한 새로운 Liquid 파일이 테마 코드의 블록 폴더에 추가됩니다. 생성된 테마 블록으로 인해 스토어에 문제를 발생하는 경우 테마 코드에서 Liquid 파일을 삭제하면 해당 블록을 삭제할 수 있습니다.

단계:

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

  2. 편집하려는 테마 옆의 사용자 지정을 클릭합니다.

  3. 홈페이지를 맞춤 설정하거나 홈페이지 드롭다운 메뉴를 탭한 다음 섹션을 추가할 템플릿을 선택합니다.

  4. 삭제하려는 블록이 포함된 섹션을 클릭합니다. 이전에 모든 블록 인스턴스를 제거한 경우 블록 추가를 클릭하여 블록 선택기에서 블록을 다시 추가합니다.

  5. 블록 설정에서 가로 메뉴 > 코드 코드 편집을 클릭합니다.

  6. 사이드바 메뉴에서 블록 폴더를 클릭하여 확장한 다음, 현재 보고 있는 블록 파일을 찾습니다. 해당 파일은 현재 열려 있는 블록의 이름과 일치하며, .liquid로 끝납니다.

    The theme code editor blocks folder and open theme blocks file to be deleted

  7. 사이드바 메뉴에서 블록 파일 옆에 있는 삭제 아이콘을 클릭합니다.

  8. 대화 상자에서 파일 삭제를 클릭하여 확인합니다.

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