Wix Stores: adicionar e configurar um botão "Adicionar ao carrinho"
2 min de leitura
Você pode colocar um botão "Adicionar ao carrinho" em qualquer lugar do seu site. O botão é vinculado ao produto que você escolher. Ele pode ser útil quando você escrever sobre um produto em algum lugar do seu site e quiser facilitar para que um cliente adicione o produto ao carrinho.
Etapa 1 | Adicione o botão "Adicionar ao carrinho"
Acesse a página relevante e arraste o botão Adicionar o carrinho do painel Adicionar para o local desejado.
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/2d3f30b2-74a7-4aec-8ef7-67de4fff5318/2021/08/08/f8cf468a-619d-419b-8de1-e24fd37e28b2/4e24c31d-bf6c-4fac-b4f5-6b9bc563dbf1.gif)
Editor Wix
Editor do Wix Studio
- Vá para o seu editor.
- Clique em Elementos
no lado esquerdo do Editor.
- Clique em Loja.
- Arraste o Botão Adicionar ao carrinho na página.
Etapa 2 | Conecte o botão a um produto
Para que o botão funcione corretamente, você precisa selecionar qual produto é adicionado ao carrinho do cliente quando clicado.
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/2d3f30b2-74a7-4aec-8ef7-67de4fff5318/2021/08/08/7a4f1ef6-718f-45ad-8e71-226b89e7fc60/0d0dfcb7-c86c-4c90-bd7b-cca3beae6e81.png)
Para conectar o botão a um produto:
- Clique no botão Adicionar ao carrinho no seu editor.
- Clique em Configurações.
- (Opcional) Edite o texto do botão.
- Conecte o botão a um produto:
- Clique no produto padrão.
- Selecione um produto.
Etapa 3 | Faça o design do botão
Agora você pode personalizar o design do botão para que ele combine com a sua página.
Para personalizar o design do botão:
- Clique no botão Adicionar ao carrinho no seu editor.
- Clique em Configurações.
- Clique em Design.
- Faça qualquer uma das seguintes personalizações:
- Selecione o estilo do botão.
- Selecione a cor do botão e arraste o slider para ajustar a opacidade.
- Selecione a cor de borda e arraste o slider para ajustar a largura da borda.
- Arraste o slider para deixar os cantos mais redondos ou quadrados.
- Selecione a cor ou fonte do texto.
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/2d3f30b2-74a7-4aec-8ef7-67de4fff5318/2022/06/29/4851cb1c-dea4-40dc-aad7-8545b44364ff/d5a145bd-7ddd-4b06-b822-8e6c4d07347f.png)
Observações:
- Quando um produto está esgotado, o texto do botão muda para "Esgotado".
- Não é possível editar o design do botão "Esgotado".
Esse artigo foi útil?
|