Why Settle for Ordinary?

Most tracking pages are bland, forgettable, and transactional. But what if every touchpoint: from purchase to delivery: could reinforce your brand’s story, excite your customers, and make your service utterly unforgettable?

With Branded Tracking Portals, you hold the power to design tracking pages that are as unique and captivating as your products.

Highlights

• Craft bespoke tracking pages in mere minutes: no detail too grand, no flourish too subtle.

• Unveil your portal on the exclusive ‎`parcel.delivery` domain or your own distinguished address.

• Imbue every pixel with your brand’s essence: choose from refined templates, curated fonts, signature colours, and your iconic logo.

• Command the experience with our advanced HTML editor: where creative mastery knows no bounds.

Effortless Customisation for All

Whether you’re new to web design or a seasoned developer, Branded Tracking Portals offers two pathways to brilliance:

• Templates & Instant Styling: Choose from elegant templates, then tailor fonts, colours, and logos in minutes. No code required: just pure creative freedom.

• Advanced HTML Mode: For those who crave total control, dive into HTML mode. Here, you can craft bespoke layouts, apply intricate inline CSS, and harness dynamic variables for live tracking data.

Publish Anywhere, Instantly

Launch your portal on our dedicated ‎`parcel.delivery` domain or connect your own. Your customers will enjoy a consistent, branded journey from checkout to doorstep; no more generic third-party experiences.

Getting Started: A Guided Tour

Page 1 – The Order Lookup Form

Your customer’s journey begins here. To ensure smooth order validation, include these essential fields:

Example
HTML
Copy
<form>

{{INPUT_1}} <!-- Email input -->

{{INPUT_2}} <!-- Order ID input -->

{{SUBMIT_BUTTON}} <!-- Submit button -->

</form>

What do these do?

• {{INPUT_1}}: Captures the customer’s email, matching their order.

• {{INPUT_2}}: Links the lookup request to a specific order.

• {{SUBMIT_BUTTON}}: Advances to the next stage: where the magic happens.

Important Note:

Email address must be present for the system to validate and match orders.

Page 2 – Tracking & Order Details

Now, enchant your customers with detailed, dynamic updates.

Inject live data using these variables:

General Order Information

Example
HTML
Copy
<div>

<img src="{{COMPANY_LOGO}}" alt="Your Brand Logo">

<p>Order placed on: {{PLACED_ON}}</p>

<p>Delivery postcode: {{POST_CODE}}</p>

</div>

What do these do?

• {{POST_CODE}} – Customer’s postal code
  Displays the delivery postcode associated with the order. Useful for confirmation that the correct order is being displayed.

• {{PLACED_ON}} – Order date
  Shows the date and time when the order was originally placed.

• {{COMPANY_LOGO}} – Logo image
  Inserts your company’s logo as an image (as configured in the portal settings).

Order Items (Loop Example)

Showcase every product with clarity and flair:

Example
HTML
Copy
{{FOREACH_ITEMS}}

<div class="item">

<span>{{name}}</span>

<span>{{product_code}}</span>

<span>£{{price}} <del>£{{original_price}}</del></span>

<span>Qty: {{quantity}}</span>

</div>

{{ENDFOREACH_ITEMS}}

To display all products in the order, you must wrap them between:

• {{FOREACH_ITEMS}} – Start of loop

• {{ENDFOREACH_ITEMS}} – End of loop

Inside this loop, you can use:

• {{name}} – Product name
  The full name/description of the product purchased.

• {{product_code}} – SKU or product code
  The internal or external product identifier (e.g. SKU, part number).

• {{price}} – Current product price
  The actual price charged for the item, taking discounts into account.

• {{original_price}} – Original product price
  The product’s list price before discounts were applied. Can be used to show savings.

• {{quantity}} – Quantity ordered
  The number of units of this product in the order.

Billing & Shipping Information

Example
HTML
Copy
<div>

<h3>Billing Details</h3>

<p>Name: {{BILLING_NAME}}</p>

<p>Phone: {{BILLING_PHONE}}</p>

<p>Address: {{BILLING_ADDRESS}}</p>

</div>

<div>

<h3>Shipping Details</h3>

<p>Name: {{SHIPPING_NAME}}</p>

<p>Phone: {{SHIPPING_PHONE}}</p>

<p>Address: {{SHIPPING_ADDRESS}}</p>

</div>

What do these do:

Billing Information:

• {{BILLING_NAME}} – Billing contact name
  The full name of the person who placed the order (billing contact).

• {{BILLING_PHONE}} – Billing contact phone number
  The phone number provided with the billing details.

• {{BILLING_ADDRESS}} – Billing address
  The complete billing address, formatted as a single block.

Shipping Information:

• {{SHIPPING_NAME}} – Recipient name
  The full name of the delivery recipient.

• {{SHIPPING_PHONE}} – Recipient phone number
  The phone number provided for delivery contact.

• {{SHIPPING_ADDRESS}} – Shipping address
  The complete delivery address, formatted as a single block.

Order Totals

Example
HTML
Copy
<div>

<p>Subtotal: £{{SUBTOTAL}}</p>

<p>Shipping: £{{SHIPPING_COST}}</p>

<p>Discount: £{{DISCOUNT}}</p>

<h2>Total: £{{TOTAL}}</h2>

</div>

what do these do:

• {{SUBTOTAL}} – Order subtotal
  The total of all item prices before shipping, discounts, or taxes.

• {{SHIPPING_COST}} – Delivery charge
  The shipping/delivery cost charged for this order.

• {{DISCOUNT}} – Discount amount
  The total amount discounted (e.g. promotional codes, sales).

• {{TOTAL}} – Final order total
  The grand total payable, including products, shipping, taxes, and discounts.

For Developers: Unleash Your Genius

HTML Mode places the reins in your hands. Write any HTML and inline CSS you desire: just remember, only code between the ‎`<body>` tags is processed. Use the provided variables for dynamic content; experiment, iterate, and create tracking experiences that are truly one-of-a-kind.

Pro Tip:

Want to show off your brand’s personality? Animate status updates, add custom graphics, or integrate interactive elements. The only limit is your imagination.

Ready to Captivate?

Branded Tracking Portals isn’t just a tool: it’s your canvas. Install it now (here ↗), experiment with templates, or unleash your coding prowess. Your customers will be delighted, engaged, and eager for their next purchase; because you’ve turned a simple delivery into an unforgettable event.

Coming soon:

Find Branded Tracking Portals in the Voila app store. Be the first to redefine delivery and keep your customers coming back for more.