Put a heart route on your own site, in your own colours.
The CityHeart white-label widget is an embeddable heart-shaped running route that renders in your own brand colours on your own website. You paste one iframe tag, add your partner code, and visitors see a real gold-tier route through your city, with your logo in the footer, without ever leaving your domain.
How the widget works
- You get a partner code. Your organisation is registered with a slug, a two-colour palette, a logo and the cities you cover. That record is what the widget reads at runtime.
- You paste one iframe. A single HTML tag, roughly ten lines. No script to load, no npm package, no build step. It works on WordPress, Webflow, Squarespace and hand-written HTML alike.
- It renders in your palette. The widget reads your code from the URL and repaints its buttons, focus rings and gradients in your colours. The route image itself stays as generated, so the trace remains legible on any background.
Widget specifications
| Integration | One <iframe> tag, no JavaScript to install |
|---|---|
| Minimum width | 280px, works in mobile sidebars |
| Route quality | Gold tier only (AI score 80 or above) |
| Loading | loading="lazy" by default, off your initial load budget |
| Branding | Your palette and logo, plus one "powered by CityHeart" line |
| Watch support | GPX for Garmin, Apple Watch, Coros, Suunto and Strava |
| Visitor cost | Free to preview, €4.99 one-time if they download the GPX |
| Territory | Scoped to the cities on your partner record |
Frequently Asked Questions
- What is a white-label running route widget?
- A white-label running route widget is an embeddable map component that displays a running route under your brand rather than the vendor's. The CityHeart version shows a heart-shaped GPS route through your city, painted in your colours, with your logo in the footer. Visitors can load the GPX onto a Garmin, Apple Watch, Coros or Strava account directly from your page.
- Do I need a developer to install it?
- No. The widget is a single iframe tag of about ten lines, which you paste into any HTML block. It works in WordPress, Webflow, Squarespace, Notion embeds and hand-written HTML. There is no script to load, no package to install and no build step, so a marketing manager can ship it without touching a codebase.
- Which routes can be embedded?
- Only gold-tier routes, meaning those scoring 80 or above on our heart-shape evaluator. Every public route is scored automatically, and a minority clear that bar. The restriction is deliberate: a wobbly trace embedded under a partner brand damages both sides, so a lower-tier route simply will not render, and the widget falls back rather than showing it.
- Can the widget show a route in any city?
- It is scoped to the cities on your partner record. If your organisation covers Rennes, the widget renders your branding on Rennes routes and falls back to plain CityHeart branding elsewhere. This territorial check runs server-side, so appending a partner code to an arbitrary route URL does not transfer the branding.
- What happens to the widget if we stop our subscription?
- The widget keeps working, but it reverts to CityHeart branding. We never break an embed that is already live on your page, because that would damage your site rather than ours. You lose the white label, not the component. Billing runs monthly, and a failed card keeps your branding until the period you already paid for ends.
- Does the widget slow down my page?
- It defaults to loading="lazy", so the browser only fetches it when the visitor scrolls near it, keeping it off your initial page-load budget. The widget is a static image plus a caption and two links, with no map library and no JavaScript running on your page. Embedders care about their Lighthouse scores, so this was a design constraint from the start.
- Do you remove the CityHeart attribution?
- No. Your logo and name appear first, followed by a single small "powered by cityheart.run" line. That one line is the price of the widget being free to run. Everything above it, the palette, the logo and the route framing, is yours.