O widget Product Search permite que os clientes pesquisem produtos em sua loja. Conforme o comprador digita na barra de pesquisa, os resultados são preenchidos com base nos produtos que correspondem aos critérios de pesquisa. Depois de selecionar uma opção, o comprador é direcionado diretamente para a página do produto.
Para adicionar o widget Product Search:
-
No painel lateral, clique em Widget.
-
Na seção da loja, clique e arraste o Product Search para o local desejado na página.
Para acessar o editor de conteúdo, clique com o botão direito do mouse no widget e clique em Edit Content (Editar conteúdo).
No campo de texto Placeholder, o senhor pode inserir o texto que aparecerá no widget Product Search. Esse texto desaparecerá quando o usuário começar a digitar no widget.
Para acessar o editor de design, clique com o botão direito do mouse no widget Product Search e clique em Edit Design.
Campo de entrada
O campo da busca é o local do widget Procura de Produtos no qual o cliente deve digitar os dados da busca. Você pode editar as seguintes configurações de design no campo da busca:
-
Dimensões
-
Altura (em px)
-
-
Plano de fundo e layout (essas configurações se aplicam ao campo de entrada antes que o comprador comece a digitar sua consulta):
-
Cor de fundo
-
Espessura da borda (em px). Para alterar o tipo de borda, clique no ícone de engrenagem ao lado de Bordas.
-
Cantos arredondados (em px). Para alterar o tipo de borda, clique no ícone de engrenagem ao lado dos cantos arredondados.
-
Se há ou não sombra e, se houver, a cor, tipo e posição da sombra.
-
-
Foco (essas configurações se aplicam ao campo de entrada depois que o comprador começa a vincular sua consulta):
-
Cor de fundo
-
Espessura da borda (em px)
-
Se há ou não sombra e, se houver, a cor, tipo e posição da sombra.
-
Buscar resultados
"Resultados da busca" é o local onde os resultados são preenchidos abaixo do campo da busca. Você pode editar as seguintes configurações de design nos resultados da busca:
-
Dimensões
-
Altura máx. (em px)
-
-
Plano de fundo e layout (essas configurações se aplicam aos resultados da pesquisa antes de o comprador acessar hover para ver um resultado específico):
-
Cor
-
Fronteira. Para alterar o tipo de borda, clique no ícone de engrenagem ao lado de Borda.
-
Cantos arredondados. Para alterar quais cantos são arredondados, clique no ícone de engrenagem ao lado de Cantos arredondados.
-
Se há ou não sombra e, se houver, a cor, tipo e posição da sombra.
-
-
hover (Essas configurações se aplicam quando o comprador está hover em um resultado de pesquisa específico):
-
Cor de fundo
-
Se há ou não sombra e, se houver, a cor, tipo e posição da sombra.
-
No texto dentro do campo da busca e dos resultados da busca, você pode editar as seguintes configurações de design:
-
Fonte
-
Tamanho da Fonte
-
Cor da fonte
-
Formato (negrito, itálico, sublinhado)
-
Alinhamento
-
Direção à
-
Ao passar o cursor sobre o texto dos resultados da busca, você pode editar a cor e o formato.
Para obter informações sobre as opções de design que não são específicas deste site widget (animação ou espaçamento), consulte widget Design.