> ## Documentation Index
> Fetch the complete documentation index at: https://www.mellowtel.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.
# Monetiza tu sitio web con Mellowtel
> Añade una sola etiqueta de script para permitir que los visitantes te apoyen optando por compartir el ancho de banda no utilizado.
Mellowtel permite que tus visitantes opten por compartir el ancho de banda no utilizado a cambio de apoyarte. Añades un pequeño widget a tu sitio, los visitantes eligen instalar la extensión complementaria y tú ganas en función de las solicitudes que maneja su navegador.
**Tiempo estimado:** 5 a 10 minutos. **Necesitarás:** una [cuenta de Mellowtel](https://www.mellowtel.com/mellowtel-auth/) y acceso al HTML de tu sitio (o un equivalente en tu framework).
## Cómo funciona
Una etiqueta de script renderiza un botón, icono o banner en tu sitio.
Se les lleva a instalar la extensión complementaria de Mellowtel.
Tu `invite_id` vincula a ese visitante con tu cuenta, por lo que las solicitudes manejadas por su navegador se te atribuyen.
## Antes de comenzar
* Una cuenta de Mellowtel. [Regístrate aquí](https://www.mellowtel.com/mellowtel-auth/) si no tienes una.
* Tu `invite_id`, que se encuentra en tu [tablero](https://www.mellowtel.com/mellowtel-auth/) después de crear un enlace de soporte.
* Acceso al HTML de tu sitio, o la capacidad de añadir una etiqueta `
```
```jsx Next.js (App Router) theme={null}
import Script from 'next/script'
export default function Layout({ children }) {
return (
{children}
)
}
```
```jsx React (Vite / CRA) theme={null}
import { useEffect } from 'react'
export function MellowtelWidget() {
useEffect(() => {
const s = document.createElement('script')
s.src = 'https://cdn.mellow.tel/widget.js?type=button&position=bottom-right&invite_id=INVITE_ID'
s.async = true
document.body.appendChild(s)
return () => { s.remove() }
}, [])
return null
}
```
```html WordPress theme={null}
```
```html Webflow / Shopify theme={null}
```
## Opciones de configuración
Controla la apariencia del widget a través de parámetros de consulta en la URL del script.
| Parámetro | Requerido | Valores | Descripción |
| ----------- | --------- | ------------------------------------------------------ | --------------------------------------- |
| `invite_id` | Sí | Tu ID del tablero | Atribuye las ganancias a tu cuenta. |
| `type` | Sí | `button`, `icon`, `banner` | Estilo del widget mostrado en tu sitio. |
| `position` | Sí | `bottom-right`, `bottom-left`, `top-right`, `top-left` | Dónde se ubica el widget en la página. |
Previsualiza cada combinación en vivo antes de lanzarlo: [abre la previsualización del widget](https://cdn.mellow.tel/preview?position=bottom-right\&type=button\&invite_id=ijxf49s9h2f). Cambia los parámetros `type` y `position` en la URL para ver cada variante.
## Verifica que funcione
Abre la página en una nueva pestaña del navegador (o en una ventana de incógnito para evitar la caché).
Deberías ver el botón, icono o banner en la posición que elegiste. Si falta, revisa la consola del navegador para ver si hay solicitudes bloqueadas.
Al hacer clic en el widget deberías ser llevado a la página de instalación de la extensión con tu `invite_id` adjunto.
Una vez que un visitante instala y opta por participar, su actividad aparece en tu tablero de Mellowtel.
## Solución de problemas
* Confirma que la etiqueta de script está dentro de `` y que tu `invite_id` está completo.
* Abre DevTools y revisa la pestaña de Red para una solicitud a `cdn.mellow.tel/widget.js`. Si está bloqueada, probablemente un bloqueador de anuncios o filtro de contenido sea la causa.
* Revisa tu Política de Seguridad de Contenidos. Puede que necesites permitir `https://cdn.mellow.tel` bajo `script-src`.
El parámetro `invite_id` está vacío o aún contiene el marcador de posición literal `INVITE_ID`. Copia el valor real de tu tablero y pégalo en la URL.
A menudo, una regla de CSP o CDN está eliminando el script. Revisa los encabezados de respuesta en tu host de producción y permite `cdn.mellow.tel`.
Elimina la etiqueta `