앱으로 테마 확장
앱을 설치하여 테마에 기능과 통합을 추가할 수 있습니다. Shopify App Store에서 앱을 찾을 수 있습니다.
앱은 다음과 같은 방식으로 테마와 통합할 수 있습니다.
- 앱 블록: 앱 블록을 사용하면 테마에서 사용할 위치에 앱 기능을 정확히 추가할 수 있습니다. 테마 편집기를 통해 앱 블록을 추가, 제거, 미리 보기, 재배치 및 사용자 지정할 수 있습니다.
- 앱 임베드: 앱 임베드는 테마에서 오버레이로 표시 또는 플로팅되거나 고객에게 표시되지 않고 온라인 스토어에 코드를 추가하는 앱 제공 요소입니다. 테마 편집기를 통해 앱 임베드를 활성화, 비활성화, 미리 보기 및 사용자 지정할 수 있습니다.
- 사용자 지정 코드를 추가: 일부 앱은 테마 코드에 직접 코드를 삽입하여 테마에 기능을 추가합니다. 앱 설정을 사용하거나 테마 편집기를 사용하여 앱을 사용자 지정할 수 있습니다.
이 페이지의 정보
앱 블록
앱은 섹션에서 블록으로 추가하거나 템플릿에서 섹션으로 추가할 수 있습니다. 그러면 페이지에서 정확히 원하는 위치에 앱 기능을 추가할 수 있습니다. 앱 블록은 테마 편집기를 사용해 추가, 삭제, 위치 변경 또는 사용자 지정할 수 있습니다.
앱 블록이 특정 페이지 유형에만 호환되는 경우도 있습니다. 예를 들어 사이즈 차트 앱은 제품 페이지만 호환됩니다.
섹션에서 사용되는 앱 블록:
템플릿에서 섹션으로 사용되는 앱 블록:
섹션의 앱 블록 지원
일부 테마 섹션은 앱 블록을 지원하지 않을 수 있습니다. 앱 블록을 지원하는 테마 섹션을 확인하려면 테마 설명서를 참조하거나 테마 개발자에게 문의하십시오.
섹션에서 앱 블록을 지원하고 호환 가능한 앱이 설치된 경우 앱 섹션이 블록 선택기에 표시됩니다.
섹션에 앱 블록 추가
- Shopify Admin에서 온라인 스토어 > 테마로 이동합니다.
- 편집하려는 테마를 찾은 다음 사용자 지정을 클릭합니다.
- 앱 블록을 추가하려는 페이지 및 섹션으로 이동합니다.
- 사이드바에서 블록 추가를 클릭합니다.
- 드롭다운 메뉴의 앱 섹션에서 섹션에 추가할 앱 블록을 선택하거나 검색 창을 클릭하여 설치된 앱을 검색할 검색어를 입력합니다.
- 선택 사항: 블록을 페이지 내의 다른 위치로 이동하려면
⋮⋮
아이콘을 클릭하여 끌어서 이동합니다. 또한 제공되는 설정을 사용하여 블록을 사용자 지정할 수 있습니다. - 저장을 클릭합니다.
- Shopify 앱에서 … 버튼을 탭합니다.
- 판매 채널 섹션에서 온라인 스토어를 탭합니다.
- 모든 테마 관리를 탭합니다.
- 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
- 편집을 탭합니다.
- 앱 블록을 추가하려는 페이지 및 섹션으로 이동합니다.
- 사이드바에서 블록 추가를 클릭합니다.
- 드롭다운 메뉴의 앱 섹션에서 섹션에 추가할 앱 블록을 선택하거나 검색 창을 클릭하여 설치된 앱을 검색할 검색어를 입력합니다.
- 선택 사항: 블록을 페이지 내의 다른 위치로 이동하려면
⋮⋮
아이콘을 클릭하여 끌어서 이동합니다. 또한 제공되는 설정을 사용하여 블록을 사용자 지정할 수 있습니다. - 저장을 클릭합니다.
- Shopify 앱에서 … 버튼을 탭합니다.
- 판매 채널 섹션에서 온라인 스토어를 탭합니다.
- 모든 테마 관리를 탭합니다.
- 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
- 편집을 탭합니다.
- 앱 블록을 추가하려는 페이지 및 섹션으로 이동합니다.
- 사이드바에서 블록 추가를 클릭합니다.
- 드롭다운 메뉴의 앱 섹션에서 섹션에 추가할 앱 블록을 선택하거나 검색 창을 클릭하여 설치된 앱을 검색할 검색어를 입력합니다.
- 선택 사항: 블록을 페이지 내의 다른 위치로 이동하려면
⋮⋮
아이콘을 클릭하여 끌어서 이동합니다. 또한 제공되는 설정을 사용하여 블록을 사용자 지정할 수 있습니다. - 저장을 클릭합니다.
템플릿에 앱 블록 추가
- Shopify Admin에서 온라인 스토어 > 테마로 이동합니다.
- 편집하려는 테마를 찾은 다음 사용자 지정을 클릭합니다.
- 앱 섹션을 추가할 페이지로 이동합니다.
- 사이드바에서 섹션 추가를 클릭합니다.
- 드롭다운 메뉴의 앱 섹션에서 페이지에 추가할 앱을 선택하거나 검색 창을 클릭하여 설치된 앱에서 검색할 일부 텍스트를 입력합니다.
- 선택 사항: 블록을 페이지 내의 다른 위치로 이동하려면
⋮⋮
아이콘을 클릭하여 끌어서 이동합니다. 또한 제공되는 설정을 사용하여 블록을 사용자 지정할 수 있습니다. - 저장을 클릭합니다.
- Shopify 앱에서 … 버튼을 탭합니다.
- 판매 채널 섹션에서 온라인 스토어를 탭합니다.
- 모든 테마 관리를 탭합니다.
- 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
- 편집을 탭합니다.
- 앱 섹션을 추가할 페이지로 이동합니다.
- 사이드바에서 섹션 추가를 클릭합니다.
- 드롭다운 메뉴의 앱 섹션에서 페이지에 추가할 앱을 선택하거나 검색 창을 클릭하여 설치된 앱에서 검색할 일부 텍스트를 입력합니다.
- 선택 사항: 블록을 페이지 내의 다른 위치로 이동하려면
⋮⋮
아이콘을 클릭하여 끌어서 이동합니다. 또한 제공되는 설정을 사용하여 블록을 사용자 지정할 수 있습니다. - 저장을 클릭합니다.
- Shopify 앱에서 … 버튼을 탭합니다.
- 판매 채널 섹션에서 온라인 스토어를 탭합니다.
- 모든 테마 관리를 탭합니다.
- 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
- 편집을 탭합니다.
- 앱 섹션을 추가할 페이지로 이동합니다.
- 사이드바에서 섹션 추가를 클릭합니다.
- 드롭다운 메뉴의 앱 섹션에서 페이지에 추가할 앱을 선택하거나 검색 창을 클릭하여 설치된 앱에서 검색할 일부 텍스트를 입력합니다.
- 선택 사항: 블록을 페이지 내의 다른 위치로 이동하려면
⋮⋮
아이콘을 클릭하여 끌어서 이동합니다. 또한 제공되는 설정을 사용하여 블록을 사용자 지정할 수 있습니다. - 저장을 클릭합니다.
앱은 앱 섹션에 블록으로 추가됩니다. 원하는 경우 섹션에 앱 블록을 더 추가할 수 있습니다. 한 페이지에 여러 앱 섹션을 추가할 수도 있습니다.
앱 임베드
앱 임베드는 테마에서 오버레이로 표시 또는 플로팅되거나 고객에게 표시되지 않고 온라인 스토어에 코드를 추가하는 앱 제공 요소입니다. 예를 들어, 스토어 모서리에 나타나는 채팅 말풍선 앱이나 분석 또는 추적 앱이 앱 임베드로 스토어에 추가될 수 있습니다. 앱 임베드는 테마 편집기를 통해 활성화, 비활성화 및 사용자 지정이 가능하며 모든 테마 버전에서 사용할 수 있습니다.
앱 임베드 활성화
- Shopify Admin에서 온라인 스토어 > 테마로 이동합니다.
- 편집하려는 테마를 찾은 다음 사용자 지정을 클릭합니다.
- 사이드바에서 앱 임베드 아이콘을 클릭합니다.
- 활성화할 앱 임베드를 선택하거나 검색 창을 클릭하여 설치된 앱에서 검색할 검색어를 입력합니다.
- 활성화하려는 앱 임베드 옆에 있는 토글 버튼을 클릭하여 활성화합니다.
- 선택 사항: 앱 임베드 이름 옆에 있는
▸
확장 아이콘을 클릭하여 앱 임베드의 설정을 확인합니다. - 저장을 클릭합니다.
- 스토어 미리 보기에서 임베디드 앱을 실시간으로 확인할 수 있습니다.
- Shopify 앱에서 … 버튼을 탭합니다.
- 판매 채널 섹션에서 온라인 스토어를 탭합니다.
- 모든 테마 관리를 탭합니다.
- 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
- … > 앱 임베디드를 탭합니다.
- 활성화할 앱 임베디드를 선택하거나 설치된 앱을 통해 검색 창에 검색어를 입력하여 검색합니다.
- 활성화하려는 앱 임베드 옆에 있는 토글 버튼을 탭하여 활성화합니다.
- 선택 사항: 앱 임베드 이름 옆에 있는
▸
확장 아이콘을 클릭하여 앱 임베드의 설정을 확인합니다. - 저장을 탭합니다.
- 스토어 미리 보기에서 임베디드 앱을 실시간으로 확인할 수 있습니다.
- Shopify 앱에서 … 버튼을 탭합니다.
- 판매 채널 섹션에서 온라인 스토어를 탭합니다.
- 모든 테마 관리를 탭합니다.
- 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
- … > 앱 임베디드를 탭합니다.
- 활성화할 앱 임베디드를 선택하거나 설치된 앱을 통해 검색 창에 검색어를 입력하여 검색합니다.
- 활성화하려는 앱 임베드 옆에 있는 토글 버튼을 탭하여 활성화합니다.
- 선택 사항: 앱 임베드 이름 옆에 있는
▸
확장 아이콘을 클릭하여 앱 임베드의 설정을 확인합니다. - 저장을 탭합니다.
- 스토어 미리 보기에서 임베디드 앱을 실시간으로 확인할 수 있습니다.
테마 코드에 추가된 앱
일부 앱은 테마 코드에 직접 코드를 삽입하여 테마에 기능을 추가합니다. 앱을 설치한 후 테마에 표시할 앱 기능을 추가하기 위해 자체 코드를 편집하는 기능이 포함된 온보딩 지침을 받을 수 있습니다. 앱 설정을 사용하거나 테마 편집기를 사용하여 앱을 사용자 지정할 수 있습니다.
테마가 사용자 지정 Liquid 섹션을 제공하는 경우 테마 코드를 직접 편집하는 대신 테마 편집기의 사용자 지정 Liquid 섹션에 앱 코드를 추가할 수 있습니다.