Template Pages

Change the design of your Checkout Pages

Purpose: This template defines the layout of the checkout “thank you” page, the page which is displayed when an order has been placed.

Notes: The template contains a table and displays the “thank you” message specified on the payment method (Using “Confirmation Msg:”). This template could also include all of the blocks from the invoice_print template if you wanted to display a complete invoice to the client.

Code Blocks within Template:

"CATEGORY_HEADER" Used to place HTML content on the top of this page, changeable from settings -> Design -> Titles & Content

"CATEGORY_FOOTER" Used to place HTML content on the bottom of this page, changeable from settings -> Design -> Titles & Content

As well as all the code blocks from invoice_print.html template.

Note: It is important to preserve the commented tags to ensure the software performs correctly.

For example:


<!--------------------- BEGINNING OF CHECKOUT STEP 4 ------>
	<!-START: 3stepsCheckout-->
		[checkout1_step]
		[checkout2_step]
		[checkout3_step]
		[checkout4_step]
	<!-END: 3stepsCheckout-->
	<!-START: CATEGORY_HEADER-->
		[CONTENT]
	<!-END: CATEGORY_HEADER-->
	<!-START: ordercompleted-->
	<!-START: invoicedata-->
		[checkout4_invoicemessage]
	<!-END: invoicedata-->
		[thankyoumessage]
	<!-END: ordercompleted-->
		[invoice-prefix]
		[invoice-number]
	<!----- START: Confirmation ---------------------------------->
		<!-start customer info block-->
			<!-START: invoicelogo-->
				[invoicelogo]
			<!-END: invoicelogo-->
				[company]
				[address1]
			<!-START: address2-->
				[address2]
			<!-END: address2-->
				[city]
				[state]
				[zip]
		<!- end customer info block-->
		<!-start invoice info block-->
				[invoice_dateordered]
				[odate_month]
				[odate_day]
				[odate_year]
				[invoice_ordernum]
				[invoice-prefix]
				[invoice-number]
			<!-START: salesperson-->
				[salesperson]
			<!-END: salesperson-->
		<!-end invoice info block-->
		<!-start billing block-->
				[invoice_billingaddress]
				[ofirstname]
				[olastname]
			<!-START: ocompany-->
				[ocompany]
			<!-END: ocompany-->
				[oaddress]
			<!-START: oaddress2-->
				[oaddress2]
			<!-END: oaddress2-->
				[ocity]
				[ostate]
				[ozip]
				[ocountry]
			<!-START: ophone-->
				[ophone]
			<!-END: ophone-->
			<!-START: oemail-->
				[oemail]
			<!-END: oemail-->
		<!-end billing block-->
		<!-start shipping block-->
				[invoice_shippingaddress]
				[oshipfirstname]
				[oshiplastname]
			<!-START: oshipcompany-->
				[oshipcompany]
			<!-END: oshipcompany-->
				[oshipaddress]
			<!-START: oshipaddress2-->
				[oshipaddress2]
			<!-END: oshipaddress2-->
				[oshipcity]
				[oshipstate]
				[oshipzip]
				[oshipcountry]
		<!-end shipping block-->
			[invoice_shipmethod]
			[oshipmethod]
			[totalweight]
		<!-START: trackingcode-->
			[invoice_trackingnum]
			[trackingcode]
			[trackingcode]
		<!-END: trackingcode-->
		<!-START: oshippeddate-->
			[invoice_shippeddate]
			[oshippeddate]
		<!-END: oshippeddate-->
		<!-START: opaymethod-->
			[invoice_paymenttype]
			[opaymethod]
		<!-END: opaymethod-->
		<!-START: coupon-->
			[invoice_discounts]
			[invoice_coupon]
			[coupon]
			[coupondiscount]
		<!-END: coupon-->
			[shoppingcart_itemid]
			[shoppingcart_items]
			[shoppingcart_price]
			[shoppingcart_quantity]
			[shoppingcart_total]
		<!-START: items-->
			[id]
			[itemname]
			[unitprice]
			[numitems]
			[subtotal]
		<!-END: items-->
		<!-START: invoice_terms-->
			[invoice_terms]
		<!-END: invoice_terms-->
			[shoppingcart_subtotal]
			[subtotal]
			[shoppingcart_discount]
			[discounts]
		<!-START: TAX-->
			[shoppingcart_taxes]
			[tax]
		<!-END: TAX-->
		<!-START: TAX2-->
			[shoppingcart_taxes2]
			[tax2]
		<!-END: TAX2-->
		<!-START: TAX3-->
			[shoppingcart_taxes3]
			[tax3]
		<!-END: TAX3-->
			[shoppingcart_shipping]
			[shipping]
			[shoppingcart_total]
			[ototal]
		<!-START: GIFTCERTS-->
			[shoppingcart_giftcertificate]
			[GIFTCERTS]
			[shoppingcart_balance]
			[BALANCE]
		<!-END: GIFTCERTS-->
	<!----- END: Confirmation ------------------------------------>
	<!-START: CATEGORY_FOOTER-->
		[CONTENT]
	<!-END: CATEGORY_FOOTER-->
