For Online Sellers • Free

Free PostEx Tracking Widget for Your Online Store

Let customers follow their PostEx parcel from your store. Paste one piece of code and a tracking box appears on your page, ready to use.

One piece of code to paste
No cookies or trackers added
No sign-up, no cost

1. Style

2. Button colour

Your brand colour

3. Copy the code

<!-- PostEx Tracking widget (free): https://postex-tracking.com/tracking-widget -->
<style>
.tmpw{max-width:560px;margin:24px auto;padding:20px;border:1px solid #e2e8f0;border-radius:16px;background:#ffffff;box-shadow:0 6px 24px rgba(15,23,42,.08)}
.tmpw,.tmpw-pop{color:#0f172a;font-family:system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;box-sizing:border-box;text-align:left}
.tmpw *,.tmpw-pop *{box-sizing:border-box}
.tmpw form,.tmpw-pop form{margin:0}
.tmpw-head{display:flex;align-items:center;gap:12px;margin:0 0 16px}
.tmpw-icon{flex:0 0 40px;width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center}
.tmpw-k65a30d .tmpw-icon{background:#65a30d;color:#0f172a}
.tmpw-title{margin:0;font-size:17px;font-weight:700;line-height:1.3;color:#0f172a}
.tmpw-sub{margin:2px 0 0;font-size:13px;line-height:1.4;color:#64748b}
.tmpw-row{display:flex;flex-wrap:wrap;gap:8px}
.tmpw-row input{flex:1 1 220px;min-width:0;margin:0;padding:12px 14px;font-size:15px;line-height:1.4;color:#0f172a;background:#ffffff;border:1px solid #cbd5e1;border-radius:12px}
.tmpw-row input:focus{outline:none}
.tmpw-k65a30d .tmpw-row input:focus{border-color:#65a30d;box-shadow:0 0 0 3px #65a30d33}
.tmpw-row button,.tmpw-open{flex:0 0 auto;margin:0;padding:12px 22px;font-size:15px;font-weight:700;line-height:1.4;white-space:nowrap;border:0;border-radius:12px;cursor:pointer}
.tmpw-k65a30d .tmpw-row button,.tmpw-k65a30d.tmpw-launch .tmpw-open{color:#0f172a;background:#65a30d}
.tmpw-row button:hover,.tmpw-open:hover{filter:brightness(.92)}
.tmpw-go{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.tmpw-spin{display:none;width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:tmpw-rot .7s linear infinite}
.tmpw-busy{pointer-events:none;opacity:.85}
.tmpw-busy .tmpw-spin{display:inline-block}
@keyframes tmpw-rot{to{transform:rotate(360deg)}}
.tmpw-foot{margin:14px 0 0;font-size:12px;line-height:1.4;color:#64748b;text-align:center}
.tmpw-foot a{color:#334155;text-decoration:underline}
@media (max-width:440px){.tmpw{padding:16px}.tmpw-row button{flex:1 1 100%}}
</style>
<div class="tmpw tmpw-k65a30d">
  <form action="https://postex-tracking.com/widget-track" method="get" target="_blank" onsubmit="var b=this.querySelector('.tmpw-go');if(b){b.classList.add('tmpw-busy');b.setAttribute('aria-busy','true');setTimeout(function(){b.classList.remove('tmpw-busy');b.removeAttribute('aria-busy')},4000)}">
    <div class="tmpw-head">
      <div class="tmpw-icon"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21 8l-9-5-9 5 9 5 9-5z"/><path d="M3 8v8l9 5 9-5V8"/><path d="M12 13v8"/></svg></div>
      <div>
        <p class="tmpw-title">Track your order</p>
        <p class="tmpw-sub">Enter your PostEx tracking number to see where your parcel is.</p>
      </div>
    </div>
    <div class="tmpw-row">
      <input name="cn" type="text" required minlength="5" maxlength="40" autocomplete="off" autocapitalize="characters" autocorrect="off" spellcheck="false" enterkeyhint="go" aria-label="Tracking number" placeholder="Enter tracking number">
      <button type="submit" class="tmpw-go"><span class="tmpw-spin" aria-hidden="true"></span><span>Track My Parcel</span></button>
    </div>
    <input type="hidden" name="utm_source" value="postex-widget">
    <input type="hidden" name="utm_medium" value="widget">
  </form>
  <p class="tmpw-foot">Powered by <a href="https://postex-tracking.com/" target="_blank">PostEx Tracking</a></p>
</div>

Preview

This is how it looks on your store. Try it with a real tracking number.

Where to Paste the Code

Shopify

In your admin, go to Online Store → Themes and press Customize.
Add a Custom Liquid section to the page you want.
Paste the code, then Save.

WooCommerce and WordPress

Edit the page or post.
Add a Custom HTML block and paste the code.
Click Update to publish.

Wix

Go to Add Elements → Embed Code → Embed HTML.
Pick Code, paste the widget and click Update.

Blogger and others

Blogger: Layout → Add a Gadget → HTML/JavaScript.
Most other builders have a custom HTML block; paste it there.

Will the widget slow down my store?

No. It is plain HTML and CSS with one short inline line for the loading icon. There are no cookies or iframes, and nothing is sent until someone presses the button.

I also ship with other couriers. What should I use?

This widget is for PostEx tracking numbers. If you use several couriers, the free Track My Parcel widget finds the courier from any number.

Can I change the colours or text?

Pick a box or a popup button and your colour before copying. You can also edit the wording in the code; please keep the “Powered by PostEx Tracking” link.

Is the PostEx tracking widget free?

Yes, completely. There is no sign-up and no limit. We only ask you to keep the small “Powered by PostEx Tracking” line.

What do customers see when they press the button?

PostEx Tracking opens in a new tab with the latest status and history for their PostEx tracking number. Your store page stays open behind it.