Avisos
Vaciar todo

Logos en página de checkout  

 
María
 María
Usuario experto

Hola,

Recientemente he incluido bizum como una de las formas de pago en mi web. El tema es que cuando el usuario va  a elegir el metodo de pago me aparece un logo de Bizum (ver pantallazo). Sin embargo no me parece los logos de paypal ni de redsys, que son las otras dos posibilidades de pago.

¿Cómo podría hacer para incluir los otros dos logos en su apartado correspondiente?

¿Cómo podría reducir el tamaño de estos logos? (actualmente el de bizum es demasiado grande) 

Gracias!

Captura de pantalla (37)

Contenido solo visible a usuarios registrados

Citar
Respondido : 08/02/2024 11:20 am
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola María, 

En este caso puedes probar si el siguiente plugin te permite configurar las imágenes a todos los métodos de pago que tienes → https://wordpress.org/plugins/payment-gateway-icons-for-woocommerce/

Una vez lo instalas solo debes acceder a WooCommerce → Ajustes → métodos de pago, editar el método de pago al que quieres añadir las imágenes y colocar la URL de esta imagen.

image

Ten en cuenta que estas imágenes las puedes subir en tú mismo WordPress y desde allí obtener la URL, también en añadir los iconos con un tamaño adecuado a su proporción como quieres mostrarlos

Verifícalo y nos comentas como va todo

Un Saludo

ResponderCitar
Respondido : 08/02/2024 5:04 pm

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

María
 María
Usuario experto

Hola! Gracias! el plugin que me has dicho funciona perfecto

Y una cosa más con respecto al pagina de checkout: Por algún motivo me aparece en negrita la cifra de costes de envío. Sin embargo la cifra del coste TOTAL del pedido no aparece en  negrita (ver pantallazo). Estoy intentando cambiarlo con elementor, pero no lo consigo ¿sabes como puedo hacerlo?

Gracias!

Captura de pantalla (38)

 

ResponderCitar
Respondido : 12/02/2024 8:27 am
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola María.

Añade lo siguiente en apariencia -> Personalizar -> CSS Adiciona.

.woocommerce-Price-amount.amount {
font-weight:700!important;
}

 

Un Saludo

ResponderCitar
Respondido : 12/02/2024 9:11 am

Gestor de Contraseñas - VPN Conexión Segura - Gestor 2FA (Segundo Factor de Autenticación

María
 María
Usuario experto

@pepesoler Gracias Pepe, pero no me funciona.

Es raro, cuando añado el código que me pasas, en pc no cambia nada. Sin embargo en movil me aparece todas las cantidades en negrita (tanto los precios de los productos, como el coste de envió el subtotal y el total). Yo lo que querría es que aparezca en negrita solo el total (y si puede ser un poco más grande mejor)

¿alguna idea de como podría hacerlo?

Gracias!

ResponderCitar
Respondido : 12/02/2024 9:49 am
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola María, 

En este caso puedes probar si el siguiente código CSS te permite mostrar el precio total como deseas

.order-total .woocommerce-Price-amount.amount {
font-weight: 700 !important;
font-size: 16px;
}

Verifícalo y nos comenta va todo

Un Saludo 

ResponderCitar
Respondido : 12/02/2024 1:51 pm

Cursos Gratuitos WordPress

María
 María
Usuario experto

@karen Hola Karen, pues lo soluciona solo a medias.

En versión pc no cambia nada (mira pantallazo)

Captura de pantalla (42)

 Y en la versión movil sí pone el precio en negrita y grande, pero el problema es que también pone en negrita y grande los impuestos, y queda muy raro. Mira el pantallazo

(tambien quiero quitar la negrita de los costes de envío, si es posible)

 

Screenshot 20240212 150859 Chrome

 Gracias!!

ResponderCitar
Respondido : 12/02/2024 2:26 pm
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Maria.

Pues veo que el código funciona bien:

Captura de pantalla 2024 02 12 a las 15.37.08

Puedes probar con lo siguiente:

.woocommerce-checkout-review-order-table .order-total .woocommerce-Price-amount {
font-weight: bold!important;
}

 

Si no funciona, por favor, adjunta una captura para que veamos como estas añadiendo el código.

 

Un Saludo.

 

ResponderCitar
Respondido : 12/02/2024 2:51 pm

wpdoctor-revisa-la-salud-de-tu-wordpress

María
 María
Usuario experto

Hola Pepe, adjunto pantallazo para que veáis donde lo he añadido

Captura de pantalla (46)

En el pantallazo que tu adjuntas en realidad hay una cosa que no es correcta. Precisamente esos "6,32€" del impuestos es lo que quiero que no se vea en negrita ni grande (en tu pantallazo está en el mismo tamaño que el total)

¿Me estoy explicando bien? perdonad por el lio y gracias

 

ResponderCitar
Respondido : 12/02/2024 3:56 pm
Bruno
 Bruno
Soporte CMS Webempresa Moderator

Que tal María,

Validando un poco el procedimiento vamos a revisar algunas cosas

Primero que nada si deseas que el ajuste sea global independientemente del dispositivo, debe ser fuera del media-queries que tienes definido en tus CSS, recuerda que los estilos deben estar fuera de la llave y al parecer falta una llave de cierre 

image

Seguido de ello prueba con los siguientes estilos

.page-id-71980 #shipping_method .amount{
font-weight: 400 !important;
}
.page-id-71980 .order-total .bdi{
font-weight: 700 !important;
}

El primero hara que el costo de envio no este en negrita

El segundo forzara a que el precio total si este en negrita

Y solo por validar estamos colocando la clase que corresponde a la pagina del checkout

Prueba y nos comentas, Saludos!

ResponderCitar
Respondido : 12/02/2024 5:29 pm

María
 María
Usuario experto

Hola Bruno,

Disculpa, pero no entiendo bien la primera parte de tu comentario ¿Dónde debería colocar esa llave de cierre que dices que falta? (¿las que señalas con una flecha en tu imagen tengo que mantenerlas?)

Gracias!

ResponderCitar
Respondido : 13/02/2024 8:27 am
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Maria.

Si te das cuenta en la captura veras que ese código abre con dos corchetes, uno del media y otro de la clase de CSS pero solo cierras uno:

screenshot www.webempresa.com 2024.02.13 12 30 30

Debajo del último corchete de cierre tienes que añadir otro para cerrar los dos que tienes abiertos.

 

Un Saludo

ResponderCitar
Respondido : 13/02/2024 11:35 am

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