Articles on: Branded Tracking Page

Add Track Button to WooCommerce Store

Plans: All plans Platforms: All platforms


WooCommerce is an open-source eCommerce plugin for WordPress. It can easily add eCommerce functionality to the WordPress website. With just a few clicks the plugin can be installed on the WordPress dashboard and set up to get the store up and running.

To give your customers one-click order tracking experience, you can install AfterShip Track Button to your WooCommerce store backed with AfterShip's shipment tracking functionality for a smooth post-purchase experience in a few simple steps.

What you'll learn

In this tutorial, we'll discuss:

Set up order lookup widget
Add track button to a new page in WooCommerce
Insert Track Button to Order History Page

Set up order lookup widget

Before adding the track button to your WooCommerce store, set up how it will work and look in the AfterShip Tracking admin and copy the subsequent code to insert in WooCommerce.

Find the complete guide here.

Add track button to a new page in WooCommerce


1. Add a new Web Page

Log in to Wordpress admin panel
Go to Pages > Add new > Enter title

2. Insert Track Button

Log in to Wordpress admin panel > Pages > Select a web page to add Track Button
Click the + icon > Custom HTML
Paste the code you copied from the AfterShip admin in the HTML editor

For example:

<div id=“as-root”></div><script>(function(e,t,n){var r,i=e.getElementsByTagName(t)[0];if(e.getElementById(n))return;r=e.createElement(t);;r.src=“”;i.parentNode.insertBefore(r,i)})(document,“script”,“aftership-jssdk”)</script>

<div class=“as-track-button” data-size=“medium” data-domain=“” data-look-up-option=“both” data-btn-label=“Track”></div>


You can also replace data-domain="" with AfterShip username or custom domain and apply your carrier settings.

Click on View page to see how the track button looks on your website

Insert Track Button to Order History Page

Log in to your Wordpress admin panel. Scroll down to access the last menu items. You will see AfterShip Tracking option. Click on it to open the settings page of the app.

Select the checkbox for Use Track Button at Order History Page

Save changes

Customer experience

The AfterShip Track Button will appear on the order history page once the tracking number is generated for the order on WoCommerce.

Updated on: 06/05/2024

Was this article helpful?

Share your feedback


Thank you!