Como pular linhas em um bloco de tabela dinâmica
O que você vai aprender
Saiba como ignorar linhas (por exemplo, itens) em um bloco de tabela dinâmica. O caso de uso mais comum para isso é ocultar itens irrelevantes, como seguro de remessa ou itens de presente gratuito, de um e-mail de carrinho abandonado. No entanto, o senhor pode seguir essas etapas para qualquer e-mail que use um bloco de tabela dinâmico.
Esse processo envolve a edição direta do código de seu e-mail. Isso só é recomendado para profissionais de marketing tecnicamente experientes ou para aqueles que têm acesso a um desenvolvedor. Nossa equipe de suporte não pode ajudá-lo a escrever código personalizado além da orientação geral abordada nesta documentação. Para manter a segurança dos seus dados, a equipe de suporte da Klaviyo não pode abrir arquivos HTML.
Antes de começar
Este artigo aborda como ocultar itens de blocos de tabelas dinâmicas existentes. Se o senhor ainda não criou um bloco de tabela dinâmica funcional (por exemplo, os produtos em um carrinho abandonado ou e-mail de confirmação de pedido), saiba como criar um do zero ou comece com uma mensagem em nossa biblioteca de fluxos.
Escreva suas instruções if
Antes de fazer alterações em seu modelo, crie 2 trechos de código usando um editor de texto ou de código (em algum lugar de onde o senhor possa copiar e colar os trechos posteriormente). Cada trecho de código será composto de 3 partes:
- Uma tag if de abertura,
{% if ... %}, indicando quais itens devem aparecer no bloco da tabela. - Conteúdo, como uma tag de imagem ou texto sobre o produto.
- Uma tag de fechamento,
{% endif %}.
Criar a tag if de abertura
Aqui estão alguns exemplos de abertura de tags if:
Etiqueta | Significado |
{% if item.price != 0 %} | Se o preço do item(item.price) for diferente de 0. |
{% if item.product.name != "Route Shipping Insurance" %} | Se o nome do item(item.product.name) for diferente de "Route Shipping Insurance". |
{% if not "T-Shirt" in item.product.title %} | Se o título do item(item.product.title) não contém "T-Shirt". |
{% if item.title %} | Se o título do item(item.title) estiver definido (ou seja, tiver algum valor). |
Essas tags diferenciam maiúsculas de minúsculas e devem corresponder exatamente aos dados do senhor. Por exemplo, se a variável para o preço do item for algo diferente de item.price (por exemplo, item.Price ou item.details.line_price), Atualize o código para corresponder à sua fonte de dados.
Criar o conteúdo para a instrução if
Para o conteúdo, siga estas etapas para usar o conteúdo existente de seu bloco de tabela dinâmica. Escreva esse trecho de código em um editor de código ou de texto; o senhor o adicionará ao seu modelo na próxima seção.
- Em Cell Content (Conteúdo da célula ) para a imagem do bloco da tabela, clique em Replace (Substituir ) para visualizar o espaço reservado da imagem.
- Copie o código inteiro do campo Dynamic variable (Variável dinâmica) ou dynamic URL (URL dinâmico ). Observe que essa pode ser uma variável dinâmica simples ou um trecho de código mais longo; copie tudo, independentemente do tamanho.
- Substitua o espaço reservado nesse trecho de código pelo código que o senhor copiou do campo Dynamic variable or dynamic URL (Variável dinâmica ou URL dinâmico ).
<img src="PLACEHOLDER" style="width: 200px; height: auto;" width="200">Se o bloco de tabela existente tiver uma variável dinâmica simples para a imagem, o conteúdo resultante será parecido com o seguinte:
<img src="{{item.product.variant.images.0.src}}" style="width: 200px; height: auto;" width="200"> Se o bloco de tabela existente contiver um trecho de código mais longo, o conteúdo resultante poderá ter a seguinte aparência:
<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">
Adicione sua tag de encerramento
Em seguida, junte todo o conteúdo: sua declaração if de abertura, depois seu conteúdo e, por fim, uma tag {% endif %} de fechamento.
Repita o procedimento para o conteúdo do texto
Em seguida, repita esse processo com o conteúdo do lado direito do bloco da tabela (por exemplo, o conteúdo do texto). Clique em </ > para abrir o editor de código e copiar todo o conteúdo HTML e, em seguida, envolva esse conteúdo na mesma instrução if (etapas 1 e 3) que você usou para o conteúdo da imagem.
Aqui está a aparência de tudo junto:
Trecho de código 1 (imagem do produto) | Trecho de código 2 (detalhes do produto) |
|
|
E aqui está um detalhamento desses trechos de código:
Trecho de código 1 (imagem do produto) | Trecho de código 2 (detalhes do produto) |
|
|
Ao usar esses trechos de código, certifique-se de usar aspas retas (") em vez de aspas curvas (") para garantir que o código seja renderizado corretamente.
Depois de escrever os dois trechos de código, continue no editor de modelos seguindo as etapas abaixo.
Pular linhas em um bloco de tabela dinâmica
Antes de editar o bloco de tabela dinâmica, considere salvar o bloco original como conteúdo universal, caso o senhor precise fazer referência a ele em mensagens futuras. Em seguida, desvincule o bloco e edite-o separadamente, para que suas edições não sejam salvas no bloco de conteúdo universal.
- Se o e-mail fizer parte de um fluxo, defina-o como Rascunho ou Manual para que as mensagens não sejam enviadas enquanto o senhor edita a mensagem do fluxo.
- Certifique-se de que o Cell Content de ambas as colunas do novo bloco de tabela esteja definido como Text (Texto).
- Clique em </ > para abrir o editor HTML do lado esquerdo do bloco da tabela.
- Copie o snippet de código da imagem do produto que criou na seção anterior e cole-o no campo HTML.
- Clique em Done (Concluído ) no canto superior esquerdo.
- Navegue até o editor do lado direito do bloco da tabela.
- Clique em </ > para abrir o editor HTML do lado direito do bloco da tabela.
- Copie o snippet de código dos detalhes do produto criado na seção anterior e cole-o no campo HTML, substituindo todo o conteúdo anterior.
- Clique em Done (Concluído).
- Visualize o e-mail para garantir que ele seja exibido conforme o esperado: o item ignorado não deve aparecer, mas todos os outros itens aparecerão normalmente. Certifique-se de fazer a visualização prévia com um evento que contenha o item que o senhor está tentando ocultar, para garantir que ele esteja oculto.
Declarações condicionais e o editor de texto em linha
Quando o senhor adiciona determinadas instruções condicionais a um bloco de texto, elas podem desaparecer do editor de texto em linha. O código ainda está presente, apenas oculto. Para visualizar e editar instruções condicionais, abra o campo Código-fonte do bloco de texto.
As seguintes tags são visíveis apenas no campo Código-fonte de um bloco de texto:
- {% for ... %}
- {% endfor %}
- {% if ... %}
- {% elif ... %}
- {% else %}
- {% endif %}
- {% with ... %}
- {% endwith %}
Solução de problemas
Nenhum item aparece na visualização
- Certifique-se de que a visualização esteja sendo feita com um evento que corresponda à fonte de dados usada (por exemplo, Started checkout para uma mensagem de carrinho abandonado).
- Confirme se o Repeat for e o Row alias correspondem exatamente ao Row collection e ao Row alias do bloco original.
O item que deveria ser ignorado ainda está aparecendo
Verifique a ortografia e a capitalização de sua declaração if. Se o produto ainda estiver aparecendo, isso significa que ele atende aos critérios da instrução if, portanto, a instrução if não está configurada corretamente. Saiba mais sobre a lógica condicional em modelos.
Resultado
Depois de seguir essas etapas, todos os itens que não atenderem aos critérios de sua declaração if não aparecerão em mensagens como carrinho abandonado ou e-mails de confirmação de pedido.
Recursos adicionais
- Referência sobre a personalização de mensagens
Saiba como usar as tags do modelo da Klaviyo para personalizar a experiência dos seus clientes.
- Como importar um modelo HTML personalizado
Saiba como importar um modelo HTML personalizado para o Klaviyo.