Incrustar

Funciones de FlipLink

Colocar un flipbook dentro de otro sitio web usando un iframe o código de incrustación para visualización en línea.

Definición

La incrustación es el proceso de colocar un [flipbook](/glossary/flipbook) o visor de documentos directamente dentro de otra página web utilizando un [iframe](/glossary/iframe) o un fragmento de JavaScript. El contenido incrustado se renderiza en línea dentro de la página anfitriona, conservando toda la interactividad: cambio de páginas, zoom, búsqueda y controles de navegación funcionan exactamente como en la visualización directa. Como el visor se carga dentro del DOM de la página anfitriona, los lectores nunca abandonan tu sitio ni ven un dominio de terceros en la barra del navegador.

Por Qué Es Importante

Cuando incrustas una publicación en lugar de enlazarla externamente, mantienes a los visitantes dentro de tu experiencia de navegación. Esto importa por tres razones. Primero, los lectores que permanecen en tu sitio tienen más probabilidades de realizar una acción — completar un formulario, hacer clic en un [botón CTA](/features/cta-buttons) o explorar páginas relacionadas. Segundo, las métricas de interacción como el tiempo en página y la [profundidad de desplazamiento](/glossary/scroll-depth) se atribuyen a tu dominio, lo que beneficia al SEO. Tercero, el contenido incrustado aparece en el flujo natural de la página, integrándose como parte de tu marca en lugar de parecer un recurso externo.

Cómo Funciona en FlipLink

La función de [compartir y distribuir](/features/sharing-and-distribution) de FlipLink genera un [código de inserción](/glossary/embed-code) listo para pegar en cada publicación. La opción predeterminada es un [iframe](/glossary/iframe) con [inserción responsiva](/glossary/responsive-embed) que se adapta al ancho de cualquier contenedor, asegurando que el flipbook se vea correctamente en escritorio, tableta y móvil sin ajuste manual. Todas las funciones configuradas — botones CTA, formularios de [captura de leads](/features/lead-capture), seguimiento de [analíticas](/features/analytics-and-insights) y [protección con contraseña](/features/password-protection) — funcionan dentro de la inserción. Para plataformas que bloquean iframes (algunos clientes de correo y redes sociales), FlipLink ofrece la [imagen clicable incrustada](/features/clickable-image-embed) como alternativa: una miniatura de portada que abre el flipbook completo en una nueva pestaña. También puedes restringir dónde puede incrustarse tu publicación utilizando la [lista blanca de dominios](/glossary/domain-whitelisting).

Detalles Técnicos

Un enlace de inserción se entrega típicamente como una etiqueta HTML `<iframe>` que apunta a la URL alojada de la publicación. El iframe opera en un contexto de navegación aislado, lo que significa que no puede acceder a las cookies ni al ámbito JavaScript de la página principal — esto proporciona una capa de seguridad tanto para el editor como para el sitio anfitrión. El código de inserción de FlipLink incluye `allow="fullscreen"` para que los lectores puedan expandir el visor, y utiliza `loading="lazy"` para diferir la carga hasta que el iframe entre en el [viewport](/glossary/viewport), evitando ralentizar el renderizado inicial de la página. Para aplicaciones de página única o plataformas CMS que eliminan las etiquetas iframe, hay disponible un fragmento de JavaScript que crea dinámicamente el iframe después de que el DOM se carga.

Mejores Prácticas

- **Ajusta el ancho del contenedor al propósito del contenido.** Una inserción a ancho completo funciona bien para catálogos y revistas. Para contenido complementario dentro de un artículo del blog, un contenedor más estrecho (600–800px) mantiene la inserción proporcionada al texto circundante. - **Usa la carga diferida.** Si incrustas varios flipbooks en una sola página — por ejemplo, una biblioteca de recursos — la carga diferida evita que todos soliciten recursos simultáneamente. - **Establece una altura mínima.** Sin una altura mínima, el iframe puede colapsar a cero en algunos frameworks CSS. Un valor de 400–500px previene saltos de diseño mientras el contenido carga. - **Activa la lista blanca de dominios.** Si tu publicación contiene contenido sensible o protegido, restringe la inserción a tus propios dominios para evitar que terceros la incrusten sin autorización. - **Prueba en móvil.** Las inserciones responsivas se adaptan al ancho, pero siempre verifica que las interacciones táctiles (pellizcar para zoom, deslizar para pasar página) funcionen correctamente en dispositivos reales.

Preguntas Frecuentes

**¿Puedo incrustar un flipbook de FlipLink en cualquier creador de sitios web?** Sí. Cualquier plataforma que permita agregar HTML personalizado — WordPress, Wix, Squarespace, Webflow, Shopify o un sitio codificado manualmente — admite el código iframe de FlipLink. Para plataformas con editores de bloques, pega el código dentro de un bloque HTML o "Código personalizado". **¿La incrustación afecta la velocidad de mi página?** El código de inserción de FlipLink utiliza carga diferida por defecto, por lo que el flipbook solo se carga cuando el visitante se desplaza cerca de él. La carga inicial de la página no se ve afectada. Una vez que el iframe carga, los recursos se sirven desde la CDN de FlipLink, manteniendo la entrega rápida independientemente de la ubicación del lector. **¿Cuál es la diferencia entre incrustar y compartir enlace?** Incrustar muestra el flipbook directamente en tu página para que los lectores interactúen con él en línea. [Compartir enlace](/glossary/link-sharing) envía a los lectores a una URL separada donde el flipbook se abre a pantalla completa. La incrustación es mejor para mantener visitantes en tu sitio; compartir enlace es mejor para canales como correo electrónico y mensajería donde la renderización en línea no es posible.

Términos relacionados

Funciones Relacionadas

Disponible en otros idiomas

¿Listo para transformar
tus PDFs?

Únete a miles de empresas que usan FlipLink para crear contenido atractivo e interactivo a partir de sus PDFs. Empieza gratis — sin tarjeta de crédito.