website logo
⌘K
Introduction
PORTAL
Agency Whitelabelling
PAGES
Pages - Accessing Page Data
Pagination Layouts
Page Templates
FORMS
Form Confirmation Pages
Adding a Progress Bar
Adding Custom CSS To Show Form Submit Process
Dynamic Content in Workflow and Autoresponder Emails
How to output Custom Field Set fields in a Form's Custom Layout
Custom JavaScript Validation for Forms
File Upload Previews
FAQ
CATEGORIES
Filtering WebApps and Modules by Categories
Outputting Categories on WebApp / Module / eCommerce Layouts
Outputting Category Fields in any Location
Category Detail Layouts
FAQ
COMPANY INFORMATION
Company Information
SITE SEARCH
Site Search
PUBLIC API/ZAPIER
Zapier - Formatting arrays correctly
Public API/Zapier Changelog
MODULES
Module Marketplace
Building Custom Modules
Siteglide Modules
Front-end Submit Modules
DATA STRUCTURES
Automations
Creating WebApps from the CLI
Field Types
WEBAPPS
Front-end Submit WebApps
Layouts
Search and Filtering
Understanding Custom Field Names and IDs
FAQ
CRM
User Details
User Secure Zones
Storing User's Favourite WebApp / Module Items
User's Form Submissions (Cases)
How Users Edit their Email and Password Front End
Editing a User's CRM record Front End with Custom Field Sets
CLI
Introducing Siteglide CLI
CLI Changelog
Secure Zones with CLI
Page Templates with Siteglide CLI
Pages with Siteglide CLI
Includes with Siteglide CLI
Managing Email Templates
Migrate - Manual Form setup
Migrate - Convert existing Forms
Liquid
Accessing Assets
Liquid Dot Notation
Using WebApp Collections- Tutorial
Using the current_user object with Secure Zones
Preventing Duplicate Content with Query Parameters- Canonical URL and Robots.txt
FAQ
GraphQL
Tutorial Overview
About GraphQL
Tutorial 1- Your First Query
Tutorial 2 - Pagination
Tutorial 3 - Filtering the Results
Tutorial 3 - Answers to the First Filtering Challenge
Tutorial 4 - Advanced Filtering
Tutorial 4 - Challenge Answers
Tutorial 5 - Using Liquid to run GraphQL queries on your Site
Tutorial 6 - Variables
Tutorial 6 - Answers to the Variables Challenge
Tutorial 7 - Sorting
Tutorial 8 - Building a Liquid API GET Endpoint Page powered by GraphQL queries
Best Practice and Performance
Module/WebApp Caching
Getting Started with Liquid Caching - to Reduce Server Response time and Improve Performance
Includes
ecommerce/checkout_standard
Frequently Asked Questions
Using Liquid Logic to Check if a field exists, or is empty on the Front End
How do I learn more about Liquid?
How to setup a multi domain start page
Docs powered by archbee 
21min

Order Confirmation Emails

Use Workflow and Autoresponder Emails to send confirmation messages to customers, including a detailed breakdown of their Order.

Prerequisites

  • You have installed eCommerce Module v0.12.0 or later. Checkout Modules Overview to find out how you can install the latest version.
  • You have set up a Checkout or Quote-only Form. Learn more about Checkout here: How to Set Up a Shopping Cart and Guest Checkout or learn more about the Quote-only feature here: eCommerce - Quote Only

Introduction

You can now add details of a customer's eCommerce Order to Workflow and Autoresponder transactional emails. Give your Client and the customer peace of mind, as well as valuable records for their safekeeping. eCommerce Orders are created by Checkout and Quote-only Forms.  Within the email, you can also access any fields that were submitted along with the original Form. Learn more here: Dynamic Content in Workflow and Autoresponder Emails

Syntax

Add the following Liquid tag to include the details of the customer's most recent Order: {% include 'ecommerce/order_details', layout: 'email' %} In an email notification, this will always be based on the Form that triggered the email. Only an Order generated by that Form submission will be visible in this context. This means that Autoresponder emails will always show Form Submission data from the correct User. 

Layouts

File Structure

You can use an existing Layout, or create a new one in this File Structure: layouts/modules/module_14/order/my_layout/ Within your Layout folder, you'll need:

  • An item.liquid and a wrapper.liquid file
Document image

Developing the Layout

Inside your email notification file, you'll have access to the Form object: {{form.properties}} This contains the fields submitted with the Form. Learn more here: Dynamic Content in Workflow and Autoresponder Emails You'll still have access to these fields throughout the Order Details Layouts. Inside your  order_details  layout you'll find an item.liquid and wrapper.liquid file.

Wrapper

You can use the wrapper.liquid file to build the main HTML structure of your Layout. When you're ready to include the Order Details, use the following Liquid to include the item.liquid file:

HTML
|

Item

The item.liquid file will have access to the This object, which will contain details about the Order:{{this}}

Orders involve several different types of models and can be complex. When developing you will need to use loops to take into account each different eCommerce element which may be a part of the Order.

When developing a custom layout, it may be helpful to refer to the default Layout. Looping over Products This loop will find any Products in the Order and loop over them.

HTML
|

Looping over Products and accessing Fields Within a Product Loop, you can access the fields associated with that Product.

  • {{ product.product_name }} 
  • {{ product.quantity }}
  • {{ product.product_code }}
  • {{ product.currency_symbol }}
  • {{ product.price }}

Looping over Products, then looping over Attributes

HTML
|

Outputting Shipping Method The following fields are available relating to the Shipping Method:

  • this['Shipping Method Name']
  • this['Currency Symbol']
  • this['Shipping Method Price']
  • {%- include 'modules/siteglide_ecommerce/ecommerce/price_formatter', price_data: this['Shipping Method Price'] -%} - a formatted Shipping Price

Example of only including Shipping Information if it was set:

HTML
|

Outputting Totals

  • {{ this['Currency Symbol'] }}
  • this['Total Price']
  • {%- include 'modules/siteglide_ecommerce/ecommerce/price_formatter', price_data: this['Total Price'] -%} - A formatted total price
Updated 06 May 2022
Did this page help you?
Yes
No
UP NEXT
Basic Payment Forms - Tutorial
Docs powered by archbee 
TABLE OF CONTENTS
Prerequisites
Introduction
Syntax
Layouts
File Structure
Developing the Layout
Wrapper
Item