Additional Script on Checkout Customization is Deprecated.

[paulson1]

Hi,

I have made some modifcations on Thank You page using Additional Scripts on "Order status page additional scripts". It looks like it is going to be deprecated.

There is a section called Custom Pixels, how do I move the entire Additional Scripts Code to Pixels?

Is it enough to copy the entire Thank You Page to customization code from Order status page additional scripts to Pixels?

Thanks

[akshay_bhatt]

Hi @paulson1 ,

No, you cannot directly copy the entire "Order Status Page Additional Scripts" code into Shopify's Custom Pixels section, as they function differently. Custom Pixels are specifically designed for tracking purposes (e.g., analytics, conversions) and must follow Shopify's Custom Pixel API. Here's how you can transition properly:

---

Steps to Move Additional Scripts to Custom Pixels

1. Understand Your Current Scripts

• Go to Settings > Checkout > Order Status Page > Additional Scripts.
• Identify what the script does:
  • Analytics tracking (e.g., Google, Facebook Pixel, custom tracking).
  • Custom UI or HTML modifications.
• If it's a mix of these, you'll need to separate the functionalities.

---

2. Move Tracking Scripts to Custom Pixels

• Shopify Custom Pixels are used for event tracking, such as purchases, page views, etc.
• To create a custom pixel:
  1. Go to Settings > Customer Events > Pixels.
  2. Click Create Custom Pixel.
  3. Write your JavaScript logic following the Pixel API documentation.
  4. Example: To track a purchase:

function pixelLogic(event) {
  if (event.name === "purchase") {
    console.log("Purchase event detected:", event.data);
    // Add your tracking logic here (e.g., send data to your analytics platform).
  }
}

Shopify.register('customerPixel', pixelLogic);
​

3. Handle Non-Tracking Scripts

• HTML/Styling Changes: If your script includes custom HTML or styling changes, these are not supported in Custom Pixels. You may need a Shopify app or custom checkout to implement these modifications.

• Custom Shopify Plus Checkout: For advanced checkout and Thank You page customizations, upgrade to Shopify Plus and use the checkout.liquid file.

---

4. Testing and Validation

• Once you've implemented your Custom Pixel, test it in Preview Mode under Customer Events.
• Ensure all tracking or functionalities behave as expected on the Thank You page.

Got it! If you found my suggestions helpful, please consider liking or marking it as a solution.
Your feedback is appreciated! If you have any more questions or need further assistance, just let me know.

Thanks & Regards
Akshay Bhatt

[paulson1]

Thanks @akshay_bhatt 

I want to show a Discount Voucher code on Thank You page.

My code looks like this.

{% if customer and customer.orders_count == 1 %}
  <div style="margin-top: 20px; padding: 10px; border: 1px solid #ccc;">
    <h2>Thank You for Your First Purchase!</h2>
    <p>As a special gift, here’s a 10% discount on your next order:</p>
    <h3>Use Code: WELCOME10</h3>
  </div>
{% endif %}

I was wondering what is the best option to show the code on Thank You Page if additional scripts are not going to be available.

Thanks

[Sam_Mahmud]

Hi Paulson1,

Thanks for your query.

purchase event now can be tracked using custom pixel in customer events.steps to follow:

1. create a custom data layer for purchase events and connecting GTM with That

2. Create datalayer variables like value, currency,

Feel free to ask if you have any question