¿Desea mostrar sus imágenes de WordPress lado a lado? A veces, es posible que desee alinear sus fotos en una fila en su sitio web. En este artículo, le mostraremos cómo mostrar imágenes de WordPress una al lado de la otra.
Mostrar imágenes de WordPress una al lado de la otra
Hay varias formas diferentes de mostrar imágenes una al lado de la otra en WordPress. Echemos un vistazo a tres métodos simples:
Método 1: Alinear a la izquierda
Primero, agregue sus fotos a su publicación o página de WordPress. Simplemente haga clic en el botón Agregar contenido multimedia de la esquina superior izquierda del editor para seleccionar las imágenes que desea insertar.
Una vez que haya seleccionado sus imágenes, haga clic en el botón Insertar en publicación.
Ahora haga clic en cada imagen y seleccione Alinear a la izquierda para alinear las imágenes una junto a la otra (debe estar en la pestaña Visual para hacer esto).
Alternativamente, puede seleccionar » Izquierda «en la opción de Alineación (en» Configuración de visualización de archivos adjuntos») dentro de la pantalla Insertar medios antes de hacer clic en el botón Insertar en publicación.
Ahora tus imágenes se mostrarán automáticamente una al lado de la otra. Aquí está el resultado:
Hay una desventaja de este método. Si tiene texto en la misma página que sus imágenes, llenará cualquier área vacía a la derecha de las imágenes:
Método 2: Agregue CSS personalizado
Al agregar su propio código CSS personalizado a sus imágenes, puede tener un control completo sobre cómo se muestran exactamente en su sitio web.
En primer lugar, asegúrese de que está editando su página o publicación en modo Texto (no en modo Visual).
En la etiqueta <img> para sus imágenes, agregue el siguiente código:
style= "float: left; margin-right: 15px;"
Esto hará que sus imágenes se alineen una junto a la otra con un espacio de 15 píxeles a la derecha de cada imagen. Tendrás que añadir este código a todas las imágenes que quieras mostrar una junto a la otra, como se muestra a continuación:
Así es como se ve:
Si desea evitar que el texto se muestre a la derecha de las imágenes, use este código en su lugar:
style= "display: inline-block; margin-right: 15px;"
Ahora, el texto no se ajustará a las imágenes. En su lugar, se verá así:
El único inconveniente de este método es que requiere agregar código manualmente, lo que puede ser un poco confuso y lento.
Método 3: Usar Envira Gallery
Envira Gallery es el método más fácil para mostrar tus imágenes una al lado de la otra en WordPress. Incluso convierte automáticamente fotos más grandes en miniaturas más pequeñas para que todas sus imágenes se vean perfectas cuando se muestran una junto a la otra.
Para comenzar, deberá instalar y activar el complemento Envira Gallery.
Luego, simplemente vaya a Envira Gallery «Agregar nuevo» para agregar una nueva galería de imágenes en WordPress.
Simplemente agregue un nombre para su galería de imágenes y agregue las fotos que desee en la sección Imágenes en Configuración de Galería Envira.
Asegúrese de pulsar el botón Publicar para guardar los cambios.
Ahora verá un cuadro de diálogo con los códigos cortos y otra información. Simplemente copie y pegue uno de estos códigos cortos en la página o publicación donde desea mostrar sus imágenes una al lado de la otra.
(Para obtener un tutorial detallado, consulta cómo crear una galería de imágenes con miniaturas en WordPress.)
¡Eso es todo! Este es un ejemplo de cómo aparecerán tus imágenes en tu sitio web:
También puede usar Envira para mostrar imágenes de diferentes alturas una junto a la otra. Para nuestro tutorial sobre eso, echa un vistazo a cómo crear una galería de imágenes de mampostería en WordPress.
Esperamos que este artículo te haya ayudado a aprender a mostrar imágenes de WordPress una junto a la otra. También puede consultar nuestra guía sobre cómo crear un deslizador de imágenes para sus galerías de WordPress.
Si te gusta este artículo, síguenos en Facebook y Twitter para obtener más tutoriales gratuitos de WordPress.
Utilizando WordPress y quieres obtener Envira Gallery gratis?
Envira Gallery ayuda a los fotógrafos a crear hermosas galerías de fotos y videos con solo unos pocos clics para que puedan mostrar y vender su trabajo.