Liquid를 사용하여 Shopify Email 캠페인 사용자 지정

Liquid는 Shopify의 간단하고 사용하기 쉬운 프로그래밍 언어이며 Shopify 테마 스토어에서 테마 구축에 사용된 것과 동일한 프로그래밍 언어입니다.

사용자 지정 Liquid를 사용하여 완전히 사용자 지정 코딩된 이메일을 생성하거나 템플릿에 사용자 지정 Liquid 섹션을 추가하여 Shopify Email 메시지를 개선할 수 있습니다. 이러한 옵션을 사용하면 사용자 지정 Liquid 또는 HTML을 입력 할 수 있습니다.

사용자 지정 Liquid 섹션을 통해 병렬 이미지, 사용자 지정 버튼, 사용자 지정 크기 이미지, 사용자 지정 섹션 크기 등의 맞춤형 자산을 표시할 수 있습니다.

이 페이지의 정보

고려 사항

Shopify Email 메시지에 사용자 지정 Liquid를 추가하기 전에 다음 고려 사항을 검토하십시오.

코드에 포함되는 변수는 사용자 지정 Liquid에서 지원해야 합니다.
데스크톱 장치에서만 사용자 지정 Liquid 섹션을 생성할 수 있습니다.
사용자 지정 Liquid 이메일에는 unsubscribe_link 또는 unsubscribe_url 변수가 필요합니다. 이메일 확인 추적을 활성화한 경우 open_tracking 변수도 필요합니다. 이메일에 필수 변수를 추가하는 방법에 대해 자세히 알아보세요.
입력하는 코드에는 다음과 같은 제한 사항이 있습니다. - 사용자 지정 Liquid 섹션의 경우 최대 50킬로바이트(KB)입니다. - 사용자 지정 코딩 Liquid 이메일은 최대 500KB입니다.

사용자 지정 Liquid 주문에서 지원되는 Liquid 변수

지원되는 변수를 사용하여 Liquid로 Shopify 이메일 메시지를 사용자 지정할 수 있습니다. 다음 유형의 템플릿에 대해 지원되는 Liquid 변수 목록을 검토할 수 있습니다.

모든 이메일 템플릿에 지원되는 Liquid 변수

다음 변수를 사용하여 Liquid로 Shopify Email 메시지를 사용자 지정할 수 있습니다.

Shopify Email 지원 Liquid 변수에 대한 설명
변수	설명
all_products	스토어의 모든 제품입니다.
unsubscribe_link	이 변수는 사전에 형식이 지정된 구독 취소 링크 블록에 대한 액세스 권한을 제공합니다. 사용자 지정 코딩된 이메일을 생성하는 경우 `unsubscribe_link` 또는 `unsubscribe_url` 변수를 포함해야 합니다.
unsubscribe_url	이 변수는 원시 구독 취소 URL에 대한 액세스 권한을 부여하며 맞춤 설정할 수 있습니다. 사용자 지정 코딩된 이메일을 생성하는 경우 `unsubscribe_url` 또는 `unsubscribe_link` 변수를 포함해야 합니다.
open_tracking	이 변수는 미리 형식이 지정된 열린 추적 블록에 액세스할 수 있습니다.사용자 지정 코딩 이메일을 생성하고 확인 추적을 활성화한 경우 이 변수가 필요합니다.
data.customer.*	이 변수를 통해 다음과 같은 고객 데이터 속성을 사용할 수 있습니다. `first_name(이름)` `last_name(성)` `이메일` `city` `상태` `국가` `<p>이러한 속성은 <a href="https://shopify.dev/api/liquid/filters">Liquid 필터</a> 또는 <a href="https://shopify.dev/api/liquid/tags/conditional-tags">Liquid 조건</a> 내에서 사용할 수 없습니다.`
email.*	이 변수를 통해 다음과 같은 이메일 속성을 사용할 수 있습니다. `subject`는 이메일 제목 줄을 표시합니다. `preview_text`는 이메일의 미리 보기 텍스트를 표시합니다.
shop.*	이 변수를 통해 다음과 같은 상점 속성을 사용할 수 있습니다. `name`은 상점 이름을 표시합니다. `domain`은 상점 기본 도메인을 표시합니다. `url`은 상점 URL을 표시합니다. `shopify_domain`은 상점 Shopify 도메인을 표시합니다. `address`는 다음 주소 속성에 액세스를 부여하는 상점 주소를 표시합니다. `address1` `address2` `city` `국가` `휴대폰` `province` `우편 번호` `branding`은 다음 속성에 액세스를 부여하는 상점 브랜딩을 표시합니다. `accent_section_color` `background_primary_color` `background_border_color` `body_text_color` `button_background_and_link_color` `button_label_color` `footer_link_color` `footer_text_color` `footer_background_color` `social_link_facebook` `social_link_twitter` `social_link_instagram` `social_link_pinterest` `shop_name` `logo`는 `img` 태그로 직접 렌더링됩니다.

### 중단된 결제 이메일에 지원되는 Liquid 변수 {#abandoned-checkout}

