¿Qué es un iframe?(Y cómo usarlos)

Dado que los sitios web se vuelven más complejos, solo tiene sentido que los usuarios de WordPress necesitarían un medio para mostrar contenido de la tercera página. Afortunadamente, hay un elemento HTML llamado iPhame para ayudarlo a hacer esto. En esta publicación, le explicaremos qué es un iframe y cuándo es mejor usar uno. También discutiremos las ventajas de este elemento para los usuarios de WordPress y le mostraremos cómo incorporarlo fácilmente a través de algunos de nuestros módulos Div Builder. ¡Vamos a bucear! Suscríbete a nuestro canal de YouTube
¿Qué es un iframe? Puede pensar en una línea en línea (o iframe) como una ventana en su página web, que se refiere a otro contenido en línea. La forma más técnica de describirlo es un documento HTML incorporado en otro documento HTML:

Desde el punto de vista del código, cada iframe incluye etiquetas HTML , así como un atributo SRC para indicar el contenido del contenido que desea incorporar en su sitio. Sin embargo, hay otros atributos que puede incorporar para especificar el dimensiones de la “ventana” en sí. Por ejemplo, aquí está el código para el ejemplo simple del iframe de la captura de pantalla anterior:
En este caso, la etiqueta incluye la URL de la página para mostrar y la altura y ancho de la ventana en píxeles. Puede incorporar otros atributos para activar las políticas de función (Permitir), la pantalla completa (LeakFelsCreen), PayPaymentRequests) y muchas más. Es importante tener en cuenta que hay muchos atributos de iframe que HTML5 no aceptan (como el desfile). Como tal, asegúrese de utilizar información actualizada cuando se haga a mano iframei. ¿Cuándo debe usar un iframe? El objetivo principal de un iframe para la mayoría de los usuarios de WordPress que no son desarrolladores es mostrar contenido de terceros en su sitio, algunos usos comunes incluyen:
Comerciales. Muchos anuncios secundarios y banner son en realidad iframes. Esto permite que sus socios publicitarios proporcionen y mantengan el contenido que pagan para mostrarlo en su sitio.
Videos de Youtube. El código de incorporación de YouTube utiliza un iframe para mostrar un video alojado en su plataforma en su página utilizando esta técnica, no debe preocuparse por cargar el video en su biblioteca de medios.
Mapas de Google. Si alguna vez ha pedido comida de un restaurante de entrega, es posible que haya visto un iframe Google Maps al seleccionar la ubicación más cercana en la tienda. Desafortunadamente, Google ha reemplazado esto con la tecla API MAPS, por lo que los nuevos usuarios no pueden incorporar mapas a través de iFrames.
Publicaciones en redes sociales. Una forma de mostrar las últimas publicaciones en las redes sociales es a través de un iframe. Esto es conveniente, ya que se actualizarán automáticamente para incluir apreciación, comentarios y otros elementos dinámicos (como explicaremos en breve) .flux RSS. Al igual que las publicaciones en constante cambio en las redes sociales, los flujos RSS a veces son más fáciles de mostrar usando un iframe. Simplemente use la URL del flujo RSS como atributo SRC.
También hay varios casos de uso más complejos, como desarrollar un solo sistema de inicio de sesión o un editor de texto que ve es lo que obtiene (wysiwyg). Por ejemplo, el editor TinyMCE (interfaz de contenido de WordPress predeterminado anterior) usa un iframe.
¿Cuáles son los beneficios de usar iframes? Para la mayoría de los usuarios, iframei son beneficiosos, ya que mantienen la separación entre el documento HTML primario (su sitio) y el contenido externo que carga. Esto es útil por dos razones. En primer lugar, no tiene que preocuparse por actualizar el contenido de terceros que desea mostrar. Sus socios publicitarios pueden cambiar sus promociones, su flujo de Facebook puede actualizarse y Google Maps puede adaptarse para nuevos desarrollos de viviendas. Su iframe cargará su última versión.
Tome el ejemplo introductorio que utilicé al comienzo de esta publicación. Actualmente incluye un anuncio de Sale Divin. Sin embargo, una vez que finalice la promoción, iframe mostrará nuestra página de inicio estándar sin banner. Además, mantener la separación entre su contenido y la de otros sitios puede proporcionar seguridad adicional. No tiene que preocuparse por la importación accidental de vulnerabilidades o errores al agregar el tercer código de pieza directamente a los archivos de su sitio. Aun así, hay muchos desarrolladores que se oponen al uso de iFrames, ya que también pueden presentar riesgos de seguridad. Cualquier elemento malicioso en el documento que cargue en su “ventana” estará disponible en su sitio web de terceros podría aprovechar esta oportunidad para “phish” los datos del usuario. Parte de fuentes confiables como Google, YouTube y las populares redes sociales o noticias plataformas, esto no debería ser un problema. Como siempre, sea selectivo cuando incorpore nuevas funciones en su sitio web 2 módulos DIVI que puede usar para incorporar iFrames en su sitio de WordPress si desea usar iFrames en su sitio web de WordPress, div puede ayudar. Algunos de nuestros módulos son particularmente adecuados para alojar este elemento HTML en cuestión y pueden hacer que sea aún más fácil trabajar con él. Aquí hay tres con los que puedes comenzar de inmediato.
1. El módulo de video como se mencionó anteriormente, uno de los usos más comunes para iframes es mostrar videos de YouTube en su sitio web, cuando se usa el módulo de video DIV, lo hace exactamente detrás de escena:

Como expliqué a un tutorial anterior, cuando agrega la URL para un video externo en el módulo Divi, genera automáticamente un iframe para mostrarlo. Si no desea ser necesario para ingresar la etiqueta y los atributos , esta es una forma rápida y fácil de lograr el mismo resultado. 2. El módulo de código Por supuesto, siempre tiene la opción de incorporar el código personalizado utilizando el código del código. Esta es una forma simple de escribir la etiqueta y los atributos o usar el iframe incluidos en los códigos de incorporación de terceros. Usaremos una publicación de Facebook como ejemplo. Reciba el código de incorporación haciendo clic en el icono de tres puntos en la esquina superior derecha de la publicación que desea mostrar y seleccione Incorporing:
Luego copie el código de iframe y agréguelo al código Div
Su iframe ahora mostrará su publicación de Facebook en Divi Builder y al frente de su sitio después de haber publicado o actualizado la página. Conclusión Con tantas formas útiles de conectar y compartir información con las personas en la web, es lógico que desee atraer contenido de tercera parte, como videos de YouTube en su propio sitio. Como tal, los Iramas se crean para ayudarlo a hacer esto, mientras mantiene el contenido separado de las fuentes externas “.

Si cree que iPhrames podría ser una solución útil para su sitio, los siguientes módulos de Divi Builder pueden ayudarlo a incorporar algunos de los tipos de contenido más populares rápidamente:
Módulo de video: Genere rápido iframe YouTube con nada más que la URL de la página de video.

Módulo de código: cree su propio iframe o pegamento en códigos de incorporación de terceros como Facebook. ¿Tiene preguntas sobre iFrames sobre cómo usarlos en su sitio de WordPress?¡Déjelos para nosotros en la sección de comentarios a continuación!Imagen presentada por VectorsMarket / Shutterstock.com