Customize the order status page

Also in this section

• Add conversion tracking
• Run scripts only on first visit
• Order status JavaScript asset
• Show content based on customers' locations
• Show content based on an order for a particular product
• Show content based on shipping method

Customize your order status page to display options and messages based on your customer's needs.

Shopify Plus

If you have a Shopify Plus subscription, then you gain access to the checkout.liquid layout and checkout.scss.liquid asset file, giving you full control to make advanced customizations to your checkout experience.

Add a customer opt-in for order updates

Customers receive order updates by email or phone, depending on the information they enter during checkout. You can enable a button to let your customers opt in to order updates after an order is placed. When the opt in button is enabled, customers can add a phone number or email address on the order status page.

Steps:

1. From your Shopify admin, click Settings > Checkout.
2. Under Customer contact, check Additional contact method.

   

3. Click Save.

Translate your order status page

You have the same control over the language used on your order status page that you do over the rest of your Shopify store. If you translated your entire theme language, then your order status page is already in your chosen language.

You can also translate your messaging line by line if the default text doesn't fit your branding. For example, the first line of the order status page reads "Thank you, John", but could be translated to "Thanks, John!".

Follow Change the wording in themes to customize your translations and wording. The order status fields are under the Checkout and system tab from the Checkout thank you heading to the Checkout shop policies heading.

Note

Different fields appear on the order status page depending on whether the status is confirmed, on its way, out for delivery, or delivered.

Add additional scripts

Caution

This is an advanced tutorial and is not supported by Shopify. Knowledge of HTML, CSS, JavaScript, and Liquid is required. Consider hiring a Shopify Expert if you aren't comfortable doing the steps in the tutorial.

The Additional scripts box is used to insert code into the template for your order status page. You can add any of the following:

• HTML - You can use any valid HTML5 code, for example script, style, iframe, and object elements.

• Liquid code - You have access to the checkout and shop Liquid objects. To learn more about their attributes, refer to The checkout object and The shop object.

• Tracking scripts - You can add tracking scripts to track referrals, return on investment, or conversions.

Example customizations using additional scripts

Here are some example customizations that use the Additional scripts field:

• Add conversion tracking to your order status page
• Show content when a particular shipping method is used
• Show content when a particular product is in the order
• Show content based on customers' locations
• Add a message to your order status page using a JavaScript object

Access the additional scripts

Desktop

To access additional scripts, start from your Shopify admin, and go to Settings > Checkout. Under Order processing you find the Additional scripts section.

Mobile

To access additional scripts, start from your Shopify app and go to Store > Checkout. Under Store settings, tap Checkout. Under Order processing, you find the Additional scripts section.