En este tutorial te explicamos cómo gestionar la visibilidad de la información de cuotas en tu tienda. Según el diseño que tengas activo, podés controlar esta opción directamente desde el administrador o mediante un código CSS.
Helpjuice Warning Callout Title
El cambio es solo en la visualización de la información. Cuando tus clientes realicen la compra y lleguen a la pasarela de pago, se van a ofrecer las cuotas o mensualidades que estén configuradas dentro de la misma.
Pasos para mostrar u ocultar cuotas/mensualidades
Antes de empezar, identificá qué diseño tenés activo en tu tienda:
- Atlántico, Bahía, Cubo, Lifestyle, Material o Silent: en estos diseños las cuotas se muestran por defecto. Si necesitás ocultarlas, seguí los pasos en "Ocultar con CSS".
- Resto de los diseños: podés mostrar u ocultar las cuotas directamente desde el administrador. Seguí los pasos en "Desde el administrador".
Helpjuice Info Callout Title
Para ocultar las cuotas en el carrito de compras, todos los diseños requieren el CSS correspondiente.
Desde el administrador
En Página de inicio y Listado de productos
1. Ingresar a la sección "Tienda online > Diseño", y hacer clic en "Editar diseño".
2. En el menú lateral, buscar la sección "Listado de productos".
3. Buscar el casillero "Mostrar cuotas/meses en listado de productos" dentro de la sección Información de cuotas/meses.
4. Marcar o desmarcar la opción según lo que necesités.
5. Hacer clic en "Publicar cambios".
En Detalle de producto
1. Ingresar a la sección "Tienda online > Diseño", y hacer clic en "Editar diseño".
2. En el menú lateral, buscar la sección "Detalle de producto".
3. Buscar el casillero "Mostrar cuotas/meses en la página de producto" dentro de la sección Información de cuotas/meses.
4. Marcar o desmarcar la opción según lo que necesités.
5. Hacer clic en "Publicar cambios".
Ocultar con CSS
En estos diseños las cuotas se muestran por defecto. Aplicá el código CSS correspondiente para ocultarlas. Si ya tenés un código aplicado y querés volver a mostrarlas, quitá ese código.
1. Ingresar a la sección "Tienda online > Diseño" y seleccionar "Editar diseño".
2. Hacer clic en la opción "Edición Avanzada de CSS" y pegar el código correspondiente a la sección y diseño que se indica a continuación:
Página de inicio y listados de productos
Bahía / Cubo / Lifestyle / Material / Silent:
.item-installments {
display: none;
}Atlántico:
.js-max-installments {
display: none;
}Detalle de producto
Bahía / Cubo:
.js-max-installments-container.js-max-installments.col-12.mb-2 {
display: none;
}Atlántico:
.js-max-installments-container.js-max-installments {
display: none;
}Lifestyle:
.js-max-installments-container.text-tertiary {
display: none;
}Material:
.js-max-installments-container.d-inline-block {
display: none;
}Silent:
.product-installments {
display: none;
}Focus:
.js-max-installments-container.installments {
display: none;
}Carrito de compras
Cali, Uyuni, Toluca, Morelia:
.js-installments-cart-total.cart-installments.font-small.mt-1.text-right {
display: none;
}Simple:
.js-installments-cart-total.cart-installments.font-small.m-top-quarter.clear-both.pull-right {
display: none;
}Amazonas, Bahía, Cubo:
.js-installments-cart-total.text-right {
display: none;
}Recife:
.js-installments-cart-total.cart-installments.font-small.font-weight-normal.mt-1.text-right {
display: none;
}Lima:
.js-installments-cart-total.cart-installments.font-small.mt-2.text-right {
display: none;
}Rio:
.js-installments-cart-total.cart-installments.mt-2.text-right {
display: none;
}Trend:
.js-installments-cart-total.cart-installments.font-small {
display: none;
}Idea:
.js-installments-cart-total.font-body {
display: none;
}Lifestyle:
.js-installments-cart-total.font-body.clear-both.text-right.p-top-quarter {
display: none;
}Silent:
.js-installments-cart-total.font-body.pull-right.text-right.m-top-quarter.clear-both {
display: none;
}Material:
.js-installments-cart-total.font-small.clear-both.text-right.p-top-quarter {
display: none;
}3. Hacer clic en "Probar CSS".
4. Hacer clic en "Publicar cambios".
¿Por qué no veo las cuotas/mensualidades si ya las activé?
Si marcaste la opción para mostrar cuotas/mensualidades pero aún no aparecen en tu tienda, revisá estos puntos clave.
Pago Nube no aparece en el checkout: si el problema no es la visualización sino que Pago Nube directamente no se muestra como opción de pago, revisá las posibles causas en: ¿Por qué no veo disponible el medio de pago que configuré en mi Tiendanube?
Monto mínimo de configuración: si ofrecés financiación a partir de un monto mínimo de compra (con Pago Nube o Mercado Pago), recordá que las cuotas solo se muestran si el valor del producto supera el monto mínimo que hayas configurado en tu pasarela de pagos.
Actualización del navegador: a veces los cambios tardan unos segundos en impactar. Probá navegando en una ventana de incógnito o borrando la caché de tu navegador.
CSS aplicado previamente: si usás un diseño que no tiene la opción en el administrador, es posible que las cuotas no se vean porque tenés un código CSS aplicado. Para volver a mostrarlas, quitá ese código desde "Tienda online > Diseño > Editar diseño > Edición Avanzada de CSS".
Helpjuice Info Callout Title
Si tu tienda tiene un diseño personalizado con el FTP abierto, es posible que la opción desde el administrador no funcione automáticamente. En este caso, te recomendamos validar con tu desarrollador que la documentación de cuotas esté correctamente implementada en el código de tu tienda.
¡Listo!
Ahora ya sabés cómo gestionar la visibilidad de la financiación en tu tienda. Mantener esta información clara y visible es una de las formas más efectivas de reducir la fricción en el proceso de decisión de tus clientes y potenciar tus ventas.