동적 테이블 블록에서 줄을 건너뛰는 방법

학습 내용

동적 테이블 블록에서 행(예: 항목)을 건너뛰는 방법을 알아보세요. 가장 일반적인 사용 사례는 버려진 장바구니 이메일에서 배송 보험이나 사은품과 같은 관련 없는 항목을 숨기는 것입니다. 그러나 동적 테이블 블록을 사용하는 모든 이메일에 대해 다음 단계를 따를 수 있습니다. 

시작하기 전 안내 사항

이 문서에서는 기존 동적 테이블 블록에서 항목을 숨기는 방법에 대해 설명합니다. 아직 작동하는 동적 테이블 블록(예: 버려진 카트의 제품 또는 주문 확인 이메일)을 만들지 않았다면 처음부터 새로 만들거나 플로우 라이브러리에서 메시지로 시작하는 방법을 알아보세요. 

if 문 작성

템플릿을 변경하기 전에 텍스트 또는 코드 편집기를 사용하여 코드 스니펫 2개를 생성합니다(나중에 스니펫을 복사하여 붙여넣을 수 있는 곳에). 각 코드 스니펫은 세 부분으로 구성됩니다: 

1. 테이블 블록에 표시할 항목을 나타내는 오프닝 IF 태그 {% if … %}입니다. 
2. 이미지 태그나 제품에 대한 텍스트와 같은 콘텐츠입니다.
3. 닫는 태그, {% endif %}.

1. if 태그만들기

다음은 if 태그를 여는 몇 가지 예입니다: 

2. if 문에 대한 콘텐츠를 만듭니다.

콘텐츠의 경우 동적 테이블 블록의 기존 콘텐츠를 사용하려면 다음 단계를 따르세요. 코드 또는 텍스트 편집기에서 이 코드 조각을 작성하고 다음 섹션에서 템플릿에 추가합니다. 

1. 표 블록의 이미지에 대한 셀 콘텐츠에서 바꾸기를 클릭하여 이미지 자리 표시자를 확인합니다.
   
2. 동적 변수 또는 동적 URL 필드에서 전체 코드를 복사합니다. 단순한 동적 변수일 수도 있고 긴 코드 스니펫일 수도 있으므로 길이에 관계없이 모두 복사하세요.
   
3. 이 코드 스니펫의 자리 표시자를 동적 변수 또는 동적 URL 필드에서 복사한 코드로 바꿉니다.
   

   <img src="PLACEHOLDER" style="width: 200px; height: auto;" width="200">

기존 테이블 블록에 이미지에 대한 간단한 동적 변수가 있는 경우 결과 콘텐츠는 다음과 같이 표시됩니다: 

<img src="{{item.product.variant.images.0.src}}" style="width: 200px; height: auto;" width="200">  

기존 테이블 블록에 더 긴 코드 스니펫이 포함되어 있는 경우 결과 콘텐츠는 다음과 같이 보일 수 있습니다: 

<img src="{% if item.product.variant.images.0.src %}{{item.product.variant.images.0.src}}{%else%}{{item.product.images.0.src|missing_product_image}}{%endif%}" style="width: 200px; height: auto;" width="200">

3. 종료 태그 추가하기

그런 다음 여는 if 문, 콘텐츠, 마지막으로 닫는 {% endif %} 태그 등 모든 콘텐츠를 하나로 묶습니다. 

4. 텍스트 콘텐츠에 대해 반복합니다.

그런 다음 표 블록의 오른쪽에 있는 콘텐츠(예: 텍스트 콘텐츠)에 대해 이 과정을 반복합니다. < / > 을 클릭하여 코드 편집기를 열고 모든 HTML 콘텐츠를 복사한 다음 이 콘텐츠를 이미지 콘텐츠에 사용한 것과 동일한 if 문(1단계 및 3단계)으로 감싸줍니다. 

모든 것이 합쳐진 모습은 다음과 같습니다: 

{% if item.product.name != "Route Shipping Insurance" %}
<img src="{% if item.product.variant.images.0.src %}
{{item.product.variant.images.0.src}}{%else%}
{{item.product.images.0.src|missing_product_image}}
{%endif%}"style="width: 200px; height: auto;" width="200">
{% endif %}

