search
Guides LoginApp

boxOrder Status Page

Create your own order status page with seamlessly integrated order, delivery, and payment status details so customers can track the delivery status of their package while engaging with your brand.

hashtag
Overview

The Order Status page can be integrated in your website so your customers can track their orders and find the latest status of a delivery as well as enjoy a branded experience.

It is supported in over 25 languages and can be configured to include promotional banners or purchased products and custom styles added to fit your brand. You can also fully track the page and include your own recommendation engine without additional effort.

hashtag
Setting Up an Order Status Page

A branded order status page can be set up in your online shop to give customers real-time delivery updates and a seamless tracking experience.

1

hashtag
Add the order status page snippet

Setting up an order status page for your online shop is straightforward. Create an empty landing page on your website or online shop and copy and paste the JavaScript snippet below in the <body/> of your page.

circle-exclamation

You will need to insert your parcelLab account ID in the plUserId field when copying the tracking snippet below.

The tracking plugin is then used to retrieve and display order tracking information, including the checkpoints of a tracking on your order status page.

circle-info

The plugin uses well recognized third-party tools (for example: Web Accessibility Evaluation Tools (WAVE) and axe DevTools), which are based on the WCAG 2.1 Level AA standard to ensure accessibility standards are met.

parcellab-track-and-trace-snippet.html
<div id="parcellab-track-and-trace">
<img src="https://cdn.parcellab.com/img/loading-spinner-1.gif" alt="loading" />
</div>

<script>
  function plTrackAndTraceStart() {
        window.parcelLabTrackAndTrace.initialize({
          plUserId: TYPE_YOUR_USER_ID_HERE,
          lang: 'en', // default language if not specified for order
          show_searchForm: true,
          show_zipCodeInput: true,
          show_articleList: true,
          use_campaign_banners: true
        });
        var linkTag = document.createElement('link');
        linkTag.rel = 'stylesheet';
        linkTag.href = 'https://cdn.parcellab.com/css/v5/main.min.css';
        document.getElementsByTagName('head')[0].appendChild(linkTag);
  }
</script>
<script async onload="plTrackAndTraceStart()"
src="https://cdn.parcellab.com/js/v5/main.min.js"></script>
2

hashtag
Test the implementation

Validate the order status page with a test URL to ensure the setup has gone smoothly.

You can test the implementation and display of the order status by using our sample parcels. Append the following queries to the URL of the page where you installed our plugin.

Display
Query
Sample

Calendar sheet

?courier=dhl-germany&trackingNo=00PL16120004

Linkarrow-up-right

Pickup map

?courier=dhl-germany&trackingNo=00PL16120006

Linkarrow-up-right

Icon

?courier=dhl-germany&trackingNo=00PL16120008

Linkarrow-up-right

Consolidated order

?plUserId=1612197&orderNo=00PL004

Linkarrow-up-right

3

hashtag
Adjust design and page components

Once you've installed the order status page for your website, you can configure additional options to fit your brand, such as custom styling or translations.

Components on the order status page can also be configured to adapt to various use cases, including defining the language and displaying a list of purchased products or promotional banners.

Order status page

hashtag
Learn More

View the following topics for further details on integrating an order status page:

box-circle-check Add an Order Status Page

Discover the right setup to create a fully embedded Order Status page in your online shop.

box-open-full View Page Components

Learn about the different components and details that are displayed on the Order Status page.

hashtag
FAQs

To help you get started with setting up your order status page, see our FAQs below.

circle-info

If you have any further questions relating to setup of your order status page, please contact your parcelLab representative.

chevron-rightHow do I add an order status page to my online store?hashtag

You can copy the JavaScript snippet below and paste it on an empty landing page (in the <body /> not the <head />) to integrate a shop frontend (or any webpage) with parcelLab. The tracking plugin is then used to retrieve and display order tracking information, including the checkpoints of a tracking on your Order Status page.

circle-exclamation

You will need to insert your parcelLab account ID in the plUserId field when copying the tracking snippet below.

For further information on configuring the Order Status page, see our setup guide.

parcellab-order-status-page-snippet.html
<div id="parcellab-track-and-trace">
<img src="https://cdn.parcellab.com/img/loading-spinner-1.gif" alt="loading" />
</div>

<script>
  function plTrackAndTraceStart() {
        window.parcelLabTrackAndTrace.initialize({
          plUserId: TYPE_YOUR_USER_ID_HERE
          lang: 'en', // default language if not specified for order
          show_searchForm: true,
          show_zipCodeInput: true,
          show_articleList: true,
          use_campaign_banners: true
        });
        var linkTag = document.createElement('link');
        linkTag.rel = 'stylesheet';
        linkTag.href = 'https://cdn.parcellab.com/css/v5/main.min.css';
        document.getElementsByTagName('head')[0].appendChild(linkTag);
  }
</script>
<script async onload="plTrackAndTraceStart()"
src="https://cdn.parcellab.com/js/v5/main.min.js"></script>
chevron-rightDo I need to display a cookie banner to customers on our Order Status page?hashtag

No, this is because we do not collect data (we simply display it) or set cookies, therefore it is not necessary to trigger a cookie consent popup for our Order Status page plugin. However, you should ensure that parcelLab is listed as a subprocessor in your data processing agreement (DPA).

For further information on configuring the Order Status page, see our setup guide.

chevron-rightCan I display a different experience on the Order Status page depending on the status?hashtag

Yes, you can change the display of the Order Status page by status but it needs to be customized using the onRendered function.

For example: For one parcel on the Order Status page you can update the content based on the status:

  • “Shipped” - display blog content

  • “In Transit” - display a signup to the loyalty scheme

  • “Delivered” - display a promotional code for the next order

You can also change the display per item/tracking in a split order as the onRendered function will re-render the screen each time.

Tip: We can also build simple scenarios with the link behind the tracking button of our emails (for example: to show a first banner on “Dispatch Confirmation” and a second one when the Order Status page is reached via the “Delivered” email).

For further information on using the onRendered function on the Order Status page, see our setup guide.

chevron-rightIs the Order Status page certified against accessibility standards?hashtag

Yes, the Order Status page plugin uses third-party tools, such as Web Accessibility Evaluation Tools (WAVE), to ensure accessibility standards in-line with the WCAG 2.1 Level AA standard are met.

For further information on configuring the Order Status page, see our setup guide.

chevron-rightHow long is the data available on the Order Status page after an order has been delivered?hashtag

Customer-related information of orders and trackings is available for 90 days after delivery on the Order Status page as per our data retention policy.

For further information on how parcelLab stores data, see our data retention policy.

PreviousOn-Demand MessagingNextOrder Status Page Components

Last updated

Was this helpful?