[Resuelto] Mejorar la apariencia de la galería de productos  

Hola Carmen,

En este caso nos tendrías que comentar primero la url de tu consulta y luego nos indicas que requieres en especifico, por ejemplo (que los títulos sean color azul, los subtitulos verde, cambiar el color del botón a negro) de esta forma podremos facilitarte el código css de lo que sea posible modificar.

Un saludo 🖐️ 

@argenis

Hola Argenis. Si mi URL es  https://www.prueba.unifilomedia.net

Lo que ocurre es que la galería de imágenes de producto se ve muy poquito, son imágenes muy pequeñitas y están difuminadas. ¿Habría alguna forma de hacerlo más vistoso? Gracias de antemano

Un saludo 🙂

Hola Carmen,

Po lo que veo y entiendo nos hablas de la sección que esta arriba de productos destacados, esta como esta construida?, puedes enviarnos una captura de como lo estas creando para verificar el constructor y las opciones de personalización si te refieres a esta sección, si no coméntanos cual es la sección y poder así ayudarte 😀 

Un saludo 🖐️ 

@argenis

Hola Argenis. No utilizo un constructor. Estoy con el tema Storefront. Te envío una captura. Gracias de antemano.

Un saludo 🙂

Hola Carmen,

Estupendo ya sabemos que te refieres entonces a la galería de un producto como tal de woocommerce, ahora mejorarla en que sentido? puedes escribirnos que es lo que necesitas modificar y te comentamos si es posible hacerlo con css o si en efecto como lo indicas requerirás un plugin para cambiar este aspecto.

Un saludo 🖐️ 

@argenis

Hola Argenis. No quiero utilizar plugins. Sólo quería que no saliera difuminado, mejorar su aspecto con CSS. Me gustaría saber qué opciones tengo con CSS para ir probando. Gracias de antemano.

Un saludo 🙂

Hola Carmen,

En este caso si deseas por ejemplo modificar las imágenes miniaturas de la galería de tus productos puedes probar con los siguientes código CSS, puedes añadirla en el apartado Apariencia -> Personalizar -> CSS Adicional

Para configurar la opacidad de las imágenes usa el siguiente código

.single-product div.product .woocommerce-product-gallery .flex-control-thumbs li img {
opacity: .6 !important;
}

Con el siguiente código puedes manipular el tamaño y margen de las miniaturas

.single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-4 .flex-control-thumbs li {
width: 22.286% !important;
margin-right: 6.286% !important;
}

Comprueba si con estos códigos puedes modificar lo que necesitas

Un Saludo

@karen

Estupendo Karen 🙂

Hola Carmen,

Enhorabuena funciona, siempre encantados de poder ayudarte.

Con esto podemos dar el tema como solucionado.

Escríbenos si tienes cualquier otra consulta

Un Saludo 😊