Avisos
Vaciar todo

Swatches  

 
Francisco
 Francisco
Reputable Member

Hola, tengo en este sitio el custom images and colors aplicado para poder elegir los colores, pero en un producto, las imágenes las tenemos ya cuadradas y se ven medio extraños, habrá forma de que en ese producto se pueda ver también las imágenes redondeadas o mínimo, que se le quite el círculo atrás y que quede sola la imagen?

https://www.imagencosmeticos.com/producto/glitter-de-bissu/

 

Gracias.

Contenido solo visible a usuarios registrados

Citar
Respondido : 06/12/2022 5:26 pm
Bruno
 Bruno
Soporte CMS Webempresa Moderator

Que tal Francisco,

Para tener este aspecto

image

Puedes probar los siguientes estilos CSS

.swatch-wrapper img {
border-radius: 50px;
}

Recuerda agregarlos desde el apartado de custom CSS de tu tema si lo tiene, o bien desde las opciones Apariencia-> Personalizar-> CSS agregado

Saludos!

ResponderCitar
Respondido : 06/12/2022 5:33 pm

Francisco
 Francisco
Reputable Member

@bruno-vichetti de hecho, tenía la misma configuración pero en 40px, ahora ya lo modifiqué y se ve diferente a la foto que me enviaste. Te anexo imagen

webempresa

 No se ve mal, pero me latía más en la forma en como se veía contigo. 

ResponderCitar
Respondido : 06/12/2022 9:14 pm
Argenis
 Argenis
Soporte CMS Webempresa Moderator

Hola Francisco,

Trata sustituyendo el código que has agregado con este:

.swatch-wrapper img {
border-radius: 50px;
border-color: white !important;
border: solid 3px;
}
.select-option.swatch-wrapper {
background: none !important;
border: solid 1px #ffffff00 !important;
}

Igualmente, verifica si tienes configurado los iconos cuadrados en lugar de circulares, veo que el plugin que gestiona esto es WooCommerce Variation Swatches and Photos, quizás si subes la imagen circular en lugar de cuadrada esta adopte la forma en lugar de colocarse en un cuadrado.

Recuerda que al ser un complemento de pago no podemos hacer mucho, sobre todo si es algún ajuste en cuanto a su configuración.

Un saludo 🖐️ 

ResponderCitar
Respondido : 06/12/2022 9:37 pm
Francisco me gusta

optimiza-automaticamente-todas-las-imagenes-de-tu-wordpress

Francisco
 Francisco
Reputable Member

@argenis mira, sí me sirvió en ese producto, pero en los demás, ya se ven cuadrados, 

https://www.imagencosmeticos.com/producto/labial-humectante-bissu/

https://www.imagencosmeticos.com/producto/esmalte-bissu-15ml/

En cuanto para poder poner si circular o cuadrado, en la versión que tengo del plugin no me deja. Antes con el CSS primero que me habías compartido con ese sí quedaban circulares y ya yo ponía el color mediante el número, sólo en ese producto estoy poniendo imagen ya que el color está combinado.

ResponderCitar
Respondido : 07/12/2022 5:42 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Francisco, 

En este caso revisa si el siguiente código te permite mostrar las opciones de forma circular

a.swatch-anchor {
border-radius: 100px !important;
}

Verifica y nos comentas como ha ido todo

Un Saludo 

 
ResponderCitar
Respondido : 07/12/2022 6:06 pm

Cursos Gratuitos WordPress