# Imagem ao Passar o Rato e Etiquetas Automáticas: guia de configuração

> Este guia explica como instalar e configurar o módulo Imagem ao Passar o Rato e Etiquetas Automáticas para PrestaShop 8 e 9. O módulo mostra a segunda imagem do produto…

- Página: <https://www.datafirefly.com/pt/documentation/image-survol-badges-prestashop/>
- Idioma: pt
- Atualizado em: 2026-09-03
- Outros idiomas: [fr](https://www.datafirefly.com/documentation/image-survol-badges-prestashop/index.md), [en](https://www.datafirefly.com/en/documentation/image-survol-badges-prestashop/index.md), [es](https://www.datafirefly.com/es/documentation/image-survol-badges-prestashop/index.md), [de](https://www.datafirefly.com/de/documentation/image-survol-badges-prestashop/index.md), [it](https://www.datafirefly.com/it/documentation/image-survol-badges-prestashop/index.md), [pl](https://www.datafirefly.com/pl/documentation/image-survol-badges-prestashop/index.md), [nl](https://www.datafirefly.com/nl/documentation/image-survol-badges-prestashop/index.md)
- Índice: <https://www.datafirefly.com/pt/documentation/llms.txt>

Este guia explica como instalar e configurar o módulo **Imagem ao Passar o Rato e Etiquetas Automáticas** para PrestaShop 8 e 9. O módulo mostra a segunda imagem do produto ao passar o rato nas listagens e aplica automaticamente etiquetas Novo, Promoção e Stock baixo segundo regras que define, sem sobrepor o seu tema.

## Instalação

A instalação faz-se como para qualquer módulo PrestaShop:

1. A partir do back-office, vá a **Módulos > Gestor de módulos**.
2. Clique em **Instalar um módulo** e carregue o arquivo ZIP do módulo.
3. Terminada a instalação, clique em **Configurar** para abrir a página de definições.

O módulo regista o hook `actionFrontControllerSetMedia` e carrega os seus assets (CSS e JavaScript) apenas nas páginas de listagem e na página de produto. Nenhum ficheiro de template é sobreposto.

## Configuração da imagem ao passar o rato

O primeiro bloco de configuração controla a substituição de imagem ao passar o rato:

- **Mostrar a segunda imagem ao passar o rato**: ativa ou desativa o efeito. Os produtos que só têm uma imagem são ignorados automaticamente.
- **Efeito de transição**: _Fundido_, _Fundido + zoom_ ou _Instantâneo_.
- **Posição das etiquetas**: canto onde as etiquetas aparecem (cima esquerda, cima direita, baixo esquerda, baixo direita). Esta definição é comum a todas as etiquetas.

A imagem ao passar o rato corresponde à **segunda imagem do produto** segundo a ordem de posição definida no separador Imagens da ficha de produto. Para mudar a imagem apresentada ao passar o rato, reordene simplesmente as imagens do produto.

## As três etiquetas automáticas

Cada etiqueta pode ser ativada de forma independente, com a sua própria designação multilingue, a sua cor de fundo e a sua cor de texto.

### Etiqueta « Novo »

Aparece durante um número de dias configurável depois da data de criação do produto. O valor por defeito retoma a definição PrestaShop `PS_NB_DAYS_NEW_PRODUCT`. Defina a duração pretendida no campo **Produto considerado novo durante (dias)**.

### Etiqueta « Promoção »

Aparece quando um produto está marcado « Em promoção » ou quando um **preço específico com desconto** está ativo para o contexto do visitante (loja, moeda, país, grupo de clientes e datas de validade). A opção **Mostrar a percentagem de desconto** substitui a designação pelo valor, por exemplo `-20 %`, quando o desconto é expresso em percentagem.

### Etiqueta « Stock baixo »

Aparece quando a quantidade disponível do produto é estritamente superior a 0 e inferior ou igual ao **limiar de stock baixo** que define. A quantidade é lida na tabela `stock_available` com resolução multiloja (a loja atual tem prioridade sobre o grupo de lojas).

## Designações multilingues

As designações Novo, Promoção e Stock baixo são fornecidas por defeito em francês, inglês, espanhol, alemão e italiano. Cada designação é editável idioma a idioma a partir da página de configuração: selecione o idioma no seletor do campo e introduza o texto pretendido. Para o português, preencha por exemplo « Novo », « Promoção » e « Últimas unidades ».

## Desempenho e compatibilidade

- **Uma única chamada AJAX agrupada** por página recupera os dados de todos os produtos visíveis (até 120 produtos por lote).
- A imagem ao passar o rato é carregada em **lazy load**, apenas ao primeiro passar do rato.
- O script é em **JavaScript vanilla**, sem dependência de jQuery.
- O módulo deteta as miniaturas de produto em JavaScript: é compatível com o tema _classic_ e os temas filhos, e readapta-se automaticamente depois da navegação por facetas e da paginação AJAX.
- Em telemóvel tátil, a substituição de imagem ao passar o rato é desativada automaticamente.

## Resolução de problemas

**Ao passar o rato não aparece a segunda imagem.** Verifique que o produto tem pelo menos duas imagens no separador Imagens da sua ficha, e que a opção de imagem ao passar o rato está ativada.

**Uma etiqueta não aparece.** Certifique-se de que a etiqueta está ativada, que a sua designação não está vazia para o idioma atual, e que a condição está preenchida (produto recente, preço específico ativo, ou quantidade abaixo do limiar).

**Nada aparece depois de um filtro.** O módulo readapta-se depois da navegação por facetas; se o seu tema usar um mecanismo de renderização personalizado, limpe a cache do PrestaShop (Parâmetros avançados > Desempenho) depois da instalação.