Widget do Produto: Design
3 min de leitura
Utilize as opções abaixo para criar o Design perfeito para seu Widget do Produto.
Background e Bordas
- Cor e Opacidade do Background: Clique na caixa de cor para escolher a cor que deseja para o seu background. Arraste o slider para alterar a opacidade.
- Cor e largura(px) da Borda: Clique na caixa de cor para escolher a cor da borda do Widget do Produto e arraste o slider para alterar a largura da borda.
- Cor e largura(px) do Separador: Clique na caixa de cor para escolher a cor do separador do Widget do Produto e arraste o slider para alterar a largura do separador.
- Comprimento do separador (px): Arraste o slider para alterar o comprimento do linha divisora entre o nome e preço do produto.
Texto
Selecione uma cor de texto e clique no ícone de texto
para escolher a fonte dos seguintes elementos:
para escolher a fonte dos seguintes elementos: - Nome do produto
- Preço do produto
- Discriminação de preço
- Texto falta de estoque
Botão
- Estilo do botão: Clique para selecionar um estilo de botão.
- Cor do preenchimento e opacidade: Clique na caixa de cor para selecionar a cor do background do botão. Arraste o slider para alterar a opacidade.
- Largura (px) e cor da borda: Clique na caixa de cor para selecionar a cor da borda do botão e arraste o slider para alterar a largura da borda.
- Raio do canto (px): Arraste o slide para alterar o raio do canto do botão (quanto maior o raio, mais redondo o botão).
- Tamanho do botão: Arraste o slider para alterar o tamanho do botão.
- Fonte e cor do texto: Clique na caixa de cor para selecionar a cor do texto e clique no ícone de texto para selecionar a fonte do botão.
Ao passar o mouse
Escolha como o widget de produto se modifica quando um cliente passa o mouse sobre ele:
- Nenhum: O widget não muda.
- Sobreposição: Uma sobreposição de cor aparece.
- Clique na caixa de cor para escolher uma cor de sobreposição. Arraste o slider para alterar a opacidade.
- (Opcional) Clique na caixa de cor para escolher a cor da borda e arraste o slider para alterar a largura da borda.
- (Opcional) Clique no toggle Zoom ao passar o mouse :
- Ativado: Quando um cliente passa o mouse sobre uma imagem, o zoom aumenta.
- Desativado: Quando um cliente passa o mouse sobre uma imagem, não tem zoom.
- Zoom:
- (Opcional) Clique na caixa de cor para escolher uma cor de sobreposição. Arraste o slider para alterar a opacidade.
- (Opcional) Clique na caixa de cor para escolher a cor da borda e arraste o slider para alterar a largura da borda.
- Alternância de zoom ao passar o mouse: certifique-se de que a está ativada para manter o zoom.
- Borda:
- (Opcional) Clique na caixa de cor para escolher uma cor de sobreposição. Arraste o slider para alterar a opacidade.
- Clique na caixa de cor para escolher a cor da borda e arraste o slider para alterar a largura da borda.
- (Opcional) Clique no toggle Zoom ao passar o mouse :
- Ativado: Quando um cliente passa o mouse sobre uma imagem, o zoom aumenta.
- Desativado: Quando um cliente passa o mouse sobre uma imagem, não tem zoom.
Fita
Configure o design das fitas. Para saber como adicionar fitas em produtos, clique aqui.
- Cor do preenchimento e opacidade: Clique na caixa de cor para escolher uma cor de fita. Arraste o slider para alterar a opacidade da fita.
- Cor do texto : Selecione uma cor de texto para a fita.
Esse artigo foi útil?
|