앱으로 테마 확장

을 설치하여 테마에 기능 및 통합을 추가할 수 있습니다. 앱은 Shopify App Store에서 찾을 수 있습니다.

앱은 다음과 같은 방법으로 테마와 통합될 수 있습니다.

  • 앱 블록으로: 앱 블록을 사용하면 테마에서 사용하려는 정확한 위치에 앱 기능을 추가할 수 있습니다. 테마 편집기를 통해 앱 블록을 추가, 제거, 미리 보기, 재배치, 사용자 지정할 수 있습니다.
  • 앱 임베드로: 앱 임베드는 테마에 플로팅되거나 오버레이로 표시되고, 고객에게는 보이지 않게 온라인 스토어에 코드를 추가하는 앱 제공 요소입니다. 테마 편집기를 통해 앱 임베드를 활성화, 비활성화, 미리 보기, 사용자 지정할 수 있습니다.
  • 사용자 지정 코드 추가: 일부 앱은 테마 코드에 직접 코드를 삽입하여 테마에 기능을 추가합니다. 앱 설정이나 테마 편집기를 사용하여 앱을 사용자 지정할 수 있습니다.

앱 블록

앱은 섹션의 블록으로 또는 템플릿의 섹션으로 추가할 수 있습니다. 이를 통해 페이지에서 사용하려는 정확한 위치에 앱 기능을 추가할 수 있습니다. 테마 편집기를 통해 앱 블록을 추가, 제거, 재배치, 사용자 지정할 수 있습니다.

앱 블록은 특정 페이지 유형과만 호환될 수 있습니다. 예를 들어 사이즈 차트 앱은 제품 페이지만 호환될 수 있습니다.

섹션에서 사용되는 앱 블록:

섹션에서 사용되는 앱 블록

템플릿에서 섹션으로 사용되는 앱 블록:

템플릿에서 섹션으로 사용되는 앱 블록

섹션의 앱 블록 지원

일부 테마 섹션에서는 앱 블록을 지원하지 않을 수 있습니다. 앱 블록을 지원하는 테마 섹션을 확인하려면 테마 설명서를 참조하거나 테마 개발자에게 문의하십시오.

섹션에서 앱 블록을 지원하고 호환되는 앱을 설치한 경우 블록 선택기에 섹션이 표시됩니다.

섹션에 앱 블록 추가

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

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

  3. 앱 블록을 추가하려는 페이지 및 섹션으로 이동합니다.

  4. 사이드바에서 블록 추가를 클릭합니다.

  5. 드롭다운 메뉴의 섹션에서 섹션에 추가하려는 앱 블록을 선택하거나 검색 창을 클릭하고 검색어를 입력하여 설치된 앱 중에서 검색합니다.

  6. 선택 사항: 아이콘을 클릭하고 끌어서 페이지의 다른 사용 가능한 위치로 블록을 이동합니다. 사용 가능한 설정을 사용하여 블록을 사용자 지정할 수도 있습니다.

  7. 저장을 클릭합니다.

모바일
  1. Shopify app에서 Menu 아이콘을 탭합니다.

  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.

  3. 모든 테마 관리를 탭합니다.

  4. 편집할 테마를 찾은 다음 테마 편집을 탭합니다.

  5. 편집을 탭합니다.

  6. 앱 블록을 추가하려는 페이지 및 섹션으로 이동합니다.

  7. 사이드바에서 블록 추가를 탭합니다.

  8. 드롭다운 메뉴의 섹션에서 섹션에 추가하려는 앱 블록을 선택하거나 검색 창을 탭하고 검색어를 입력하여 설치된 앱 중에서 검색합니다.

  9. 선택 사항: 아이콘을 탭하고 끌어 페이지의 다른 사용 가능한 위치로 블록을 이동합니다. 사용 가능한 설정을 사용하여 블록을 사용자 지정할 수도 있습니다.

  10. 저장 또는 를 탭합니다.

템플릿에 앱 블록 추가

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

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

  3. 앱 섹션을 추가하려는 페이지로 이동합니다.

  4. 사이드바에서 섹션 추가를 클릭합니다.

  5. 드롭다운 메뉴의 섹션에서 페이지에 추가할 앱을 선택하거나, 검색 막대를 클릭하고 텍스트를 입력하여 설치된 앱을 검색합니다.

  6. 선택 사항: 아이콘을 클릭하고 끌어서 페이지의 다른 사용 가능한 위치로 블록을 이동합니다. 사용 가능한 설정을 사용하여 블록을 사용자 지정할 수도 있습니다.

  7. 저장을 클릭합니다.

