Add Track Button to Magento 1 Store

Magento is one of the most popular eCommerce systems, written in PHP. You can insert the AfterShip Track Button to your store by embedding just a few lines of code.

🔧 Add a new Web Page

Login to Magento admin dashboard > CMS > Pages (top navigation) > Add New Page
Enter title (e.g. Track Your Order) > Enter URL Key (e.g. track-your-order)
Set status Enabled
Save changes

🔧 Insert Track Button

Login to Magento admin dashboard > CMS > Pages (top navigation)
Select a web page to add Track Button
Go to Content menu > Show/Hide editor
Copy 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 class="as-track-button" data-domain="track.aftership.com" data-size="large"></div>

Save page

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

Access FTP and open folder: app/design/frontend/base/xxxxxx/template/shipping/tracking/
Edit popup.html theme
Search for below-mentioned code

 <?php $_results = $this->getTrackingInfo(); ?>

Insert below code snippet after it

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

Search for below-mentioned code

<td class="value">
<?php echo $this->escapeHtml($track->getTracking()); ?>
</td>

Replace with below code

<td class="value">
<div class="as-track-button" data-size="small"data-tracking-number="<?php echo $this->escapeHtml($track->getTracking()); ?>" data-domain="track.aftership.com"></div>
</td>

Search for below-mentioned code

<td class="value">
<?php echo (isset($track['number']) ? $this->escapeHtml($track['number']) : ''); ?>
</td>

Replace with below code

<td class="value">
<div class="as-track-button" data-size="small" data-tracking-number="<?php echo (isset($track['number']) ? $this->escapeHtml($track['number']) : ''); ?>" data-domain="track.aftership.com"></div>
</td>

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

Updated on: 07/10/2022