Pon un visor de facturas electrónicas en tu web
Un fragmento de código añade a tu sitio un visor gratuito para archivos XRechnung, ZUGFeRD, Factur-X, Peppol, UBL y CII. Tus visitantes abren allí mismo sus facturas electrónicas, en su propio idioma.
En esta página
¿Qué hace el visor?
El visitante arrastra una factura electrónica, elige un archivo o pega el XML, y la ve como una factura legible que puede imprimir o guardar como PDF. Los enlaces bajo la factura llevan a comprobarla y convertirla en klarbon.app, en el idioma del visitante.
¿Se sube algo?
El archivo se lee y se muestra en el navegador del visitante y nunca se sube. El visor no conserva datos de la factura ni usa herramientas de analítica web. Al cargarlo se hacen solicitudes normales a klarbon.app; tu página solo recibe su altura, no la factura.
Pruébalo
Así ven el visor tus visitantes. Arrastra encima una factura electrónica compatible.
¿Cómo lo añado?
Pega estas líneas donde quieras que aparezca el visor. Se ajusta solo al tamaño de la factura.
<div data-klarbon-open data-lang="es"><a href="https://klarbon.app/es/?ref=embed">Abrir una factura electrónica con Klarbon</a></div>
<script src="https://klarbon.app/embed.js" async></script>embed.js es siempre la versión actual y se guarda en caché durante una hora. Para quedarte en esta versión, carga https://klarbon.app/embed/v1.js en su lugar.
¿Qué opciones puedo configurar?
Añade al elemento cualquiera de estos atributos. Si omites uno, se usa su valor por defecto.
| Atributo | Qué hace | Valores |
|---|---|---|
data-lang | El idioma del visor. Si no lo indicas, el visor sigue el idioma del navegador del visitante y recurre al inglés si no lo tiene disponible. El inglés siempre está a un clic en el visor. | en, de, fr, nl, it, es, pl, pt, ro |
data-partner | Tu código de recomendación de Klarbon. Todos los enlaces del visor pasan entonces por tu enlace de recomendación. | a-z, 0-9 |
data-theme | Claro, oscuro o según la configuración del propio visitante. | auto, light, dark , por defecto auto |
data-accent | El color de los botones y los enlaces, de la paleta de Klarbon. | petrol, ink, blue , por defecto petrol |
data-height | La altura en píxeles hasta que el visor se carga y ajusta su tamaño. | 240-20000 , por defecto 520 |
¿Puedo ganar créditos con esto?
Sí. Inicia sesión en Klarbon y busca tu código de recomendación en tu cuenta. Ponlo en el fragmento como data-partner. Todos los enlaces del visor pasan entonces por tu enlace de recomendación y, cuando un visitante que hayas enviado haga su primera compra, recibiréis un crédito gratuito cada uno.
Iniciar sesión para obtener tu código
¿Cómo lo añado a WordPress?
Añade un bloque de HTML personalizado y pega el fragmento. WordPress conserva el script solo para los usuarios con la capacidad unfiltered_html. Ayuda de WordPress
El plugin de Klarbon para WordPress todavía no está publicado. Usa el fragmento HTML de arriba. El shortcode de abajo es solo para ese plugin:
[klarbon_open lang="es" partner="" theme="auto" accent="petrol"]¿Con qué otros creadores de sitios web funciona?
- HTML
- Pega el fragmento en el HTML de la página, en el punto donde quieras que aparezca el visor.
- Wix
- Elige Añadir elementos, Incrustar código, Incrustar HTML y pega el fragmento. Wix muestra los elementos incrustados en un marco de altura fija, así que dale al elemento al menos 900 píxeles de alto. Ayuda de Wix
- Squarespace
- Añade un bloque de código y pega el fragmento. Squarespace ejecuta scripts en los bloques de código de los planes Core, Plus y Advanced. Ayuda de Squarespace
- Webflow
- Consulta la ayuda de Webflow sobre código personalizado y los permisos de tu plan antes de añadir el fragmento. Ayuda de Webflow
- Google Sites
- Elige Insertar, Incorporar, Incorporar código y pega el fragmento. Arrastra el borde inferior del elemento para aumentar su altura y que quepa la factura. Ayuda de Google Sites
¿Tengo que cambiar mi política de seguridad de contenido (CSP)?
Solo si tu sitio envía una: permite https://klarbon.app en script-src y frame-src.
Actualizado el 6 de noviembre de 2026