<!--------------------- END OF CHECKOUT STEP 4 ------>

Note: Code blocks and their respective variables will only work with specific template pages.

Note: Several of these variables are used in multiple places on the page, with their dynamic content controlled by the code block used in each instance.

  • [checkout1_step] - If multi-page checkout is enabled on the store, this variable displays the Title of the "Step 1" Checkout Step Process at the top of the page. (See Settings ->Design ->Store Language)
  • [checkout2_step] - If multi-page checkout is enabled on the store, this variable displays the Title of the "Step 2" Checkout Step Process at the top of the page. (See Settings ->Design ->Store Language)
  • [checkout3_step] - If multi-page checkout is enabled on the store, this variable displays the Title of the "Step 3" Checkout Step Process at the top of the page. (See Settings ->Design ->Store Language)
  • [checkout4_step] - If multi-page checkout is enabled on the store, this variable displays the Title of the "Thank You" Checkout Step Process at the top of the page. (See Settings ->Design ->Store Language)
  • [checkout4_invoicemessage] - Displays the Title of "Your Invoice" header on the page. (See Settings ->Design ->Store Language)
  • [thankyoumessage] - Displays the Title of the "Thanks for your order!" message on the page which is taken from the Confirmation Msg: configured on the order's payment method.
  • [invoicenum_prefix] - Inserts the order invoice's prefix.
  • [invoicenum] - Inserts the order invoice's sequential order number.
  • [invoicelogo] - Inserts the store's Invoice logo (See Settings ->General ->Merchant Information)
  • [company] - Inserts the store's Company Name information. (See Settings ->General ->Merchant Information)
  • [address1] - Inserts the store's Company Address information (See Settings ->General ->Merchant Information)
  • [address2] - Inserts the store's Company Address 2 information (See Settings ->General ->Merchant Information)
  • [city] - Inserts the store's Company City information (See Settings ->General ->Merchant Information)
  • [state] - Inserts the store's Company State information. (See Settings ->General ->Merchant Information)
  • [zip] - Inserts the store's Company Zip information. (See Settings ->General ->Merchant Information)
  • [invoice_dateordered] - Displays the Title of the "Date Ordered" heading. (See Settings ->Design ->Store Language)
  • [odate_month] - Inserts the Month of the order's placement.
  • [odate_day] - Inserts the Day of the order's placement.
  • [odate_year] - Inserts the Year of the order's placement.
  • [invoice_ordernum] - Displays the Title of the "Order Number:" heading. (See Settings ->Design ->Store Language)
  • [invoice_billingaddress] - Displays the Title of the "Billing Address" header. (See Settings ->Design ->Store Language)
  • [ofirstname] - Inserts the shopper's billing First Name.
  • [olastname] - Inserts the shopper's billing Last Name.
  • [ocompany] - Inserts the shopper's billing Company name.
  • [oaddress] - Inserts the shopper's billing Address information.
  • [oaddress2] - Inserts the shopper's billing Address 2 (Suite/Apt#) information.
  • [ocity] - Inserts the shopper's billing City information.
  • [ostate] - Inserts the shopper's billing State information.
  • [ozip] - Inserts the shopper's billing Zip/Postalcode information.
  • [ocountry] - Inserts the shopper's billing Country information.
  • [ophone] - Inserts the shopper's billing Phone information.
  • [oemail] - Inserts the shopper's billing Email informaiton.
  • [invoice_shippingaddress] - Displays the Title of the "Shipping Address" header. (See Settings ->Design ->Store Language)
  • [oshipfirstname] - Inserts the order's shipping First Name.
  • [oshiplastname] - Inserts the order's shipping Last Name.
  • [oshipcompany] - Inserts the order's shipping Company information.
  • [oshipaddress] - Inserts the order's shipping Address information.
  • [oshipaddress2] - Inserts the order's shipping Address 2 (Suite/Apt#) information.
  • [oshipcity] - Inserts the order's shipping City information.
  • [oshipstate] - Inserts the order's shipping State information.
  • [oshipzip] - Inserts the order's shipping Zip/Postal Code information.
  • [oshipcountry] - Inserts the order's shipping Country information.
  • [invoice_shipmethod] - Displays the Title of the "Shipping Method" header. (See Settings ->Design ->Store Language)
  • [oshipmethod] - Inserts the order's selected Shipping Method
  • [totalweight] - Inserts the combined shipping weight of the order.
  • [invoice_paymenttype] - Displays the Title of the "Payment Type" header. (See Settings ->Design ->Store Language)
  • [opaymethod] - Inserts the order's payment method used.
  • [invoice_discounts] - If gift certificate or promotion coupon is used on the order, this variable displays the Title of the "Discounts" header. (See Settings ->Design ->Store Language)
  • [invoice_coupon] - If gift certificate or promotion coupon is used on the order, this variable displays the Title of the "Coupon:" section. (See Settings ->Design ->Store Language)
  • [coupon] - If gift certificate or promotion coupon is used on the order, this variable inserts the gift certificate/coupon code entered.
  • [coupondiscount] - If gift certificate or promotion coupon is used on the order, this variable inserts the applicable discount.
  • [shoppingcart_itemid] - Displays the Title of the "Item ID" header on the invoice summary. (See Settings ->Design ->Store Language)
  • [shoppingcart_items] - Displays the Title of the "Items" header on the invoice summary. (See Settings ->Design ->Store Language)
  • [shoppingcart_price] - Displays the Title of the "Price" header on the invoice summary. (See Settings ->Design ->Store Language)
  • [shoppingcart_quantity] - Displays the Title of the "QTY" header on the invoice summary. (See Settings ->Design ->Store Language)
  • [shoppingcart_total] - Displays the Title of the "Total" header on the invoice summary. (See Settings ->Design ->Store Language)
  • [id] - Inserts the item SKU/ID information in the invoice summary.
  • [itemname] - Inserts the Name of the item in the invoice summary.
  • [unitprice] - Inserts the product's unit price.
  • [numitems] - Inserts the total number of items ordered.
  • [subtotal] - Inserts the sub-total of items ordered.
  • [invoice_terms] - Displays the Text entered in your store's Invoice Terms section. (See Settings ->General ->Merchant Information)
  • [shoppingcart_subtotal] - Displays the Title of the order's "Subtotal:" line. (See Settings ->Design ->Store Language)
  • [shoppingcart_discount] - Displays the Title of the order's "Discount(s):" line. (See Settings ->Design ->Store Language)
  • [discounts] - Inserts the applied discount amount.
  • [shoppingcart_taxes] - Displays the Title of the order's "Taxes:" line. (See Settings ->Design ->Store Language)
  • [tax] - Inserts the order's applicable tax charges
  • [shoppingcart_taxes2] - If international/multi tax option is applicable, this variable displays the Title of the order's "Tax 2:" line. (See Settings ->Design ->Store Language)
  • [tax2] - Inserts the order's applicable Tax2 charges
  • [shoppingcart_taxes3] - If international/multi tax option is applicable, this variable displays the Title of the order's "Tax 3:" line. (See Settings ->Design ->Store Language)
  • [tax3] - Inserts the order's applicable Tax3 charges
  • [shoppingcart_shipping] - Displays the Title of the order's "Subtotal:" line. (See Settings ->Design ->Store Language)
  • [shipping] - Inserts the order's applicable Shipping charges
  • [shoppingcart_total] - Displays the Title of the order's "Subtotal:" line. (See Settings ->Design ->Store Language)
  • [ototal] - Inserts the shopping cart's Order Total information.
  • [shoppingcart_giftcertificate] - Displays the Title of the order's "Subtotal:" line. (See Settings ->Design ->Store Language)
  • [GIFTCERTS] - Inserts the Gift Certificate amount applied tothe order.
  • [shoppingcart_balance] - Displays the Title of the order's "Subtotal:" line. (See Settings ->Design ->Store Language)
  • [BALANCE] - Displays the total Balance left on the order.

Download this Template     (Save as a backup or edit to customize)

Screenshot of the checkout-step4.html Template