Add Track Button to 3dcart Store

With the AfterShip Track Button code, tracking functionality can be easily enabled on any of the web pages and/or 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 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 below-mentioned code and paste in 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 changes

You can also replace data-domain="track.aftership.com" with AfterShip username or 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 below-mentioned code

<a href="shiptracking.asp?trackingnumber=[trackingcode]" target="new">[trackingcode]</a>

Replace it with the below code snippet

<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 changes

Updated on: 07/10/2022