Carry-On Embed Widget

Live

Free embeddable carry-on size checker for travel blogs

Built by · Launched April 2026

Get the embed code
Carry-On Embed Widget screenshot
web astro embeds iframe seo travel-tools

What is the Carry-On Embed Widget?

A free, zero-tracking iframe widget that travel bloggers and site owners can drop into any page with two lines of HTML. It shows readers whether their bag fits each airline’s carry-on and personal item rules, pulling from the same verified dataset that powers the rest of Vientapps.

The actual widget, running inside this project page. Same code a blogger would paste into WordPress.

How It Works

  1. Pick your options in the visual customizer on the landing page: default airline, theme (light, dark, auto), accent color, compact mode.
  2. Copy two lines of HTML: an iframe tag plus a tiny resize script.
  3. Paste anywhere that allows HTML (WordPress Custom HTML block, Squarespace code block, Ghost HTML card, plain static site).
  4. Publish. The widget renders, resizes to its content, and stays current on its own.

Why It’s Free

The underlying airline dataset is already maintained for the main site, so serving it through an iframe costs almost nothing per impression. Keeping the widget free (with a small attribution link) means it gets embedded in travel guides, which builds links and surfaces Vientapps to new readers: a fair trade.

Tech Notes

  • Astro static routes for the embed host page (/tools/widgets/carry-on-size/) and the iframe target (/embed/carry-on/).
  • postMessage height sync via a 400-byte resize.js that keeps the parent iframe matched to inner content.
  • Noindex on the iframe target so Google indexes the customizer page, not the bare widget.
  • Theme variables via URL params so one HTML file serves every customization combination without a build step per embed.
  • Zero third-party requests from inside the iframe: no analytics, no fonts, no CDN fetches after load.