# Código de inserción

> Aprende cómo los códigos de inserción permiten a los creadores añadir contenido interactivo como videos, formularios y widgets de pago a sitios web y páginas de destino.

Canonical URL: https://crevio.co/es/glossary/embed-code

##  ¿Qué es un código de inserción?

Un código de inserción es un fragmento de HTML o JavaScript que te permite mostrar contenido de una plataforma dentro de otro sitio web o página. Los creadores usan códigos de inserción para añadir videos, botones de pago, formularios de registro y otros elementos interactivos a sus sitios web, [páginas de destino](/es/glossary/landing-page), y [páginas de venta](/es/glossary/sales-page).

## Cómo funcionan los códigos de inserción

1. **Generar código**: Copia el código de inserción desde la plataforma fuente
2. **Pegar en el editor**: Añade el código al editor de tu sitio web o constructor de páginas
3. **El contenido se muestra**: El contenido incrustado aparece en tu página
4. **Se mantiene actualizado**: Los cambios en la fuente se reflejan automáticamente en tu página

## Tipos comunes de inserciones para creadores

### Inserciones de video
- Videos de YouTube o Vimeo
- [cartas de venta en video](/es/glossary/video-sales-letter)
- Clips de vista previa del curso
- Videos testimoniales

### Pago y finalización de compra
- Botones para comprar productos
- Formularios de pago
- Widgets de pago
- Botones de "Comprar ahora"

### Formularios y registros
- Formularios de suscripción a la [lista de correo](/es/glossary/email-list)
- Incrustaciones de encuestas y cuestionarios
- Formularios de contacto
- Inscripciones para [imán de prospectos](/es/glossary/lead-magnet)

### Prueba social
- Carruseles de testimonios
- Widgets de reseñas
- Feeds de redes sociales
- Notificaciones de compras en vivo

### Programación
- Widgets de reserva de calendario
- Programadores de citas
- Registro de eventos

### Comunidad
- Widgets de chat
- Secciones de comentarios
- Feeds sociales
- Reproductores de transmisiones en vivo

## Ejemplos de códigos de inserción

### Inserción iFrame

```html
<iframe src="https://platform.com/content"
        width="100%"
        height="400"
        frameborder="0">
</iframe>
```

### Inserción de script

```html
<script src="https://platform.com/widget.js"></script>
<div data-widget-id="12345"></div>
```

### Inserción de botón

```html
<a href="https://checkout.platform.com/product"
   class="buy-button">
   Buy Now - $97
</a>
```

## Mejores prácticas

### Rendimiento
- Solo inserta lo que sea necesario
- Considera la carga perezosa para contenido que quede por debajo del pliegue
- Prueba la velocidad de la página después de añadir inserciones
- Utiliza carga asíncrona de scripts cuando esté disponible

### Seguridad
- Inserta solo desde fuentes de confianza
- Usa fuentes HTTPS para las inserciones
- Ten precaución con las inserciones JavaScript
- Revisa los permisos y el intercambio de datos

### Adaptabilidad móvil
- Usa opciones de inserción responsivas
- Prueba en varios dispositivos
- Establece valores de ancho/alto apropiados
- Usa anchos en porcentajes cuando sea posible

### Experiencia del usuario
- Asegúrate de que las inserciones carguen rápidamente
- Proporciona contenido alternativo cuando sea posible
- No sobrecargues las páginas con demasiadas inserciones
- Prueba la funcionalidad regularmente

## Problemas comunes con las inserciones

### Problemas de visualización
- Contenedor demasiado pequeño para el contenido
- Problemas de adaptabilidad móvil
- Conflictos de estilos con el CSS de la página
- Fallos de carga

### Problemas de funcionalidad
- Restricciones de origen cruzado (CORS)
- Advertencias de contenido mixto HTTPS
- Conflictos de JavaScript
- Bloqueadores de ventanas emergentes

## Inserciones específicas de la plataforma

Diferentes plataformas ofrecen varias opciones de inserción:
- **Plataformas de video**: YouTube, Vimeo, Wistia
- **Pagos**: Stripe, PayPal, Gumroad
- **Correo electrónico**: ConvertKit, Mailchimp, Beehiiv
- **Programación**: Calendly, TidyCal, SavvyCal
- **Comunidad**: Widgets de Discord, incrustaciones de Circle

## Alternativas a las inserciones

Cuando las inserciones no son ideales:
- **Enlaces directos**: URL simples a contenido externo
- **Capturas de pantalla con enlaces**: Imágenes estáticas que enlazan al contenido en vivo
- **Integraciones nativas**: Conexiones integradas de la plataforma
- **[Webhooks](/es/glossary/webhook)**: Sincronización de datos en segundo plano