Pular para o conteúdo
Categorias · Aplicações de Front-End

Exibir Selo Promocional em Promoção de catálogo

Atualizado em

Para realizar a implementação de um selo promocional em um produto na listagem do mesmo é necessário a implementação de um código no front-end.

Para realizar esta ação é acessar o painel administrativo em:

Layout e conteúdos > Layouts da loja > listagem de Produto>

mceclip2.png

Ao abrir a listagem de produtos é necessário acessar dois "include"

FlexyFtwoStoreBundle:Include:variant-list.html.twig > FlexyFtwoStoreBundle:Include:variant.html.twig

mceclip4.png

Após acessar o include do FlexyFtwoStoreBundle:Include:variant.html.twig, você precisa importar o código que realiza a busca da imagem que será cadastrada na aba de Banner e conteúdo.

Obs: Esta imagem precisa está na extensão de arquivo PNG, pois ela irá sobrepor a imagem do produto.

Segue o código para ser importado para exibição do selo (coloque no ponto adequado ao):

<a class="flexy-product-image-container" href="{{ url }}" title="">
   <span class="flexy-product-image-vertical-align-helper"></span>
   {% if promotion.promotion.referenceCode != null %}
     {% set gallery = flexy_ftwo_banner_image_list(promotion.promotion.referenceCode) %} 
     {% if gallery.images|length > 0 %}
       {% for image in gallery.images %}
         <img style="height: 5vh; position: absolute; right: 0px;" src="{{ image.path }}">
       {% endfor %}
     {% endif %}
   {% endif %}
   <img src="{{ f2_store_image_placeholder_medium(variant.product.masterImage) }}" title="{{ variant.product.name }}" alt="{{ variant.product.name }}" class="flexy-product-image"/>
</a>

Cadastrando o selo promocional

Para realizar o cadastro do selo promocional é necessário colocar o código de referência da imagem igual ao código de referência da promoção criada.

mceclip0.png

Após o passo a passo, o produto deve ser exibido como a imagem abaixo:

mceclip2.png
{% for categoryImage in variant.product.categories if categoryImage.referenceCode == "CÓDIGO-DE-REFERENCIA DA CATEGORIA"%}
INFORMAÇÃO
{% endfor %}

É possível também exibir o valor do desconto promocional de cada produto (em reais ou percentual) através da seguinte chamada:

{% if promotion.promotion.discountType == "R$" %}
    <span> {{ promotion.promotion.discountType }} {{ promotion.promotion.discountValue }} OFF! </span>
{% else %}
    <span> {{ promotion.promotion.discountValue }} {{ promotion.promotion.discountType }} OFF! </span>
{% endif %}

Esperamos que este material possa ter auxiliado no seu uso à plataforma Flexy, no entanto, caso ainda hajam dúvidas ou necessidades, por favor, entre em contato com nossa equipe de atendimento, que terá prazer em auxiliá-lo.