¿Quiere saber cómo abrir un video de YouTube en una ventana emergente en WordPress?
La caja ligera o ventana modal (emergente) es una característica muy común en la red. Sin embargo, generalmente se usa para mostrar imágenes, formularios de captura de correo electrónico, promociones o incluso formularios de registro.
Pero, ¿sabías que también es posible usarlo para mostrar videos en WordPress ? No?
No se preocupe, en este tutorial le mostraré cómo mostrar un video (YouTube, Vimeo, etc.) dans une caja ligera.
Pero antes, si nunca has instalado WordPress, descubre ¿Cómo instalar un blog de WordPress pasos 7 et ¿Cómo encontrar, instalar y activar un tema de WordPress en tu blog
Luego de vuelta a por qué estamos aquí.
Las razones por las que deberías usar un caja de luz para mostrar tus videos
En las caja ligera son ventanas modales, sin embargo, lo que no sabe es que no todas las imágenes que se muestran en ellas se cargan durante la « carga« página.
Le navegante CHARGE los imágenes cuando el caja ligera abre, este también es el caso de los videos. En resumen, es una característica que permitirá que sus páginas se abran más rápido. También te permitirá reducir el tamaño (longitud) De la páginaporque parte del contenido de esta página estará disponible en esta ventana modal.
Tregua de charla, vamos al grano.
Cómo instalar y configurar plugin WP Video Lightbox
WP Video Lightbox es una plugin disponible en WordPress.org. Lo que significa que puede instalarlo directamente desde su panel de WordPress, o descárgalo como un archivo .zip.
Para más detalles, consulte nuestra guía paso a paso sobre cómo instalar un complemento de WordPress.
Después de activar el plugin, vaya a su página de configuración desde esta ubicación " Ajustes >> Vídeo caja ligera ".
Iremos directamente al " Foto bonita ".
En realidad, esto plugin usar otro plugin, que está destinado principalmente a mostrar una galería de fotos. Pero puede cambiar parte de la información que se aplicará a los videos.
Para eso, explicaré algunas opciones (Obligatorio)Así que es como desee.
Ya la librería Foto bonita debe estar activado (comprobar « permitir Foto bonita »). Para que los usuarios sepan que están en la misma página, puede hacer que la ventana sea transparente (definir un valor de 0 a 1. Se aceptan valores de coma).
Descubre Las características de una ventana emergente efectiva para WordPress
Todas sus cajas de luz pueden tener un título que se puede mostrar (Espectáculo título). A veces, para ventanas modales grandes, debe permitir el cambio de tamaño (Permitir cambiar el tamaño). Y para videos más largos, los usuarios podrán ampliarlos (Permitir Expandir), Mejor aspecto.
Para el ancho y la altura del caja ligera, puedes editar los campos " tu préstamo estudiantil anchura "Y" tu préstamo estudiantil altura ".
Para elegir el tema de la caja ligera, cambia el menú desplegable tema ". También es posible activar la reproducción automática (marque la casilla " Autoplay »).
Cómo mostrar un caja ligera en un artículo
Le plugin propone una lista de códigos cortos que te permitirá mostrar caja ligera en artículos. Olvidé decirte que también puedes ver los videos disponibles en Vimeo.
Para ver un video YouTube ou Vimeodebes usar el códigos cortos suivant:
[video_lightbox_youtube] (pour YouTube)
[video_lightbox_vimeo5] (pour Vimeo)
Cada uno de estos códigos cortos acepta parámetros, que le permitirán:
- Definir el identificador (video_id) de un video, generalmente en este formato " YzqKMmQ_3Sg ". Ejemplos [video_lightbox_youtub video_id = "YzqKMmQ_3Sg"]
- Establecer la altura del video (altura)
- Establecer el ancho del video (anchura)
- Añadir una descripción (descripción)
- Agregar un ancla HTML (ancla), o el texto del enlace que abrirá la ventana.
- Añadir una miniatura (auto_thumb)
Si configura un ancla HTML, la miniatura se ignorará. En el caso contrario, auto_thumb toma el valor " 1 ".
Ve más allá descubriendo también ¿Cómo usar y manejar códigos cortos WordPress
Demo de un uso
Con lo que acabo de proporcionarle información, puede mostrar un video usando un código similar a este:
[video_lightbox_youtube video_id="YzqKMmQ_3Sg&rel=0" width="640" height="480" anchor="Une simple vidéo" description="Par Dr WP"]
Por un resultado similar
Puede ver una miniatura como se muestra arriba con un código similar a este.
[video_lightbox_youtube video_id="YzqKMmQ_3Sg&rel=0" width="640" height="480" auto_thumb="1" description="Par Dr WP"]
Para un resultado idéntico a este
antes de salir
Cabe señalar que algunos parámetros en el códigos cortos sobrescribirá los definidos en la configuración.
Descubre también algunos complementos premium de WordPress
Puedes usar otros plugins de WordPress para dar una apariencia moderna y optimizar el manejo de tu blog o sitio web.
Aquí le ofrecemos algunos complementos premium de WordPress que lo ayudarán a hacerlo.
1. FileBird
¿Alguna vez ha tenido problemas para administrar miles de archivos de imágenes, videos o documentos que cargó en su FTP de WordPress? si o no, no importa, lo importante es saber que el Plugin de WordPress FileBird lo ayudará a administrar sus archivos multimedia con facilidad y brindará más poder a su biblioteca.
Su interfaz de usuario sin interrupciones y su menú contextual permiten a los usuarios arrastrar y soltar archivos en carpetas o tienen los derechos necesarios para crear, renombrar o eliminar carpetas rápidamente de la misma manera que lo hace en su computadora. Con este complemento en la mano, sus archivos multimedia se organizarán sistemáticamente y podrá seleccionar fácilmente una imagen para insertarla en una página o publicarla.
Descubre también nuestro 6 complementos de WordPress para dar nueva vida a sus artículos
Además, este complemento es totalmente compatible con los complementos más populares, especialmente con WooCommerce, y también es compatible con una gran cantidad de idiomas. Así que si quiere dar un empujón a la gestión de su biblioteca de medios, el Plugin de WordPress FileBird podría ser tu arma secreta.
Descargar | Demo | alojamiento web
2. Social Share & Locker Pro
La extensión Social Share & Locker Pro ha sido diseñada para ayudar a que su sitio web sea más visible en las redes sociales. Con solo unos pocos clics, puede establecer la posición de sus íconos sociales o bloquear su contenido requiriendo compartir en una de las redes sociales que ofrece.
Tiene 10 plantillas que deberían cubrir los deseos más comunes. Todos sus modelos son perfectos y funcionan de maravilla. Además, con Social Share & Locker Pro, podrás mostrar el nombre completo de las redes sociales o simplemente el icono. Dependerá de tu diseño, el espacio disponible o tu gusto.
Descargar | Demo | alojamiento web
3. Formulario de contacto 7 Tooltips
Esta Extensión de WordPress del complemento Contact Form 7 brinda una sencilla funcionalidad de información sobre herramientas para su complemento Contact Form 7. Su información sobre herramientas se mostrará cuando se desplace el cursor sobre el elemento de destino. En los dispositivos móviles, la información sobre herramientas indica cuándo se activa el elemento de destino.
Sus principales características son: facilidad de uso, soporte para todas las versiones de Contact Form 7, personalización del color de fondo de la información sobre herramientas, soporte para código HTML, diseño completo receptivo y más.
Descargar | Demo | alojamiento web
Otros recursos recomendados
También lo invitamos a consultar los recursos a continuación para avanzar en el control y agarre de su sitio web y blog.
- Elementor: Cómo abrir una ventana emergente desde una URL o menú
- Cómo degradar una versión de un complemento de WordPress
- ¿Cómo encontrar un patrocinador y monetizar tu blog? : La guia
- Cómo personalizar el panel de WordPress para un cliente
- Cómo crear un menú sensible para WordPress móvil
Conclusión
Aquí! Eso es todo por este tutorial, espero que te ayude a mostrar videos de Youtube o Vimeo en un lightbox en tu sitio web de WordPress. no dude en comparte con tus amigos en tus redes sociales favoritas.
Sin embargo, también podrá consultar nuestra Recursos, si necesita más elementos para llevar a cabo sus proyectos de creación de sitios de Internet, consulte nuestra guía sobre Creación de blog de WordPress.
Pero, mientras tanto, cuéntenos sobre su comentarios y sugerencias en la sección dedicada.
...
Hola,
Estoy buscando una manera de mostrar una ventana emergente de video después de hacer clic en un botón. ¿Es posible hacer eso con WP Video Lightbox?
gracias,
cordialement,
Hola,
Sí, en principio.
había olvidado
Gracias
Hola y felicitaciones por el tutorial.
¿Es posible ampliar la miniatura del video cuando uso "auto_thumb"?
En principio, "auto_thumb" utiliza una imagen predefinida con tamaños fijos.
Hola,
Muchas gracias por este tutorial bien construido, quería saber si era posible agregar videos de otras plataformas además de You Tube y Vimeo (ejemplo de Openload) o si habría un límite.
suyo
Hola,
Si en principio. Aún no lo hemos probado.