모바일
  1. Shopify app에서 Menu 아이콘을 탭합니다.

  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.

  3. 모든 테마 관리를 탭합니다.

  4. 편집할 테마를 찾은 다음 테마 편집을 탭합니다.

  5. 편집을 탭합니다.

  6. 앱 섹션을 추가하려는 페이지로 이동합니다.

  7. 사이드바에서 섹션 추가를 탭합니다.

  8. 드롭다운 메뉴의 섹션에서 페이지에 추가할 앱을 선택하거나, 검색 막대를 탭하고 텍스트를 입력하여 설치된 앱을 검색합니다.

  9. 선택 사항: 아이콘을 탭하고 끌어 페이지의 다른 사용 가능한 위치로 블록을 이동합니다. 사용 가능한 설정을 사용하여 블록을 사용자 지정할 수도 있습니다.

  10. 저장 또는 를 탭합니다.

앱이 섹션에 블록으로 추가됩니다. 섹션에 앱 블록을 더 추가할 수 있습니다. 페이지에 여러 섹션을 추가할 수도 있습니다.

앱 임베드

앱 임베드는 테마에서 플로팅되거나 오버레이로 표시되는 앱 제공 요소이거나 고객에게 보이지 않게 온라인 스토어에 코드를 추가하는 요소입니다. 예를 들어 스토어의 모서리에 표시되는 채팅 풍선 앱, 분석 또는 추적 앱 등을 앱 임베드로 스토어에 추가할 수 있습니다. 앱 임베드는 테마 편집기를 통해 활성화, 비활성화 및 사용자 지정을 할 수 있습니다. 앱 임베드는 모든 테마 버전에서 사용할 수 있습니다.

여러 시장이 있는 경우 각 시장에 맞게 앱 임베드를 사용자 지정할 수 있습니다. 예를 들어 북미 시장에서만 채팅 앱 임베드를 활성화하거나 시장별로 다른 앱 임베드 설정을 구성할 수 있습니다. 특정 시장에 맞게 앱 임베드를 사용자 지정하려면 앱 임베드를 활성화하거나 구성하기 전에 테마 편집기의 시장 드롭다운 메뉴에서 해당 시장을 선택하십시오. 특정 시장에 맞게 테마를 사용자 지정하는 방법에 대한 자세한 내용은 특정 시장 또는 Shopify B2B에 맞게 테마 조정을 참조하십시오.

앱 임베드 블록입니다.

앱 임베드 활성화

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

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

  3. 선택 사항: 특정 시장에 맞게 앱 임베드를 사용자 지정하려면 시장 드롭다운 메뉴를 클릭하고 사용자 지정할 시장을 선택하십시오. 시장을 선택하지 않으면 변경 사항이 스토어 기본값에 적용됩니다.

  4. 사이드바에서 앱 임베드 아이콘을 클릭합니다.

  5. 활성화할 앱 임베드를 선택하거나 검색 막대를 클릭하고 검색어를 입력하여 설치된 앱 중에서 검색합니다.

  6. 활성화하려는 앱 임베드 옆의 토글 버튼을 클릭하여 활성화합니다.

  7. 선택 사항: 앱 임베드 이름 옆의 확장 아이콘 을 클릭하여 앱 임베드 설정을 확인합니다.

  8. 저장을 클릭합니다.

  9. 스토어를 미리 보기하여 임베디드 앱이 실시간으로 표시되는지 확인합니다.

모바일
  1. Shopify app에서 Menu 아이콘을 탭합니다.

  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.

  3. 모든 테마 관리를 탭합니다.

  4. 편집할 테마를 찾은 다음 테마 편집을 탭합니다.

  5. 선택 사항: 특정 시장에 맞게 앱 임베드를 사용자 지정하려면 시장 드롭다운 메뉴를 탭하고 사용자 지정할 시장을 선택하십시오. 시장을 선택하지 않으면 변경 사항이 스토어 기본값에 적용됩니다.

  6. > 앱 임베드를 탭합니다.

  7. 활성화하려는 앱 임베드를 선택하거나 검색 막대에 검색어를 입력하여 설치된 앱 중에서 검색합니다.

  8. 활성화하려는 앱 임베드 옆의 토글 버튼을 탭하여 활성화합니다.

  9. 선택 사항: 앱 임베드 이름 옆의 확장 아이콘 을 탭하여 앱 임베드 설정을 확인합니다.

  10. 저장을 탭합니다.

  11. 스토어를 미리 보기하여 임베디드 앱이 실시간으로 표시되는지 확인합니다.

테마 코드에 추가된 앱

일부 앱은 테마에 기능을 추가하기 위해 테마 코드에 직접 코드를 삽입합니다. 앱을 설치한 후, 테마에서 앱 기능이 표시되기를 원하는 위치에 직접 코드를 편집하여 앱 기능을 추가하는 내용이 포함된 설치 지침을 받을 수 있습니다. 앱 설정 또는 테마 편집기를 사용하여 앱을 사용자 지정할 수 있습니다.

테마에서 Custom Liquid 섹션을 제공하는 경우 테마 코드를 직접 편집하는 대신 테마 편집기의 Custom Liquid 섹션에 앱 코드를 추가할 수 있습니다.