{% if item.product.name != "Route Shipping Insurance" %}
<h3>< a href="{{ organization.url }}products/{{ item.product.url }}" >
   {{ item.product.name }}
</a></h3>
<p>
   수량: {{ item.quantity|floatformat:0 }} - 
 합계: {% currency_format item.line_price|floatformat:2 %}
</p>
{% endif %}

이러한 코드 스니펫에 대한 분석은 다음과 같습니다: 

{% if CRITERIA %}
   이미지 플레이스홀더 콘텐츠
{% endif %}

{% if CRITERIA %}
   제품 설명
{% endif %}

두 코드 조각을 모두 작성했으면 템플릿 편집기에서 아래 단계에 따라 계속 진행합니다. 

동적 테이블 블록에서 행 건너뛰기

1. 이메일이 플로우의 일부인 경우에는 초안 또는 수동으로 설정하여 플로우 메시지를 편집하는 동안 메시지가 전송되지 않도록 하세요. 
2. 새 표 블록의 두 열에 대한 셀 콘텐츠가 텍스트로 설정되어 있는지 확인합니다.
   
3. < / > 을 클릭하여 표 블록의 왼쪽에 있는 HTML 편집기를 엽니다. 
4. 이전 섹션에서 생성한 제품 이미지 코드 스니펫을 복사하여 HTML 필드에 붙여넣습니다.
   
5. 왼쪽 상단에서 완료를 클릭합니다. 
6. 표 블록의 오른쪽에 있는 편집기로 이동합니다. 
7. < / > 을 클릭하여 표 블록의 오른쪽에 있는 HTML 편집기를 엽니다. 
8. 이전 섹션에서 생성한 제품 세부 정보 코드 스니펫을 복사하여 HTML 필드에 붙여넣고 이전 콘텐츠를 모두 대체합니다. 
9. 완료를 클릭합니다. 
10. 이메일을 미리 보고 예상대로 표시되는지 확인합니다. 건너뛴 항목은 표시되지 않아야 하지만 다른 모든 항목은 정상적으로 표시됩니다. 숨기려는 항목이 포함된 이벤트에서 미리 보기를 실행하여 숨기려는 항목이 숨겨져 있는지 확인하세요. 

조건문 및 인라인 텍스트 편집기

텍스트 블록에 특정 조건문을 추가하면 인라인 텍스트 편집기에서 해당 조건문이 사라질 수 있습니다. 코드는 여전히 존재하며 단지 숨겨져 있을 뿐입니다. 조건문을 보고 편집하려면 텍스트 블록의 소스 코드 필드를 엽니다. 

다음 태그는 텍스트 블록의 소스 코드 필드에서만 볼 수 있습니다. 

• {% for ... %}
• {% endfor %}
• {% if ... %}
• {% elif ... %}
• {% else %}
• {% endif %}
• {% with ... %}
• {% endwith %}

문제 해결

미리 보기에 항목이 표시되지 않습니다.

1. 사용한 데이터 소스와 일치하는 이벤트(예: 중단된 장바구니 메시지에 대한 결제 시작 )로 미리 보기를 하고 있는지 확인합니다. 
2. 반복 대상 및 행 별칭이 원본 블록의 행 컬렉션 및 행 별칭과 정확히 일치하는지 확인합니다. 

건너뛰어야 하는 항목이 계속 표시됩니다.

if 문의 철자와 대소문자를 확인하세요. 제품이 여전히 표시되는 경우 제품이 if 문에 있는 기준을 충족하므로 if 문이 올바르게 구성되지 않았다는 의미입니다. 템플릿의 조건부 논리에 대해 자세히 알아보세요. 

결과

이 단계를 수행하면 if 문에서 기준을 충족하지 않는 품목은 버려진 카트나 주문 확인 이메일 등의 메시지에 표시되지 않습니다.  

추가 리소스

• 메시지 개인화 참조
• 사용자 지정 HTML 템플릿을 가져오는 방법