Skip to main content

Widgets for your website

Free Travel Calculator Widgets — Embed on Your Website in 30 Seconds

TripCalc widgets let you add a live currency converter, tip calculator, jet-lag advisor or time-zone tool to any website with a single line of HTML. Every widget is free, mobile-ready and loads lazily so it never slows your page down — the only requirement is a small built-in attribution link.

How it works

  1. 1. Pick a widget

    Choose from 1 embeddable calculators below. Live previews included.

  2. 2. Copy one line of code

    Paste a single iframe tag, or use the auto-resizing div + script loader. No build step, no npm.

  3. 3. You're live

    The widget loads lazily, works on mobile and resizes itself to fit your layout automatically.

The code

Option A — plain iframe
<iframe src="https://tripcalc.io/embed/united-states-jet-lag-calculator?attr=1" width="100%" height="480" style="border:0" loading="lazy" title="United States Jet Lag Calculator"></iframe>
Option B — auto-resizing (recommended)
<div data-tripcalc="united-states-jet-lag-calculator" data-tripcalc-source="your-site"></div>
<script src="https://tripcalc.io/embed.js" async></script>

Option B loads embed.js (~1 KB), turns every <div data-tripcalc> into a widget and auto-resizes each iframe. Options on the div: data-tripcalc-theme="dark" for dark-mode sites, data-tripcalc-height for a taller initial frame, and data-tripcalc-source to tag your traffic (surfaced as utm_source on the widget's outbound links).

Ready-to-embed widgets

These render live below — or browse the full A–Z index for more.

Real widgets, rendered live — try them right here.

  • United States Jet Lag Calculator

    Time Zone Calculators

    Get embed code →

Adding a widget to WordPress

  1. Edit the post or page where the widget should appear and add a Custom HTML block (available in the block editor for administrators; on multi-author sites an editor or admin may need to insert it — unfiltered HTML is restricted by role).
  2. Paste the auto-resizing snippet, swapping the slug for the widget you want.
  3. Preview and publish — the widget loads lazily and resizes itself; nothing else to configure.
WordPress Custom HTML block
<div data-tripcalc="united-states-jet-lag-calculator" data-tripcalc-theme="dark" data-tripcalc-source="my-wp-site"></div>
<script src="https://tripcalc.io/embed.js" async></script>

Tips: if your theme has a dark footer, keep data-tripcalc-theme="dark". If a "delay JavaScript" option in a performance plugin breaks the loader, exclude embed.js from it. Classic editor users: switch to the Text tab before pasting.

Frequently asked questions

Is it really free?
Yes. Every TripCalc widget is free to embed on unlimited pages, with no sign-up, no API key and no usage limits.
Is attribution required?
Yes — the only requirement is the small “⚡ by TripCalc” link built into every widget. It cannot be removed, and it helps more travelers find these free tools.
Will it slow my site down?
No. Widgets load in a lazy iframe (under 2 KB of loader code), so they never block your page render. The iframe only loads when scrolled into view.
Can I customize the widget?
Add data-tripcalc-theme="dark" to the loader div (or ?theme=dark to the iframe URL) to match dark-mode sites, data-tripcalc-height for a taller initial frame, and data-tripcalc-source to tag your traffic. Sizing is automatic — the widget reports its height and the iframe resizes itself.
Does it work on WordPress?
Yes — use a Custom HTML block with the auto-resizing snippet. See the WordPress section below for the exact steps.