A shipment tracking globe for your own website
Show customers where their goods are, on a 3D globe or a flat map, in your colours and language. Paste one snippet. The widget weighs about 30 KB, sets no cookies, loads only when it scrolls into view, and needs no account.
Add it to your site
- Paste this where the map should appear. The script tag can go once per page.
- Add a Custom HTML block and paste this.
- If WordPress strips it, your role lacks unfiltered_html (usual for Editors on multisite). Install the plugin file below and use the shortcode, or ask an admin.
- WordPress.com: needs a paid plan with hosting features on; the free plan removes scripts and iframes.
Shortcode
iframe, if scripts are refused
- Theme editor → Add section → Custom Liquid, and paste this.
- Or add the section file below to your theme’s sections/ folder, then pick “Tracking globe” in the editor and paste the configuration.
- Rich-text fields in pages and products strip this code; use a section.
- Headless stores with their own Content-Security-Policy must allow this script’s host.
Configuration value
- What we could confirm: Taobao and Tmall shop decoration is a closed editor with templates and approved modules. We found no supported way to run third-party scripts or iframes in it, and no current official rule that says otherwise, so we do not promise a live widget there.
- What works: download this view as an image and upload it to your shop’s image space.
- For live tracking, host the widget on your own page and share it with buyers outside the listing. External links in listings are limited by platform rules: check yours before using one.
- Reaching buyers in China: host tracker.js and engine.js on a server in China. We have not measured how this site loads from there.
- A page with only the map, for emails, QR codes or anything that takes a URL.
iframe
Email kit: Pro plan
Personal tracking links for your email platform, the branded sales page, status images and GIF are part of Pro, which is not on sale yet. The website widget stays free.
- Create these fields in your email platform, filled for each recipient.
- Upload the four status images to your own site or the platform’s file manager and enter the folder below.
- Paste the HTML block into a custom code block, or use only the link on your own button.
- Send yourself a test and open the link before any campaign.
My field names
Use the names your platform has. Values must not contain & or #. Use hub codes such as shanghai, or test yours.Personal link
This link is long. Host the brand file on your site (Advanced) to shorten it.
Open a sample page Some Outlook desktop versions show only the first frame. Check the size before sending.HTML email block
Advanced
For real campaigns host p.html, page.js, tracker.js and engine.js on your own domain: recipients and spam filters trust it more. Tags follow each platform’s syntax but have not been sent from those platforms: test first. Links can be edited by anyone who has them, so never put private data in them.
Where it works, and what we actually tested
| Platform | How it goes in | Tested |
|---|---|---|
| WordPress | Custom HTML block, shortcode or iframe | Block markup in a browser, plugin with PHP. Not yet on a real install. |
| Shopify | Custom Liquid or a theme section | Page with a real store’s security headers. Not inside a live store. |
| SharePoint Online | Embed web part, iframe only | Sandboxed iframe under a strict policy. Not in a real tenant. |
| Taobao / Tmall | Image only | Image export only. No live widget. |
| Any HTML site | Script tag | Desktop and phone browsers, weight and layout shift measured. |
| Email (Mailchimp, HubSpot, Salesforce, Pardot, Klaviyo) | Pro · Image and personal link to a branded tracking page | Page and block in a browser. Not sent from any of these platforms yet. |
Why it stays out of your page’s way
About 30 KB, in two steps
A 3 KB loader reserves the space, so nothing jumps. The 27 KB engine arrives when the map nears the screen. No map library, no tile server.
Nothing to consent to
No cookies, no analytics, no calls to third parties. The world map ships inside the file, so no visitor’s IP goes to a map provider.
Yours to restyle
Colours, font, logo and language in the form. Your own CSS can set --tg-accent and friends and reach parts with ::part().
Questions
Is it a real-time GPS tracker?
No. It draws the data you give it: dates, progress or positions from your own system. It does not connect to carriers or vessels. Routes are schematic lanes, not navigation.
Can I show simulated shipments?
Yes, for demos and sales pages. They always carry a visible “Simulated data” label, so nobody takes them for real freight.
How do I keep shipment data private?
Do not paste it into the snippet. Point the widget at your own endpoint and use the lookup, which fetches one reference at a time under your own rules.
Does it work in SharePoint?
Through the Embed web part, as an iframe, once a site owner allows the domain. Scripts in page content do not run there. We have not tested it in a real tenant.
Does it work on Taobao?
Not as a live widget, as far as we can confirm. You can publish an image of the map and host the live version on your own page.
Does it cost anything?
No account and no fee. It runs in the visitor’s browser, so there is no server of ours to pay for.
Is the email kit free?
No. The widget for your website is free; the email kit and tracking page builder are part of the Pro plan, which is not on sale yet.
Can the live 3D map run inside an email?
No. Email clients do not run scripts. The email carries an image or GIF and a personal link; the interactive map opens on the tracking page.
How do I measure sales from it?
Your email platform counts clicks on the link. Every link out of the page carries campaign tags, so your shop analytics can attribute sales. Compare with a group that receives the plain email to measure the real lift.