# Cómo embeber una calculadora de kilometraje en cualquier sitio

> Una sola etiqueta <script>, cuatro variantes (completa, tarifa, viaje único y flota) y tres idiomas.

**Autor:** Camila Ribeiro — Editora de Operaciones de Campo  
**Publicado:** 2026-05-02  
**Actualizado:** 2026-05-02  
**URL:** https://kilometraje.co/blog/como-embeber-una-calculadora-de-kilometraje-en-cualquier-sitio

**TL;DR:** Una sola etiqueta <script>, cuatro variantes (completa, tarifa, viaje único y flota) y tres idiomas.

- No todos los equipos necesitan una plataforma completa de gastos.
- Los atributos controlan idioma (pt, es, en), país (br, mx, co, us, uk, ca`) y variante.
- Si tu sitio es una SPA (Next.js, Nuxt, Astro), usa el helper global window.QuilometragemEmbed.mount(divElement) para cualquier host creado dinámicamente.
- Pega cualquier URL de Quilometragem en una herramienta compatible con oEmbed.
- Cada variante renderiza un discreto "Powered by Quilometragem" con utm_source=embed, ayudando a partners y a nosotros al mismo tiempo.

## Por qué un widget embebible

No todos los equipos necesitan una plataforma completa de gastos.[^irs-2025] Blogs de RR.HH., sitios de ERP, portales de conductores y páginas de marketing solo quieren ofrecer al visitante una calculadora rápida de kilometraje. El widget de Quilometragem entrega eso en una etiqueta de script, sin dependencias, sin bundlers y sin clave de API requerida del partner.

## Cómo añadirlo

Pega en el HTML:

```
<script src="https://quilometragem.com/embed/calculator.js" defer></script>
<div data-quilometragem-calculator data-locale="es" data-country="mx" data-variant="full"></div>
```

El script monta el widget en todos los elementos con `data-quilometragem-calculator` cuando el DOM esté listo. Los atributos controlan idioma (`pt`, `es`, `en`), país (`br`, `mx`, `co`, `us`, `uk`, `ca`) y variante.

## Las cuatro variantes

- **full**: dos campos de dirección, selector de país y tarifa, botón calcular.
- **rate**: solo la tarifa oficial vigente, útil para sidebar de blog o FAQ.
- **trip**: estimador de viaje único — el usuario introduce distancia y ve el monto en tiempo real.
- **fleet**: resumen mensual — multiplica vehículos × km promedio × tarifa.

## SPAs y montajes dinámicos

Si tu sitio es una SPA (Next.js, Nuxt, Astro), usa el helper global `window.QuilometragemEmbed.mount(divElement)` para cualquier host creado dinámicamente.

## oEmbed para Notion, Slack y Confluence

Pega cualquier URL de Quilometragem en una herramienta compatible con oEmbed. El endpoint `/oembed` devuelve el iframe listo, heredando idioma y país de la URL original.

## ¿Y el backlink?

Cada variante renderiza un discreto "Powered by Quilometragem" con `utm_source=embed`, ayudando a partners y a nosotros al mismo tiempo.

## Fuentes

- [IRS — Standard Mileage Rates for 2025](https://www.irs.gov/tax-professionals/standard-mileage-rates) — Internal Revenue Service (2026-04-28)