Shopify POS용 인쇄된 영수증 코드 편집기

Shopify 관리자에서 코드 편집기를 사용하여 인쇄된 영수증을 맞춤 설정할 수 있습니다. 영수증을 구성하는 파일에는 Shopify의 템플릿 언어인 Liquid가 포함되어 있습니다. 코드 편집기를 사용하면 시각적 편집기보다 HTML, CSS, Liquid를 사용하여 더 고급 맞춤 설정을 생성할 수 있습니다.

영수증 템플릿과 인쇄된 영수증에 사용되는 섹션 템플릿을 변경할 수 있습니다. 영수증 템플릿 파일은 스토어에서 인쇄할 수 있는 영수증 유형입니다. 섹션은 머리글 또는 바닥글과 같은 영수증의 일부입니다. 섹션은 여러 영수증에서 재사용할 수 있습니다.

영수증 코드 편집기 사용 시 고려 사항

영수증 코드 편집기를 사용하기 전에 다음 고려 사항을 검토하세요.

액세스 제한

• 코드 편집기는 데스크톱의 Shopify 관리자에서만 사용할 수 있습니다.
• 코드 편집기는 이탈리아의 POS 위치에서 사용할 수 없습니다.

변경 사항 적용 범위

• 코드 변경 사항은 선택한 위치에만 적용됩니다.
• 코드 편집기의 맞춤 설정은 POS Pro 위치에만 적용됩니다. 코드 편집기를 사용하며 POS Pro가 아닌 위치가 있는 경우 해당 위치에 시각적 편집기를 사용하여 머리글과 바닥글을 맞춤 설정할 수 있습니다.
• 코드 편집기에서 판매 영수증, 기프트 영수증, 기프트 카드 영수증, 반품 및 교환 영수증과 같은 템플릿이 있는 인쇄된 영수증을 맞춤 설정할 수 있습니다.

코드 언어

• 영수증을 구성하는 파일에는 Shopify의 템플릿 언어인 Liquid가 포함되어 있습니다. Liquid 사용에 대해 자세히 알아보십시오.
• 영수증 코드 편집기에서 템플릿을 편집하려면 HTML, CSS, Liquid에 익숙해야 합니다. Shopify 테마 지원팀은 Shopify 디자인 정책 범위 내에서 사소한 조정을 지원할 수 있습니다.

맞춤 설정 제한 사항

• 코드 편집기에서는 영수증을 다양한 프린터 크기로 미리 볼 수 없습니다. 프린터 크기별로 미리 보려면 시각적 편집기를 사용하십시오.
• 제품 설명은 영수증 템플릿의 변수로 사용할 수 없으며 인쇄된 영수증에 추가할 수 없습니다.

템플릿 관리

• 영수증 코드 편집기를 사용하여 영수증을 맞춤 설정하면 기존 템플릿에 selling_plan_name과 같은 새 속성이 누락될 수 있습니다. 템플릿에 사용할 수 있는 최신 속성을 추가하려면 영수증 템플릿을 기본값으로 재설정해야 합니다. 영수증 템플릿을 기본값으로 재설정하면 적용된 맞춤 설정이 모두 제거됩니다. 재설정하기 전에 맞춤 설정된 코드를 기록해 두십시오. 템플릿을 재설정한 후에는 맞춤 설정을 수동으로 다시 적용해야 합니다.

코드 편집기 액세스

코드 편집기를 사용하여 템플릿을 편집할 수 있습니다. 먼저 기본 시각적 편집기에서 코드 편집기 사용으로 전환해야 하며 언제든지 시각적 편집기로 다시 전환할 수 있습니다.

편집기 간 전환 단계는 모든 POS 위치가 코드 편집기 사용 기준을 충족하는지, 아니면 일부 POS 위치만 기준을 충족하는지(예: 일부 POS 위치에서 POS Pro를 사용하지 않거나 이탈리아 또는 프랑스에 기반을 둔 경우)에 따라 약간 다릅니다.

단계:

영수증 템플릿에 사용자 지정 파일 사용

Shopify 관리자에 업로드하는 이미지 자산과 같은 파일을 사용하여 인쇄된 영수증을 맞춤 설정할 수 있습니다.

인쇄된 영수증에 파일을 사용하려면 먼저 Shopify 관리자에 파일을 업로드해야 합니다. 파일 업로드에 대해 자세히 알아보십시오.

단계:

1. Shopify 관리자에서 콘텐츠 > 파일로 이동합니다.

2. 인쇄된 영수증 코드에 포함할 파일 옆의 를 클릭하여 링크를 복사합니다.

3. 코드 편집기로 이동합니다.

4. 자산 링크를 템플릿에 포함합니다.

영수증 템플릿을 기본값으로 재설정

