Set Up and Customize the Branded Tracking Page
Overview
AfterShip Tracking provides you with your own branded tracking page, offering full customization capabilities. This enables you to offer your customers with a fully on-brand post-purchase experience and drive engagement with interactive marketing assets and product recommendations.
What you’ll learn
In this article, we will show you:
Branded tracking page customization
Configure tracking page languages
Google Analytics
Branded tracking page variations
Set up a custom domain
Branded tracking page customization
The AfterShip branded tracking page simplifies the delivery of a quick, easy, and engaging shipment tracking experience. It facilitates the establishment of trust with your customers, enhancing engagement and driving revenue through a branded, frictionless, and impactful post-purchase experience.
AfterShip’s tracking page editor enables you to customize your tracking experience to align with your branding and customer requirements. Let’s explore the customization features available with AfterShip Tracking’s suite of products and features.
Go to Tracking pages > Page variations in your AfterShip Tracking admin.
A default tracking page would already be ready with basic customization. You can also create a page from scratch or use a pre-built template.
Click Create page from the top-right corner or select from the list of templates or click Create from scratch.
Learn more about templates >
All the new and existing customers will get the option to choose the legacy themes—Basic and Nomads as well if they wish to opt for a more refined, crisp, and cleaner layouts.
If you have selected Create from scratch, you will be asked to input a name for your tracking page for easy reference. After clicking Create, you will land on our default tracking page editor, where you customize your branded tracking page based on your preference.
If you have selected one of the pre-built templates, you will again be asked to name the tracking page. After clicking Create, you will land on that template's editor, which will differ in layout but will harbor the same elements as our default tracking page editor.
If you are using the default tracking page, to go deeper with customization, click Actions > Edit to open the tracking page editor if you wish to proceed with the default page. If you are creating a new page from scratch or using a template, you will automatically land on the editor after naming your tracking page.
From the top of the page, select the page you want to edit, order lookup page or tracking results page.
If you have Gift tracking enabled in your organization, you will see the option to edit that page too in the dropdown.
a. Order lookup page: Enables customers to check the status of their order by entering the tracking number or order number along with their email/phone number.
b. Tracking results page: Allows customers to view the tracking results corresponding to the tracking number/order number they provided.
c. Gift tracking: Enables your customers to share the tracking page link of their order with the recipient of the purchased item.
You can manage various pages within each of your page variants. By customizing the displayed assets on these pages, you can ensure that shoppers receive the necessary information in a focused and relevant manner.
The tracking page editor supports 4 major elements
a. Sections
b. Widgets
c. Style
d. Settings
Sections & blocks available on each page
| Section | Tracking results page | Order lookup page |
|---|---|---|
| Tracking updates | Yes | No |
| Order lookup | No | Yes |
| Shipment reviews | Yes | No |
| Images | Yes | Yes |
| Subscription | Yes | No |
| Shipment items | Yes | No |
| Other shipments in order | Yes | No |
| Video | Yes | Yes |
| Product recommendations | Yes | Yes |
| Custom sections | Yes | Yes |
| Yes | Yes |
You can edit sections and blocks of each page separately; however, the header and footer apply to all pages within the same page variant.
Branded tracking page customization theme elements
A. Sections
The Sections tab enables you to
Customize the branding of your tracking page.
Expand customer reach to your store by setting the navigation menu.
Incorporate links to your social media pages to provide your audience with more ways to engage and interact with your brand.
Enhance engagement and customer experience by incorporating additional layout and design elements.
Access multiple subsections or design elements contributing to the structure and layout of the page, including:
Order lookup: This section allows you to customize the order lookup widget.
Select the section type: It can be in the form of Column with two additional image columns or Hero banner with a banner behind the order lookup widget.
Select the lookup option: Tracking number or order number along with the verification method.
Text: Input a title for the order lookup widget.
Based on the section type, you can configure additional settings to complete the layout configuration of the lookup widget.
Applicable only to order lookup page
Tracking updates: This section is dedicated to displaying the tracking updates of each shipment in the order.
Select the section type: It can be in the form of Column with two additional image columns or Hero banner with a banner behind the tracking updates.
a. The Hero banner layout displays only the tracking information in a clean and crisp format with an aesthetic banner behind it along with the current tracking status in a big and bold format.
b. The 3 column layout displays the compact tracking information section that holds a set of information which you can configure.
Add additional sections to add more relevant information or marketing assets to enhance customer experience like a delivery date estimation calendar.
Edit the information you want to display on the compact tracking information column.
Redirect package: This section when enabled allows you to show a link to the carrier's website where customers can ask to change the delivery address.
Status description: Customize the title and description for the shipments with no or pending shipment updates.
Choose the language from the dropdown and configure the content accordingly.
Subscription: This section enables your customers to subscribe to email, SMS, and Facebook messenger tracking notifications.
Select the subscription methods for tracking notifications.
Edit the section’s customer-facing title and button content.
Activate tracking events for all the selected subscription methods.
Shipment review: This section enables your customers to provide feedback on the delivery experience.
Allow customers to leave star and tag, text, or just tag rating.
Customize the review section’s text prompt.
Tag rating is supported for Premium and Enterprise plan users.
Product recommendations: This section allows you to display additional products on the tracking page based on your recommendation engine to drive additional sales and revenue.
Choose one of the supported engines– AfterShip Tracking, AfterShip Personalization, or Nosto. For more information on this, check out this article.
Other shipments in order (Items and related shipments): This section when enabled displays other shipments in your order when there are multiple shipments in a single order. It provides a concise overview of each additional shipment's content and current status and you can easily access more detailed information by opening a new window for each shipment.
Images of the items along with estimated delivery date, item title, and the option to view details of the shipment will be given.
For users importing trackings with order info, this component is accessible through Order CSV, Commerce API, and Platform connection. Ensure proper import of orders and trackings. For Tracking API & CSV users, include the order number in the payload or CSV file.
Sections 3-9 can be displayed in the compact tracking section as well as the tracking page anywhere you want.
Images: This section enables you to add relevant images to increase engagement.
Image section can be added thrice on the tracking page with a limit of three images in each section.
Edit the section title and add hyperlinks to images.
Custom section: This section allows you to create a custom section on the tracking page with six of the available blocks.
Set the title and a background image for the custom section.
Use any 3 out of the 6 supported blocks at a time.
Use a custom section a maximum of 20 times on the tracking page.
.
Video: This section allows you to insert video on the tracking page. Check out this article for more details.
Items: This section allows you to display other items present in your order along with the product name, variant, and price.
Header: The section of the tracking page that appears in the top margin.
Under Header settings, you are offered the following settings,
Your store name will be automatically selected since it's already linked with AfterShip Tracking. However, you have the option to change both the store name and URL if desired.
Upload your brand logo in JPG, PNG, JPEG, or GIF format, ensuring it remains under 2 MB in size.
Adjust the logo size and position according to your preference.
Customize the navigation layout of your tracking page. You have three options available
Click Add if you wish to display a dedicated menu on your tracking page.
If you'd like to include additional information in the header, such as promotions, sales, offers, or business hours, utilize the Header message field for that purpose. Otherwise, let it be as is.
Footer: The section of the tracking page that appears in the bottom margin.
Under the Footer settings, you are offered the following settings,
For legacy editor,
a. Social account: Add links to your Facebook, Twitter, and Instagram accounts.
b. Page links: Add links to your Contact Us, Terms, and Privacy pages.
For new template editor, apart from social account and general store links, you can also add
a. Footer message: Enter free text in Markdown format to display in the footer, e.g. promotion, opening hours.
b. Apple wallet: You can enable Apple wallet tracking where your customers can now track orders directly from Wallet. Add a "Track with Apple Wallet" button to your tracking pages that appears when customers use an Apple device.
Once changes are done, click Save.
B. Widgets
Add AfterShip Tracking’s Support Chat Widget to your branded tracking pages to reduce the number of support calls and improve customer satisfaction while they track their orders.
Get a complete tutorial here
C. Style
The Style tab enables you to set the
Customize the branding style, including color, fonts, corner, container’s border, and shadow.
Customize the components style, including button, text boxes, tabs and pills.
Customize the block and section style, for example the compact tracking info, instagram, header, and product recommendations by simply switch from the Settings tab to Style tab for each block and section.
D. Branded tracking page settings
1. Branding
The Settings tab enables you to showcase your brand logo as a favicon
Favicons are supported in ICO or PNG format.
Recommended size and dimensions are under 50 KB and 32 x 32px respectively.
2. Google Analytics
If you want to monitor tracking page sessions, copy the tracking code from your Google Analytics account and paste it into the given field.
Get a detailed run down on how you can connect your Google Analytics account with AfterShip Tracking here..
Preview your tracking page on desktop and mobile right in the editor by switching between their respective tabs.
Click Save.
E. Languages
Plans: Pro, Premim, Enterprise Platforms: All platforms
Add a new language and set a default language of the tracking page to allow customers to check the status of their parcel and the page content in the local language.
By default, the tracking page is set to English, but you can change it anytime.
You can also include a language parameter in the tracking URL to pre-select the language. If the URL doesn’t contain the language parameter, the default language page will open.
The supported languages will be displayed at the top of the branded tracking page, allowing customers to switch between them to view the tracking page in their preferred language.
You can use a language parameter in the tracking page URL for customers to directly land on the page in that language without having to select a language from the dropdown menu.
You can enable the auto-detect feature to pre-select the page language based on the customer's browser language.
Additional actions
From the page variations page, you can take the following actions.
Click Actions
Select Edit to open the tracking page editor.
Select Rename to edit the name of the tracking page.
Select Duplicate to make a copy of the current tracking page. You will be required to edit the name of the copied tracking page since you are not allowed to keep the same name for two or more pages.
Click Duplicate to another org to copy the tracking page from the current org to a different org.
Only applicable if you have multiple organizations connected to your AfterShip account.
Select Delete to permanently remove the tracking page.
Default tracking page cannot be deleted.
Select Add segmentation rule to target specific tracking page variation to specific audience segments.
Supported for Enterprise plan users
Tracking page variations
Plans: All plans Platforms: All platforms
The tracking page variation feature is designed to help you create multiple tracking pages tailored to customer segments.
Each page variation will have a different URL, which will be automatically created based on the tracking page name.
Customize each page variation and test styles and layouts according to your requirements.
Segment each tracking page with specific conditions, which will only be shown to customers when those conditions are met. Customers not meeting any defined conditions will automatically be directed to the default tracking page.
Choose to insert specific tracking page URLs for particular customer segments in your marketing campaigns and website.
The AfterShip Tracking notifications merge tag |TRACKING_URL| will automatically direct customers to the default tracking page.
For tracking page proxy URL and iframe code embedding on your store, you can select either a universal tracking page URL or a specific page variation.
Set up a custom domain or use the default URL
Plans: Premim, Enterprise Platforms: All platforms
Go to Tracking pages > Page variations in the AfterShip Tracking admin.
Scroll down to URLs and domains.
Click on Set up custom domain and then Set up instructions on how to get your own custom domain.
Copy the default tracking page URL and add it to your store's navigation if you wish to use this URL.
Tip:
Chat with our support team to get your SSL activated.
Use DNS only while setting up a CNAME.
Checkout This detailed tutorial to set up a custom domain for your tracking page in a few simple steps.
Updated on: 05/07/2024
Thank you!