> ## Documentation Index
> Fetch the complete documentation index at: https://docs.roofkit.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Embeds

> Instala RoofKit en sitios de contratistas con un widget de botón flotante o un iframe inline que reenvía atribución y parámetros de deep link.

## Modos de instalación

| Modo | Comportamiento | Mejor para |
| - | - | - |
| Widget de botón | Carga roofkit-embed.js, renderiza un lanzador y abre el visualizador en un iframe modal. | Sitios que necesitan un CTA persistente y compacto. |
| Iframe inline | Coloca el visualizador directamente en el layout de la página del contratista. | Landing pages con una sección dedicada al visualizador. |

> [!NOTE]
>
> **Un widget de botón por página host**
>
> Una página de contratista debe montar solo un widget de botón flotante. Los snippets de iframe inline están acotados al contenedor y pueden usarse en varias ubicaciones.

Las instalaciones inline nuevas copian una etiqueta de script desde el origen tenant de RoofKit.

```html Instalación de iframe inline theme={null}
<script src="https://roofkit.site/roofkit-inline.js?id=ROOFER_ID" async></script>
```

Una landing con slug agrega el query landing. La landing principal lo omite. Un query height opcional puede definir un iframe más bajo.

Una instalación inline que ya está en un sitio sigue funcionando. No reemplaces esa instalación.

## Reenvío de parámetros

Ambos modos de instalación reenvían la atribución de marketing soportada a host\_page\_url y reenvían los parámetros de deep link por separado como parámetros superiores de la URL del iframe.

* La allowlist de atribución incluye parámetros UTM e identificadores comunes de clics publicitarios.
* Los parámetros de deep link son brand, material, shape y color.
* Los parámetros de deep link intencionalmente no se incrustan dentro de host\_page\_url.

```text URL de página host del widget de botón theme={null}
https://contractor.example/roof-replacement?brand=westlake&material=lib-tiles&shape=high_barrel&color=westlake-fn-barcelona-900-avalonbeachblend
```


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.