TrackMageThere are two methods available to embed a Tracking page on your site. The first is straightforward: just copy the Tracking page link and add it to your site. This directs clients to the Tracking page when clicked. Alternatively, embed the Tracking page code into existing store pages. This ensures the Tracking page is seamlessly displayed within your site. Note. The Branded tracking page is automatically generated upon integrating with Shopify or WooCommerce and serves as the default page. Minor adjustments may be needed to align with your store's design. Styles will be reflected across the Tracking and Search pages, Tracking widgets, and Product slider. Below are steps to embed the Tracking page on your Shopify or WooCommerce stores: 1. Embedding the Tracking page link on Shopify. 2. Embedding the Tracking page code on Shopify. 3. Embedding the Tracking page link on WooCommerce. 4. Embedding the Tracking page code on WooCommerce. 1. Embedding the Tracking page link on Shopify 1). Log in to your TrackMage account and navigate to Tracking Pages. Select the default tracking page and click the Copy button on the Add Order Lookup Page to Your Website tab. 2). Access your Shopify store admin account. In the side menu, go to Online Store > Navigation. On the Menu tab, select the Main menu link, then click + Add menu item. In the right slider window, enter the name for the link in the name field and paste the copied link in the field below. Click Add to proceed, then Save menu to complete. 3). Next, return to the side menu and press the preview icon. You'll be taken to the store site, where the added link will appear on the header. Click on the Track My Order link to access the tracking page. Your store's customers can input their order number, tracking number, or email to view parcel tracking data. 2. Embedding the Tracking page code on Shopify 1). Sign in to your TrackMage account and go to Tracking Pages. Choose the default tracking page and then click on the Tracking Widgets tab. Find the Copy Code button below the Full Tracking Page embeddable code bar and click on it. 2). Now, let's insert the Full tracking page code into the store page. You can paste the code into any existing page, but for this example, we'll create a new page. Navigate to Pages in the side menu. Click Add page to name the page in the Title field, then switch to code mode by clicking on the arrows icon and paste the copied code into the Content field. 2). Next, repeat Step #2 from the previous paragraph, but this time choose Pages instead of Link, then Track My Order page in the drop-down. Save your progress. 3). Next, return to the side menu and press the preview icon. You'll be taken to the store site, where the added page will appear on the header. Click the Track My Order link on the header of the store to view the Tracking page embedded in the store page. Your store's customers can input their order number, tracking number, or email to view parcel tracking status. You can still customize the design of the page using the Visual Builder. Note. Please be aware that the structure of your WordPress site may vary depending on the theme or customizations. In our example, the link may be placed in the footer, while the Full tracking page code is inserted into a page accessible from the navigation menu (see next steps). There is another more flexible option for embedding the Tracking page on your site: explore the Tracking page embeddable widgets documentation and follow the guide. If you need help, please don't hesitate to contact us via chat or send a message to support@trackmage.com.
Embed a Tracking Page on a Site
3. Embedding the Tracking page link on WooCommerce
1). Firstly, repeat Step #1 from the first paragraph to copy the Tracking page link.
2). Log in to your WordPress admin account. Find the Store menu in the header of the bar and select Visit site from the dropdown. Click the Edit site button on the admin bar above the site. Once the left side menu appears, choose Footer from the options. Navigate to the Quick Links menu and activate it to add a new link field using the plus icon. Save changes to complete.
3). Return to the site page. Click the Track My Order link in the Quick Links menu. Observe as the Branded Search page opens in the same browser tab.
Your store's customers can input their order number, tracking number, or email to view parcel tracking status.
4. Embedding the Tracking page code on WooCommerce
1). Initially, follow Step #1 outlined in the second paragraph to copy the Full tracking page code.
2). Sign in to your WordPress admin account. Locate the Store menu on the header bar and choose Pages from the left menu. Click on Add New Page from the drop-down to access the page editor. Then, input a title in the Add Title field and paste the copied code into the content area. Ensure to select the block type as Custom HTML. Finally, publish the changes to finalize the process.
3). Return to the site page. Find the burger menu and click the Track My Order on the unfolded menu. Observe as the Branded Search page opens on the store page.
Your store's customers can input their order number, tracking number, or email to view parcel tracking status. You can still customize the design of the page using the Visual Builder.