¡Fuera decimales!
En este artículo te explicaremos específicamente como modificar el formato del precio de tus campañas quitando los decimales de manera simple con solo sustituir el campo dinámico del precio o modificando el código HTML de tu plantilla.
Quitar decimales en campos dinámicos
El editor de WoowUp utiliza un potente motor de templates llamado TWIG, el cual te brinda la capacidad de utilizar programación para modificar los templates según los datos disponibles de tus clientes en WoowUp.
Para lograr eliminar los decimales de los precios de tus campañas es necesario usar dos filtros de TWIG: number_format
y raw
.
Usamos number_format
para eliminar los decimales del precio y raw
para asegurarnos de que el formato se respete tal como lo deseamos, sin interferencias del sistema.
¿Cómo usar los filtros number_format
y raw
en el campo dinámico de en el campo dinámico?
Supongamos que tienes una fila dinámica y quieres mostrar el precio de oferta o lista en tu campaña y el campo dinámico que tienes el siguiente:
{{p_offer_or_list_price}}
Este campo te va a traer precio tal como está almacenado, sin aplicarle ningún tipo de formato o modificación.
En cambio, si lo modificamos y aplicamos los filtros se vería así:
{{ p.raw_offer_or_list_price | number_format(0, '.', '.', '.') }}
El código anterior quita los decimales y se asegura que el formato que establecimos en number_format
se respete.
Para llevar a cabo estos cambios desde el editor debes ubicar el campo de precio y reemplazarlo por el nuevo código. Aquí te mostramos un ejemplo:
A continuación, te brindamos una tabla con los posibles campos dinámicos de precio del editor y el nuevo código correspondiente por el que debes reemplazarlos.
Campos dinámicos sin decimales!
Campo dinámico | Código original | Nuevo código sin decimales |
Price | {{p.price)}} | {{p.raw_price|number_format (0, '.', '.','.')}} |
Listado de más de 1 producto | {{p1.price)}} | {{p1.raw_price|number_format (0, '.', '.','.')}} |
Listado de más hasta 2 productos | {{p2.price)}} | {{p2.raw_price|number_format (0, '.', '.','.')}}
|
Listado de más de 3 productos | {{p3.price)}} | {{p3.raw_price|number_format (0, '.', '.','.')}} |
Listado de más de 4 productos | {{p4.price)}} | {{p4.raw_price|number_format (0, '.', '.','.')}} |
Precio unitario del producto | {{ p.unit_price }} | {{p.raw_unit_price|number_format (0, '.', '.','.')}} |
Precio oferta o lista del producto | {{p_offer_or_list_price}} | {{p.raw_offer_or_list_price|number_format (0, '.', '.','.') }} |
Producto Visitado Destacado | {{featured.price}} | {{featured.raw_price|number_format (0, '.', '.','.')}} |
Total del precio de todos los productos que contienen el carrito abandonado | {{customer.abandoned_cart_total}} | {{customer.abandoned_cart.raw_total_price|number_format(0, '.', '.','.')}} |
Precio anterior a la baja de precio (usar en campaña de "Productos Visitados en la web que bajaron de precio" | {{ p.strike_price("$")|raw }} | ${{p.price_drop_previous_price | number_format(0, ",",".") }} |
Quitar decimales de campos HTML
En el editor hay ciertos campos de precio que no se muestran como campos dinámicos sino que se calculan por medio de código HTML. Entonces si deseas quitar los decimales en un campo de HTML, debes reemplazar el código que está por defecto en el campo, por el código que te brindamos a continuación:
Para aquellos casos en los que la fila dinámica calcula el offer price en HTML como en este caso:
Debes sustituir el código del campo HTML por el siguiente:
<div style="font-size: 14px; color: rgb(85, 85, 85); "> {% if p.raw_price > 0 and p.raw_offer_price < p.raw_price %}<span style="text-decoration: line-through;">${{p.raw_price | number_format(0,',','.') }}</span>{% endif %} <span> {{ p.calculate_discount("% OFF")}}</span> </div>
FAQ
Quiero conocer la sintaxis del filtro number_format
en TWIG
Quiero conocer la sintaxis del filtro number_format
en TWIG
La sintaxis básica del filtro number_format
es la siguiente
{{ variable | number_format(decimal_places, 'decimal_separator', 'thousands_separator') }}
Desglosamos cada parámetro a continuación:
decimal_places
:Descripción: Especifica el número de decimales que deseas mostrar.
Ejemplo: Si lo configuras en
2
, mostrará dos decimales. Si lo configuras en0
, no se mostrarán decimales.Uso:
number_format(2, ...)
mostrará1234.56
.
decimal_separator
:Descripción: Define el carácter que se usará para separar la parte entera de la parte decimal.
Ejemplo: En muchos países, el punto
.
se usa como separador decimal, mientras que en otros se usa la coma,
.Uso:
number_format(2, ',', ...)
mostrará1234,56
.
thousands_separator
:Descripción: Especifica el carácter que se usará para separar los millares en el número.
Ejemplo: En muchos países, una coma
,
se usa como separador de miles, mientras que en otros se usa un punto.
o un espacio en blanco.Uso:
number_format(2, ',', '.')
mostrará1.234,56
.
A continuación algunos ejemplos completos:
Número con decimales:
{{ 1234567.89 | number_format(2, ',', '.') }}
Resultado: 1.234.567,89
2 decimales:
89
al final.Separador de miles: El punto
.
separa los miles (1.234.567
).Separador decimal: La coma
,
separa la parte entera de la parte decimal.
Número sin decimales:
{{ 1234567.89 | number_format(0, '.', ',') }}
Resultado: 1,234,568
Sin decimales.
Coma
,
como separador de miles (1,234,568
)
Es importante mantener exactamente el mismo formato en los códigos, en caso de que tengas alguna inquietud puedes contactar a nuestro equipo de soporte.