다음 변수를 사용하여 Liquid로 중단된 결제 Shopify Email 메시지를 사용자 지정할 수 있습니다.

abandoned_checkout 변수는 중단된 결제 마케팅 자동화의 일부인 이메일에만 입력됩니다. 그렇지 않으면 변수는 null입니다.

중단된 탐색, 카트 및 결제에 지원되는 Shopify Email Liquid 변수에 대한 설명
변수	설명
abandoned_checkout.*	이 변수를 통해 다음과 같은 중단된 결제의 속성을 사용할 수 있습니다. `url`은 중단된 결제의 URL을 표시합니다. `line_items`는 중단된 결제의 처음 5개 품목을 표시합니다. 또한 `line_items` 개체마다 각 제품에 대한 다음 속성이 포함되어 있습니다. `구성 요소` `image_url` `product_title` `variant_title` `quantity` `line_items.components`는 중단된 결제의 구성 요소를 표시합니다. 또한 각 `components` 객체에는 각 구성 요소에 대한 다음 속성이 포함되어 있습니다. `image_url` `quantity` `product_title` `variant_title` `remaining_products_count`는 중단된 결제의 품목이 5개를 초과하는 경우 남은 품목 수를 표시합니다.
id (checkout ID)	내부 사용에 대한 결제의 고유 ID입니다.
shop	귀하의 Shopify 스토어 이름입니다.
name	중단된 결제의 이름입니다(결제 번호라도도 함).
total_price	주문 총액(소계+배송비-배송비 할인+세금)입니다.
shipping_price	배송 가격입니다. 예: `{{ shipping_price \| money }}`
shipping_address	배송 주소입니다.
billing_address	청구 주소입니다.
line_items	중단된 결제의 모든 품목 목록입니다.
unavailable_line_items	사용할 수 없는 중단된 결제의 모든 품목 목록입니다.
note	중단된 결제에 첨부된 메모입니다.
landing_site	고객이 사용한 방문 사이트의 경로입니다. 고객이 스토어에 방문하여 액세스한 첫 번째 페이지입니다. 예: `/products/great-product?ref=my-tracking-token`
landing_site_ref	방문 사이트에서 참조 매개 변수를 추출합니다. 참조 매개 변수에는 `ref`, `source`, `r`이 있습니다. `landing_site`가 `/products/great-product?ref=my-tracking-token`인 경우 `landing_site_ref`가 `my-tracking-token`이 됩니다. 참조 매개 변수가 특정 값과 동일한 경우 특정 작업을 수행할 수 있습니다. {% if landing_site_ref == 'my-tracking-token' %} 내 작업... {% endif %}
referring_site	고객을 스토어로 유입시킨 참조 페이지의 URL입니다. 예: `https://www.google.com/?s=great+products`
created_at	고객이 중단한 결제를 생성한 날짜와 시간입니다.
closed_at	결제가 종료된 날짜와 시간입니다.
customer_locale	고객의 로케일에 대한 2~3자 언어 코드로, 지역 수정자를 뒤에 입력할 수도 있습니다. 예: ko , en-CA
item_count	모든 품목 수량의 합계입니다.
unique_gateways	결제 시 사용 가능한 고유 결제 서비스 공급업체 목록입니다.
discount	중단된 결제의 카트 또는 품목에 적용되는 할인입니다.
discounts	결제에 적용되는 할인 목록입니다.
successfully_applied_discounts	결제에 성공적으로 적용되었던 할인입니다.
discounts_amount	모든 할인이 적용된 할인의 달러 금액입니다. 예: +$5.00
discounts_savings	모든 할인으로 인해 발생한 절약의 달러 금액입니다. 예: -$5.00
buyer_accepts_marketing	반품 참 또는 거짓 고객이 중단된 결제 중 마케팅을 수락했는지 여부에 따라 다릅니다.
subtotal_line_items	팁 품목을 제외하고 결제 시 소계 가격을 계산하는 데 사용되는 품목입니다.
requires_shipping	반품 참 배송해야 하는 결제에 품목이 한 개 이상 있는 경우입니다.
subtotal_price	결제 시 품목의 소계 가격입니다.
email	중단된 결제와 관련된 이메일입니다.
shop_name	스토어 이름입니다.
tax_lines	세금 유형으로 분류된 세금: {% for tax_line in tax_lines %} {{ tax_line.title }} ({{ tax_line.rate_percentage }}%) : {{ tax_line.price \| money_with_currency }} {% endfor %}
tax_price	결제에 있는 모든 품목의 합산된 세금입니다.
attributes	중단된 결제에 연결되었던 모든 특성입니다. 예: `{{ attributes.gift-note }}`
shipping_method	결제 시 사용 가능한 첫 번째 배송 방법에 대한 정보입니다.
shipping_methods	결제 시 사용 가능한 배송 방법입니다.
free	반품 참 결제의 합계 가격이 0인 경우입니다.
free_shipping	반품 참 결제에 배송이 필요하지 않은 경우 또는 배송 가격이 0인 경우입니다.
different_billing_address	반품 참 또는 거짓 배송 주소가 청구 주소와 같은지 여부를 기준으로 합니다.
customer	고객 출력 특성이 포함된 고객 개체입니다.
gift_cards	결제에 적용된 기프트 카드입니다.
gift_cards_amount	기프트 카드로 결제할 결제 가격 금액입니다.
transactions	결제의 거래입니다.
shareable_url	품목 내 첫 번째 제품의 URL입니다.
shareable_title	첫 번째 품목의 제품 이름입니다.
total_tip	고객이 결제 시 추가한 총 팁입니다.
discount_applications	결제에서 품목이 할인된 이유 및 방법을 설명합니다.
cart_level_discount_applications	카트에 대한 카트별 할인 적용입니다.
currency	중단된 결제의 통화입니다.
line_items_subtotal_price	품목 할인이 적용된 후 결제에서 모든 품목의 가격 합계입니다.

