Documentation You are here: start » v » 2.0 » gift_cards » email_template

Modifying Email Templates for Gift Card Recipients

The gift card email template is different from the regular Foxy email receipt templates. This article gives you some more information about how the template works, provides some simple examples of how to customize it, and lists the variables available.

Our gift card email template uses the MJML email framework. You can review the documentation for the framework here: MJML. Note that you don’t need to install it. If you want to dive into that documentation and really learn it, you can being with Getting Started at that link.

Otherwise, you can follow this article and refer to the MJML documentation if needed. Note that at the time of this writing, we are transitioning to a new Foxy admin, and the admin referred to in this article is the one at https://admin.foxy.io, rather than the legacy admin.

To get started with customizing the template, you can get the code from our templates GitHub repo here: Gift Card Email Template.

Copy the code there to your computer’s clipboard, and then you can either paste it into a plain text editor or work with it directly in the admin, if desired. Information on entering the template into the admin is included below, under Add Your Custom Template.

You can add the code to the Foxy admin at https://admin.foxy.io in the following setting: Settings→Emails→(your gift card email)→HTML template→Upload source code

You should leave the Language setting to Nunjucks unless you have a specific reason to use something else.

Styling the Template

You can add your own styles to this template by altering or adding your own inline styles to the individual elements.

Using Twig

You can use the Twig templating syntax to create conditions and add more information to the receipt. We have an example of conditionally adding the transaction ID to the template when the email address on the gift card is the store email.

In this use case, the store wants to offer an option for a physical gift card. The product add-to-cart is set up so that the gift recipient email address is set to the store email (and hidden) when the customer opts to purchase a physical gift card. That address is then used to create the conditions to add the Transaction ID to the template. Additional fields, such as the mailing address for the card, could be added.

The example is at PasteBin here: https://pastebin.com/raw/PkdT4WNY

Available Twig Variables

Gift Card Language

{{ lang.gift_card_header }}
{{ lang.from }}
{{ lang.code }}
{{ lang.start_shopping }}

Store Data

{{ store_data.logo_url }}
{{ store_data.name }}
{{ store_data.url }}

Transaction Data

{{ transaction_data.id }}
{{ transaction_data.display_id }}
{{ transaction_data.is_test }}
{{ transaction_data.hide_transaction }}
{{ transaction_data.data_is_fed }}
{{ transaction_data.type }}
{{ transaction_data.source }}
{{ transaction_data.transaction_date }}
{{ transaction_data.locale_code }}
{{ transaction_data.customer_first_name }}
{{ transaction_data.customer_last_name }}
{{ transaction_data.customer_tax_id }}
{{ transaction_data.customer_email }}
{{ transaction_data.customer_ip }}
{{ transaction_data.ip_country }}
{{ transaction_data.user_agent }}
{{ transaction_data.total_item_price }}
{{ transaction_data.total_tax }}
{{ transaction_data.total_shipping }}
{{ transaction_data.total_future_shipping }}
{{ transaction_data.total_order }}
{{ transaction_data.status }}
{{ transaction_data.date_created }}
{{ transaction_data.date_modified }}
{{ transaction_data.currency_code }}
{{ transaction_data.currency_symbol }}

Items (Array)

{{ transaction_data._embedded["fx:items"][].item_category_uri }}
{{ transaction_data._embedded["fx:items"][].name }}
{{ transaction_data._embedded["fx:items"][].price }}
{{ transaction_data._embedded["fx:items"][].quantity }}
{{ transaction_data._embedded["fx:items"][].quantity_min }}
{{ transaction_data._embedded["fx:items"][].quantity_max }}
{{ transaction_data._embedded["fx:items"][].weight }}
{{ transaction_data._embedded["fx:items"][].code }}
{{ transaction_data._embedded["fx:items"][].parent_code }}
{{ transaction_data._embedded["fx:items"][].discount_name }}
{{ transaction_data._embedded["fx:items"][].discount_type }}
{{ transaction_data._embedded["fx:items"][].discount_details }}
{{ transaction_data._embedded["fx:items"][].subscription_frequency }}
{{ transaction_data._embedded["fx:items"][].subscription_start_date }}
{{ transaction_data._embedded["fx:items"][].subscription_next_transaction_date }}
{{ transaction_data._embedded["fx:items"][].subscription_end_date }}
{{ transaction_data._embedded["fx:items"][].is_future_line_item }}
{{ transaction_data._embedded["fx:items"][].shipto }}
{{ transaction_data._embedded["fx:items"][].url }}
{{ transaction_data._embedded["fx:items"][].image }}
{{ transaction_data._embedded["fx:items"][].length }}
{{ transaction_data._embedded["fx:items"][].width }}
{{ transaction_data._embedded["fx:items"][].height }}
{{ transaction_data._embedded["fx:items"][].expires }}
{{ transaction_data._embedded["fx:items"][].date_created }}
{{ transaction_data._embedded["fx:items"][].date_modified }}

Item Options

{{ transaction_data._embedded["fx:items"][]._embedded["fx:item_options"].name }}
{{ transaction_data._embedded["fx:items"][]._embedded["fx:item_options"].value }}
{{ transaction_data._embedded["fx:items"][]._embedded["fx:item_options"].price_mod }}
{{ transaction_data._embedded["fx:items"][]._embedded["fx:item_options"].weight_mod }}

Gift Card Codes

{{ transaction_data._embedded["fx:items"][]._embedded["fx:gift_card_codes"].code }}
{{ transaction_data._embedded["fx:items"][]._embedded["fx:gift_card_codes"].current_balance }}
{{ transaction_data._embedded["fx:items"][]._embedded["fx:gift_card_codes"].end_date }}

How to Add Your Custom Template

  1. In the Foxy admin at https://admin.foxy.io, go to Settings→Emails.
  2. Scroll down to Templates and select your desired gift card email template. If you don’t see anything there, you should review our main gift card documentation on setting up the gift card email here.
  3. Under the HTML Template option, select Upload source code.
  4. Paste your custom template code into the Source text box and click Save.
Note that when you make changes to the template in the admin, it can potentially save if there is an error in your code. If you don’t receive the email when testing, you’ll want to check the template to see if there are any mistakes in the modifications that you’ve made.

Site Tools