코드 편집기를 사용하여 영수증 템플릿을 기본 버전으로 재설정할 수 있습니다.

단계:

영수증 코드 편집기에서 사용할 수 있는 Liquid 변수

Liquid를 사용하여 인쇄된 영수증 템플릿과 영수증 유형을 맞춤 설정할 수 있습니다.

영수증 코드 편집기에서 다음 데이터 개체를 사용할 수 있습니다.

영수증 개체

shop

location

order

return

gift_card

주문 개체

id

created_at

source_identifier

change_due

balance_due

name

note

line_items

subtotal_price

total_price

total_tip_received

discounts

transactions

taxes_included

tax_lines

customer

shipping_address

shipping_groups

반품 객체

name

created_at

is_unverified

is_exchange

exchange_type

return_discount

return_subtotal

return_total

exchange_subtotal

exchange_total

total_cash_rounding_adjustment

total_adjusted_amount

net_total

return_line_items

exchange_line_items

return_tax_lines

exchange_tax_lines

shipping_refund_amount

tip_refund_amount

transactions

배송 그룹 객체

destination

products

품목 객체

id

name

variant_title

price

is_gift_card

discount

total_price

selling_plan_name

tax_rates

custom_attributes

variant_title

variant_id

variant_metafields

staff_member_description

product_metafields

반품 품목 객체

품목 개체의 모든 항목과 다음 속성을 포함합니다.

return_reason

return_reason_note

영수증 코드 편집기에서 사용 가능한 Liquid 필터

Liquid 필터를 사용하여 영수증 템플릿의 정보를 조정할 수 있습니다. 예를 들어 통화 서식이나 세금 코드와 같은 특정 텍스트의 대/소문자를 변경할 수 있습니다.

필터를 적용하려면 이중 중괄호 {{ }} 사이의 Liquid 코드 블록에 파이프 문자 |를 추가한 후 필터를 추가하십시오. 필터는 Liquid 코드 블록에만 적용할 수 있습니다.

다음 예시에서는 필터가 세금 코드를 소문자에서 대문자로 변경합니다.

{{ tax_line.title | upcase }}

예시 코드 블록에서 product는 객체이고 title은 속성이며 upcase는 적용된 필터입니다. upcase 필터는 tax_line.title 값의 대소문자를 대문자로 변경합니다. 예를 들어 tax_line.title의 값이 Hst인 경우 upcase 필터는 이 값을 HST로 변경합니다.

Liquid 필터 사용 방법에 대한 자세한 내용은 Shopify Themes Liquid 참조의 필터 섹션을 참조하십시오.

영수증 코드 편집기에서 다음 필터를 사용할 수 있습니다.

t

money

escape

barcode

qrcode

인쇄된 영수증 템플릿 코드 맞춤 설정 예시

Liquid를 사용하여 조건부 메시지를 추가할 수 있습니다. 이 기능은 시각적 편집기를 사용하여 단일 위치에 저장하는 것과 유사합니다. 예를 들어 비즈니스가 단일 위치에서 시작되었고 지금은 여러 개의 새 위치가 있다고 가정해 보겠습니다. 인쇄된 영수증에 원래 스토어를 강조 표시하고 싶을 수 있습니다.

코드 편집기의 섹션 폴더에 있는 header.liquid 템플릿에 사용자 지정 메시지를 추가하고 Liquid를 사용하여 플래그십 위치에만 메시지를 표시할 수 있습니다.

다음 코드는 위치 이름(이 경우 “Home”이라는 원래 위치)을 확인하여 이름과 일치하면 “1972년에 개점한 원래 스토어에 오신 것을 환영합니다.” 메시지를 표시합니다. 다른 위치에서 인쇄된 영수증에는 대신 “저희 스토어에 오신 것을 환영합니다.” 메시지가 표시됩니다.

{% if location.name == 'Home' %}
  Welcome to our original store, opened in 1972.
{% else %}
  Welcome to our store.
{% end %}

코드 편집기에서 코드 변경 사항 미리 보기

Shopify 관리자의 POS 코드 에디터에서 인쇄된 영수증에 대한 변경 사항을 미리 볼 수 있습니다.

선택한 Liquid 파일에 따라 미리 보기 창에서 파일의 영향을 받는 영수증 디자인 또는 섹션이 강조 표시됩니다. 기본적으로 미리 보기 창에는 가장 최근 POS 주문의 콘텐츠가 표시됩니다. gift-card.liquid 파일을 제외한 모든 Liquid 파일의 미리 보기 창에서 영수증 콘텐츠로 사용할 특정 주문을 선택할 수 있습니다. gift-card.liquid 파일의 경우 선택 가능한 미리 보기 옵션으로 여러 위치만 표시됩니다.

단계: