Cómo omitir líneas en un bloque de tabla dinámica
Qué aprenderás
Descubre cómo omitir filas (p. ej., artículos) en un bloque de tabla dinámica. El caso de uso más habitual es ocultar elementos irrelevantes, como el seguro de envío o los artículos de regalo gratis, de un email de carrito abandonado. Sin embargo, puedes seguir estos pasos para cualquier email que use un bloque de tabla dinámica.
Este proceso implica editar directamente el código de tu email. Solo se recomienda para especialistas en marketing con conocimientos técnicos o para quienes tengan acceso a un desarrollador. Nuestro equipo de asistencia no puede ayudarte a escribir código personalizado más allá de la orientación general que se recoge en esta documentación. Para mantener la seguridad de tus datos, el equipo de asistencia de Klaviyo no puede abrir archivos HTML.
Antes de empezar
En este artículo se explica cómo ocultar artículos de los bloques de tabla dinámica existentes. Si aún no has creado un bloque de tabla dinámica funcional (por ejemplo, los productos en un email de carrito abandonado o de confirmación de pedido), aprende a crear uno desde cero o empieza con un mensaje de nuestra biblioteca de flujos.
Escribe tus declaraciones if
Antes de hacer cambios en tu plantilla, crea 2 fragmentos de código con un editor de texto o de código (en algún lugar desde el que puedas copiar y pegar los fragmentos más adelante). Cada fragmento de código constará de 3 partes:
- Una etiqueta if de apertura,
{% if ... %}, que indica qué elementos deben aparecer en el bloque de tabla. - Contenido, como una etiqueta de imagen o texto sobre el producto.
- Una etiqueta de cierre,
{% endif %}.
Crea la etiqueta if de apertura
Aquí tienes algunos ejemplos de etiquetas if de apertura:
Etiqueta | Significado |
{% if item.price != 0 %} | Si el precio del artículo (item.price) es distinto de 0. |
{% if item.product.name != "Route Shipping Insurance" %} | Si el nombre del artículo (item.product.name) es cualquier cosa excepto «Route Shipping Insurance». |
{% if not "T-Shirt" in item.product.title %} | Si el título del artículo (item.product.title) no contiene «T-Shirt». |
{% if item.title %} | Si se ha establecido el título del elemento (item.title) (es decir, si tiene algún valor). |
Estas etiquetas distinguen entre mayúsculas y minúsculas y deben coincidir exactamente con tus datos. Por ejemplo, si la variable del precio de tu artículo es distinta de item.price (p. ej., item.Price o item.details.line_price), actualiza el código para que coincida con tu fuente de datos.
Crea el contenido para la declaración if
En cuanto al contenido, sigue estos pasos para usar el contenido existente de tu bloque de tabla dinámica. Escribe este fragmento de código en un editor de código o de texto; lo añadirás a tu plantilla en la siguiente sección.
- En Contenido de la celda para la imagen del bloque de tabla, haz clic en Reemplazar para ver el marcador de posición de la imagen.
- Copia todo el código del campo Variable dinámica o URL dinámica. Ten en cuenta que puede ser una variable dinámica sencilla o un fragmento de código más largo; cópialo todo, independientemente de la longitud.
- Sustituye el marcador de posición de este fragmento de código por el código que copiaste del campo Variable dinámica o URL dinámica.
<img src="PLACEHOLDER" style="width: 200px; height: auto;" width="200">Si tu bloque de tabla existente tiene una variable dinámica simple para la imagen, el contenido resultante tendrá un aspecto similar a este:
<img src="{{item.product.variant.images.0.src}}" style="width: 200px; height: auto;" width="200"> Si tu bloque de tabla existente contiene un fragmento de código más largo, el contenido resultante podría tener este aspecto:
<img src="{% if item.product.variant.images.0.src %}{{item.product.variant.images.0.src}}{%else%}{{item.product.images.0.src|missing_product_image}}{%endif%}" style="width: 200px; height: auto;" width="200">Añade tu etiqueta de cierre
Luego, reúne todo el contenido: la etiqueta if de apertura, después tu contenido y, por último, una etiqueta {% endif %} de cierre.
Repite esto en el contenido de texto
Luego, repite este proceso con el contenido del lado derecho de tu bloque de tabla (p. ej., el contenido de texto). Haz clic en </> para abrir el editor de código y copiar todo el contenido HTML; a continuación, envuelve este contenido en la misma instrucción if (pasos 1 y 3) que usaste para el contenido de la imagen.
Así es como queda todo junto:
Fragmento de código 1 (imagen del producto) | Fragmento de código 2 (detalles del producto) |
|
|
Y aquí tienes un desglose de esos fragmentos de código:
Fragmento de código 1 (imagen del producto) | Fragmento de código 2 (detalles del producto) |
|
|
Al usar estos fragmentos de código, asegúrate de usar comillas rectas (") en lugar de comillas curvas (“) para garantizar que el código se muestre correctamente.
Una vez que hayas escrito ambos fragmentos de código, continúa en el editor de plantillas siguiendo los pasos que se indican a continuación.
Omitir filas en un bloque de tabla dinámica
Antes de editar tu bloque de tabla dinámica, considera guardar el bloque original como contenido universal por si necesitas consultarlo en mensajes futuros. Luego, desvincula el bloque y edítalo por separado, para que tus ediciones no se guarden en el bloque de contenido universal.
- Si tu email forma parte de un flujo, configúralo como Borrador o Manual para que los mensajes no se envíen mientras editas el mensaje del flujo.
- Asegúrate de que el Contenido de la celda de ambas columnas del nuevo bloque de tabla esté configurado en Texto.
- Haz clic en </> para abrir el editor HTML de la parte izquierda del bloque de tabla.
- Copia el fragmento de código de la imagen del producto que creaste en la sección anterior y pégalo en el campo HTML.
- Haz clic en Listo en la esquina superior izquierda.
- Ve al editor del lado derecho del bloque de tabla.
- Haz clic en </> para abrir el editor HTML de la parte derecha del bloque de tabla.
- Copia el fragmento de código de detalles del producto que creaste en la sección anterior y pégalo en el campo HTML, sustituyendo todo el contenido anterior.
- Haz clic en Listo.
- Previsualiza el email para asegurarte de que aparece como esperas: el artículo omitido no debería aparecer, pero el resto de artículos aparecerán con normalidad. Asegúrate de previsualizarlo con un evento que incluya el artículo que intentas ocultar, para poder confirmar que está oculto.
Declaraciones condicionales y editor de texto integrado
Cuando añadas determinadas declaraciones condicionales a un bloque de texto, es posible que desaparezcan del editor de texto integrado. El código seguirá estando allí, pero oculto. Para ver y editar instrucciones condicionales, usa el generador de etiquetas de Django o mueve el contenido a un bloque de HTML dedicado para editar el código directamente.
Las siguientes etiquetas no aparecen en el editor de texto en línea, pero permanecen en el bloque de texto:
- {% for ... %}
- {% endfor %}
- {% if ... %}
- {% elif ... %}
- {% else %}
- {% endif %}
- {% with ... %}
- {% endwith %}
Solución de problemas
No aparecen elementos en la vista previa
- Asegúrate de previsualizar con un evento que coincida con la fuente de datos que usaste (p. ej., Started checkout para un mensaje de carrito abandonado).
- Confirma que Repetir para y Alias de fila coinciden exactamente con Colección de filas y Alias de fila del bloque original.
El artículo que debería omitirse sigue apareciendo
Comprueba la ortografía y el uso de mayúsculas en tu declaración if. Si el producto sigue apareciendo, significa que cumple los criterios de tu declaración if, así que tu declaración if no está configurada correctamente. Más información sobre la lógica condicional en las plantillas.
Resultado
Después de seguir estos pasos, los artículos que no cumplan los criterios de tu instrucción if no aparecerán en mensajes como emails de carrito abandonado o confirmación de pedido.