숏코드로 하이라이트 배치하기

기본적으로 하이라이트 블록은 제품 페이지에서 앱의 기본 위치에 표시돼요. 설명 위, 페이지 아래쪽, 다른 템플릿처럼 다른 곳에 표시해야 하면 블록의 숏코드를 복사해 직접 배치하세요.

숏코드를 찾을 수 있는 곳

숏코드는 두 곳에서 확인할 수 있어요.

• 편집기에서 — 하이라이트를 열고 Placement 탭으로 이동하세요. 하단의 Shortcode 카드에 Copy 버튼과 함께 코드가 표시됩니다.
• 목록에서 — Extra Features 페이지의 Highlights 탭에 있는 Shortcode 열에 각 블록의 복사 아이콘이 있습니다.

Shortcode 카드는 Placement 탭의 Product page 토글 아래에 있습니다.

주의

숏코드를 복사하기 전에 하이라이트를 저장하세요. 저장하지 않은 블록의 코드는 data-id="new"로 표시되며 스토어프런트에 아무것도 표시되지 않습니다.

테마에 숏코드 배치하기

1. 숏코드 복사하기

   하이라이트를 열고 Placement 탭으로 전환한 다음 Copy를 클릭하세요. 코드는 다음과 같으며, 블록 고유의 ID가 들어갑니다.

   <div class="samitaPL-highlight" data-id="4482"></div>

   하이라이트마다 고유한 data-id가 있으므로, 실제로 표시하려는 블록에서 코드를 복사하세요.

2. 테마 편집기 열기

   Shopify 관리자에서 온라인 스토어로 이동해 변경할 테마의 테마 편집을 클릭하세요.

   

   Edit theme을 클릭해 하이라이트를 추가할 테마를 여세요.

3. Samita Highlight 블록 추가하기

   블록을 배치할 페이지와 섹션으로 이동하세요. 예를 들어 제품 템플릿의 제품 정보입니다. 블록 추가를 클릭하고 앱 탭으로 전환한 다음 Samita Highlight(Sami Product Labels 제공)를 선택하세요. 블록을 구매 버튼과 설명 사이처럼 원하는 위치로 끌어다 놓으세요.

   

   Add block 메뉴의 Apps 탭에서 Samita Highlight를 선택하세요.

4. 블록에 숏코드 붙여넣기

   블록을 선택한 상태에서 Shortcode 필드에 코드를 붙여넣고 저장을 클릭하세요.

   

   하이라이트 숏코드를 블록의 Shortcode 필드에 붙여넣고 저장하세요.

5. 스토어프런트 확인하기

   스토어프런트에서 페이지를 열어 블록이 올바른 위치에 표시되는지 확인하세요. 아무것도 표시되지 않으면 다음을 확인하세요.

   • 하이라이트 상태가 Draft가 아니라 Active인지
   • 블록의 data-id가 하이라이트와 일치하는지
   • Placement 탭의 조건이 이 페이지를 제외하고 있지 않은지 — 하이라이트 표시 대상 지정하기를 참고하세요.

기본 배치와 숏코드 비교

방법	작동 방식
Product page toggle	Placement 탭에서 Product page를 켜면 모든 제품 페이지의 앱 기본 위치에 하이라이트가 표시됩니다. 테마를 편집할 필요가 없어요.
Shortcode	정확한 위치를 지정하려면 앱 블록에 코드를 붙여넣으세요. 기본 위치가 원하는 곳이 아닐 때 사용하세요.

어느 방법을 쓰든 표시 조건은 계속 적용돼요. 숏코드는 블록이 어디에 있는지를, 조건은 블록을 표시할지 여부를 제어합니다.

다음 단계

• 하이라이트 만들기 — 블록을 만들고 그리드 스타일을 지정합니다.
• 하이라이트 표시 대상 지정하기 — 어떤 페이지와 고객에게 표시할지 제어합니다.
• 숏코드로 신뢰 배지 배치하기 — 신뢰 배지에도 같은 방법을 사용합니다.

팁

도움이 필요하신가요?

이 단계를 따라 하다가 어려움이 있으면 [email protected]로 문의해 주세요.