### 중단된 탐색 및 중단된 카트 이메일의 Liquid 변수 {#abandoned-visits}

abandoned_visit.* 변수는 중단된 카트 또는 중단된 제품 검색 마케팅 자동화의 일부인 이메일에만 입력됩니다. 이 변수로 액세스할 수 있는 다음 속성을 검토합니다.

Shopify Email 지원 Liquid 변수에 대한 설명
변수	설명
abandoned_visit.*	이 변수를 통해 중단된 카트 또는 검색의 다음과 같은 속성을 사용할 수 있습니다. `url`은 중단된 카드 또는 탐색의 URL을 표시합니다. `products_added_to_cart`는 중단된 방문 카트에 추가한 처음 5개의 제품 품목을 표시합니다. 또한 `products_added_to_cart` 개체마다 각 제품에 대한 다음 속성이 포함되어 있습니다. `제목` `image_url` `variant_title` `quantity` `products_viewed`는 중단된 방문 중에 조회한 처음 5개 제품을 표시합니다. 또한 `products_viewed` 개체마다 각 제품에 대한 다음 속성이 포함되어 있습니다. `제목` `설명` `image_url` `URL` `image_alt_text` `remaining_cart_products_count`는 중단된 결제의 품목이 5개를 초과하는 경우 남은 품목 수를 표시합니다.

## 필수 변수 사용 {#required-variables}

사용자 지정 Liquid 이메일을 생성할 때는 unsubscribe_link 또는 unsubscribe_url 변수가 필요합니다. 이메일 확인 추적을 활성화한 경우 open_tracking 변수도 필요합니다.

이 변수는 이메일 코드의 아무 곳에나 삽입할 수 있습니다. 이 변수를 추가하는 가장 일반적인 위치는 다음 예제에 나온 것처럼 이메일의 바닥글 섹션입니다.

<div id="footer">{{ unsubscribe_link }} {{ open_tracking_block }}</div>

사용자 지정 Liquid 코드 예

코드 편집기에 사용자 지정 Liquid 및 HTML을 입력할 수 있습니다. 다음 코드는 이메일 메시지에 스토어 이름, 사용자 지정 버튼 및 사용자 지정 크기 이미지를 표시할 수 있도록 Liquid 코드를 추가하는 방법의 예입니다.

<style>
  body {
    text-align: center;
  }

  p#welcome {
    margin: 0;
    padding: 3rem;
    color: white;
    font-weight: 700;
    font-size: 26px;
    font-family: 'Futura';
  }

  div#image_wrapper img {
    max-width: 70%;
    border-radius: 60px;
    box-shadow: -2px 6px 0px rgba(227, 111, 59, 0.7);
  }

  div#button_wrapper {
    padding: 1rem;
  }

  div#button_wrapper a {
    padding: 1rem 2rem;
    border-radius: 24px;
    display: inline-block;
    background: linear-gradient(120deg, #F6A179, #865CFF);
    box-shadow: -2px 4px 0px rgba(96, 54, 173, 0.9);
    font-weight: 700;
    font-size: 16px;
    font-family: 'Futura';
    color: white;
  }

  div#footer {
    font-weight: 700;
    font-size: 16px;
    font-family: 'Futura';
    padding: 2rem;
  }

  div#button_wrapper:hover a {
    box-shadow: -4px 6px 0px rgba(96, 54, 173, 0.8);
  }

  div#custom_section {
    background: linear-gradient(120deg, #FF9F73, #FFC7AD);
    padding:0 0 2rem 0;
    border-radius: 4rem;
  }
</style>
<div id="custom_section">
  <p id="welcome">
    Hello from {{shop.name}}<strong></strong>!
  </p>
  <div id="image_wrapper">
    <img src="https://burst.shopifycdn.com/photos/a-trio-of-natural-soaps.jpg" alt="" />
  </div>
  <div id="button_wrapper">
    <a href="">Shop now</a>
  </div>
  <div id="footer">{{ unsubscribe_link }} {{ open_tracking_block }}</div>
</div>