Boa tarde a todos…
Tudo bem com vocês?
Alguem poderia nos ajudar?
@DMedina
Tem como deixar este botão de ver mais, no site um pouco abaixo das fotos e no mobile menor e mais centralizado?
Qualquer ajuda, ja agradeço demais, lembrando que nosso plano é gratuito.
Abraços
Olá boa tarde, você se refere para que fique desta forma?
Caso seja estarei deixando o código para que fique desta forma, coloque-o na sessão de CSS:
.listagem-item:hover .acoes-produto {
bottom: 20% !important;
}
.listagem-item .acoes-produto {
background-color: rgba(255,255,255,0.0) !important;
border-color: transparent !important;
}
a.tag-comprar.fundo-principal {
margin-top: 70px;
margin-right: 85px;
}
Desktop:
Mobile:
Estamos muito agradecidos pelo retorno @plugoo .
Vamos testar aqui e enviamos o feedback.
Aproveitando o post, se precisarmos diminuir um pouco este botão será nos mesmo códigos aqui postado?
Sim, para diminuir o tamanho do botão as alterações são realizadas na parte de " a.botao.botao-comprar.principal "
@plugoo olha eu aqui de novo
diminui os numeros conforme print
e ficou do mesmo tamanho e no mobile esta ficando a direita, oque fazer, errei em alguma coisa ou alterei algo que nao devia?
Perdão, o código que enviei anteriormente era somente para que ele fique alinhado nos dispositivos moveis. Para que você consiga redimensionar a altura e a largura troque este “a.tag-comprar.fundo-principal” por este código aqui:
a.tag-comprar.fundo-principal {
margin-top: 70px;
margin-right: 85px;
height: 30px; /* aqui você regula a altura /
width: 87px; / aqui você regula a largura */
display: flex;
align-items: center;
}
Maravilha!!
Agora deu certo, @plugoo
Agradecemos demais a força e dedicação.
Deus lhes abençoe!!!
@Mogano_Studio desculpa a demora! Que bom que conseguiu resolver fácil.
Acho que cheguei atrasado, mas fiz um vídeo mostrando como customizar o botão. Espero que ajude outros também.
Customizando botão “comprar” na LI
Para baixar o código pronto é só clicar aqui.
Douglas Medina
Especialista em e-commerce
Conteúdo douglasmedina.com + Youtube
Mentoria Aulas particulares
Curso Online Personalização Avançada
Whatsapp Construção de lojas
Não se preocupe, Mestre
Assistirei assim mesmo e deixarei aquela força para você lá.
E também agradeço o seu esforço em nos ajudar, pode ter certeza, nas nossas dificuldades em encontrar soluções, entrarei em contato contigo também.
Deus lhe abençoe!!
E se eu quiser retirar o botão “ver mais” na versão mobile, como faço? Na versão desktop eu consegui com esse código:
.listagem-item:hover .acoes-produto {
display: none;
}
Consegui, para tirar o botão “Ver mais” na versão mobile, o código é esse:
a.tag-comprar.fundo-principal {
display: none;