Is there any replacement for Shopify.Checkout.OrderStatus.addContentBox now that Order status page additional scripts is deprecated?

Extensions
1

I’ve been using the Additional Scripts box on the checkout settings to display a content box based on order tags and fulfilment status.

It says ‘Additional scripts is deprecated. your current customizations, then recreate the customizations you want to keep using pixels in [customer events] and app blocks in the editor.’

I can’t seem to find any examples of how to migrate this using either pixels or app blocks - is it possible?

I am not using Shopify Plus.

Here’s the code:

<script>

const tags = {{ checkout.order.tags | json }};
const fulfillment = {{ checkout.order.fulfillment_status | json }};
let progress_message = '';

if (fulfillment == 'partial') {
	progress_message = 'Orders with multiple items are manufactured and shipped separately as soon as possible.<br><br>Your mats still in production are ';
}
if (fulfillment == 'unfulfilled') {
	progress_message = 'Your mats are ';
}



if (progress_message) {
	
	if (tags.includes('x READYFORSHIPPING')) {
		progress_message += 'packed and on their way to Evri.  You will be emailed your tracking links shortly.';
	}
	else if (tags.includes('x EMBROIDERY')) {
		progress_message += 'now being embroidered.';
	}
	else if (tags.includes('x SEWING_MACHINIST')) {
		progress_message += 'currently being sewn.';
	}
	else if (tags.includes('x CUTTER')) {
		progress_message += 'being expertly cut by a CNC cutting machine to fit your vehicle.';
	}
	else {
		progress_message += 'ready to go into production. Our team are getting ready.';
	}
	
 Shopify.Checkout.OrderStatus.addContentBox(
		'<div class="text-container"><h2>Order status</h2><p>' + progress_message + '</p></div>'
	)
}
</script>
2

If you’re adding content like this you’ll need to utilize Checkout UI Extensions

3

Do I need to have a Shopify Plus account for this?

4

Hi Ashley,

You would only need to have a Plus account if you were trying to add UI Extensions to the actual checkout itself. But much like additional scripts allowed, any plan is able to add UI Extensions to the Thank You and Order Status Page (there is a note of this availability here).

The APIs you’ll want to use are actually the Customer Account Extension APIs for targets on the Order Status Page. The Checkout Ui Extensions would be for the Thank You Locations.

For what you’re trying to do in your existing code, I would suggest starting with the Banner and seeing if that suits your needs.

To get the fulfillment status, you can use the Customer Account Extensibility API to query the Fulfillment Status, and you may consider querying the Fulfilment more generally.

Hopefully this helps get you underway!

2 Likes
5

Perfect - thanks John!

1 Like
6

Hi John,

Following your direction, and with hope we won’t need a Plus subscription, I tried creating a Checkout UI Extension for our Thank You page to include the Google Opt-In Customer Review script, however no matter what we tried, we couldn’t find a way to inject the script into the page. On further investigation, we found that as of 1 Feb 2025 ScriptTags on Thank you and Order Status pages can no longer be created, which I assume prevents us from injecting the Google opt-in script, or any other content in a page.

Are you able to confirm this is the case, or have we missed something? Without scripting the only other way we think this might work is including a parameterised link to another server that executes the script, which is not great for UX, as they now have to agree to the survey twice.

Many Thanks
Steve

7

Hi Steve,

You’re correct that Script Tags are no longer supported, and because Ui Extensions are sandboxed, you can’t directly inject the script into the page, nor is the a “script container” like Ui Component. Ideally Google would build their own Ui Extension to handle this, but in any case we recognize this isn’t an ideal situation.

Hopefully there will be a better solution in the future, but for now, you are somewhat limited to redirecting the customer via a link to the survey, or using an existing app such as easy Google Customer Reviews - Google Customer Reviews app for Shopify | Shopify App Store.

Other app options:

Interacting with the existing script using the available Ui Components would be quite challenging. You aren’t alone with this particular challenge though.

I’m sure you were hoping for a better immediate solution, but I hope this helps clarify things at least.