Overview
You can add the AfterShip Track Button to your 3dcart store to let customers track shipments directly from your website. This guide walks you through adding the Track Button to custom pages and the order history page.
Add a new web page
Log in to your 3dcart store > Content > Site content > Footer Extra Pages > Edit
Add a new page by clicking the “+” button > Enter required details
Save the changes.
Insert track button
Log in to your 3dcart store > Content > Site content > Footer Extra Pages > Edit
Select the page to add Track Button > Settings action button > Content > View source code
Click “<>” action button to edit code (under page-content)
Copy the code below and paste it into the editor:
<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.id=n;r.src="//button.aftership.com/all.js";i.parentNode.insertBefore(r,i)})(document,"script","aftership-jssdk")</script> <div data-domain="track.aftership.com" data-size="large" class="as-track-button"></div>Save the changes.
You can also replace data-domain="track.aftership.com" with an AfterShip username or a custom domain and apply your carrier settings.
Insert track button to order history page
Log in to your 3dcart store > Settings > Design > Themes & Styles > More
Edit template (HTML) > Settings action button
Go to folder templates/common-core > Edit order-history-view.html
Search for the code mentioned below:
<a href="shiptracking.asp?trackingnumber=[trackingcode]" target="new">[trackingcode]</a>
Replace it with the code snippet below:
<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.id=n;r.src="//button.aftership.com/all.js";i.parentNode.insertBefore(r,i)})(document,"script","aftership-jssdk")</script> <div data-domain="track.aftership.com" data-size="small"data-tracking-number="[trackingcode]" class="as-track-button"></div>Save the changes.
Key takeaways
The AfterShip Track Button allows 3dcart customers to check tracking updates directly on-site.
You can insert the button on custom pages or replace the tracking code on the order history page.
The button supports size and domain customization to match your brand.