PrestaShop Design & Navegação

Módulo Swatches de Variantes com Fotografia e Stock PrestaShop 8/9

As suas variantes merecem mais do que uma lista pendente.

Miniaturas fotográficas clicáveis para as cores, os tamanhos e os materiais, pré-visualização da galeria ao passar o rato e indicador de stock por variante, diretamente na ficha de produto. As miniaturas são derivadas automaticamente das fotografias das suas combinações: instale, e já está a funcionar.

At a glance
  • Miniaturas fotográficas em vez das listas pendentes de variantes
  • Pré-visualização instantânea da galeria ao passar o rato por uma variante
  • Stock visível por variante: em stock, stock baixo ou esgotado
  • Derivação automática a partir das fotografias das combinações
  • Navegação por teclado completa (padrão ARIA radiogroup)
PrestaShop 8 e 9 Zero configuração Acessível por teclado 5 idiomas Sem dependências
  • Reembolso em 30 dias
  • 12 meses de atualizações
  • Suporte em 24h
www.datafirefly.com/pt/
Swatches de variantes com fotografia e stock numa ficha de produto PrestaShop
v1.1.0 · atualizado 2026-07-02
O que faz

A versão curta.

01

Swatches fotográficos automáticos

As miniaturas são derivadas das fotografias das suas combinações existentes, sem qualquer carregamento necessário para começar. Afine depois com imagens dedicadas ou códigos hexadecimais por atributo.

02

Pré-visualização da galeria ao passar o rato

Passe o rato por uma miniatura de cor: a imagem principal mostra de imediato a fotografia dessa variante, pré-carregada para uma apresentação instantânea. A imagem original regressa assim que o cursor sai da miniatura.

03

Stock por variante

Cada miniatura mostra o seu estado: em stock, stock baixo (com limiar configurável) ou esgotado. As variantes esgotadas podem ficar riscadas ou totalmente ocultas.

04

Acessibilidade nativa

Padrão WAI-ARIA radiogroup completo: navegação pelas setas do teclado, uma única paragem de tabulação por grupo e estados anunciados aos leitores de ecrã. Um argumento concreto para a conformidade em acessibilidade.

A versão longa

Tudo o que quer saber antes de instalar.

Uma análise detalhada de como o Módulo Swatches de Variantes com Fotografia e Stock PrestaShop 8/9 funciona, porque o construímos assim e o raciocínio por trás das funcionalidades acima.

§ 01

A escolha visual que faz vender

Na moda, na decoração ou na cosmética, o cliente compra com os olhos. Uma lista pendente com «Branco / Preto / Vermelho» não mostra nada; uma fila de miniaturas fotográficas mostra tudo. O módulo substitui os widgets nativos de variantes por botões visuais clicáveis, e cada passagem do rato pré-visualiza a variante na galeria principal, com o cliente a explorar a gama sem um único recarregamento de página.

§ 02

Funcional logo na instalação

A maioria dos módulos de swatches exige carregar uma imagem por atributo antes de mostrar seja o que for. Aqui, as miniaturas são derivadas automaticamente das fotografias já associadas às suas combinações: instale o módulo, abra uma ficha de produto, e está no lugar. Uma proteção inteligente evita falsos positivos: um grupo Tamanho cujos valores partilham todos a mesma fotografia mantém-se em texto, e só os grupos realmente diferenciados pela imagem passam a fotografia.

§ 03

O stock visível antes do clique

Cada miniatura anuncia a sua disponibilidade: em stock, stock baixo abaixo de um limiar que define, ou esgotado. As variantes esgotadas podem manter-se visíveis mas riscadas, o que é útil para mostrar a extensão da gama, ou desaparecer por completo. O cálculo respeita tanto o comportamento global de encomenda sem stock da loja como o definido por combinação.

§ 04

Acessível e conforme

O seletor implementa o padrão WAI-ARIA radiogroup como deve ser: uma única paragem de tabulação por grupo de atributos, navegação pelas setas com ciclo, seleção com espaço ou enter, estados anunciados às tecnologias de apoio e anel de foco visível. Com as exigências europeias de acessibilidade, é um diferenciador concreto face aos seletores de variantes puramente visuais.

§ 05

Leve e robusto por arquitetura

Os dados das variantes são incluídos diretamente na página no momento da apresentação: sem chamadas AJAX no carregamento, sem dependência da disponibilidade de um endpoint, e com apresentação imediata. O módulo melhora os widgets nativos do PrestaShop em vez de substituir os templates do tema, e é isso que o torna compatível com o Classic, o Hummingbird e a maioria dos temas premium, sem sobrecargas.