Eu quer usar um tema que no mobile apareça dois produtos ao lado e não um de cada vez, é possível? Preciso pagar alguém por fora ou existe opção mesmo que paga, no site?
Olá.
É possível mudar a quantidade de produtos por linha em qualquer tema (maioria dos casos, pode haver exceções).
Manda o link do seu site para orientar melhor.
A versão mobile possui um layout padrão, as alterações de CSS realizadas na loja para desktop, não terão efeitos na versão mobile.
No caso, para personalizar sua loja no Mobile é necessário criar um código CSS para essa página para que seja aplicada a personalização do layout no mobile.
Caso não tenha conhecimento técnico para isso, sugerimos contratar uma agência digital para promover estas mudanças.
Utilize o código CSS abaixo:
@media only screen and (max-width: 767px) {
.listagem .listagem-linha li {
width: 50%;
float: left;
padding: 0 !important;
margin: 0 !important;
}
}
5 curtidas
Obrigada, deu certo!!
Eu só colei em editar CSS. Deu certo!
Aqui não deu certo… ele ajustou o tamanho pra 50% , mas não colocou o segundo item ao lado, continuou abaixo.
Será que tem a ver com o layout? Eu uso padrão deles, disposição de itens da loja o 03.
Pode ser, pq eu uso um tema diferente.
Boa tarde pessoal, sou novo por aqui, estou fazendo um site, ainda não coloquei domínio próprio, estou só personalizando, já peguei muitas dicas nesses tópicos, muito obrigado, mas na versão mobile encontrei um problema; na barra de home ficou aparecendo uma barra preta, poderiam me ajudar? Tenho 2 dúvidas:
- Como remover essa barra preta.
- Como tirar esses pontinhos do MENU e colocar a palavra MENU mesmo ao lado da pesquisa.
Coloca isso no seu CSS que vai resolver.
.fundo-secundario {
background-color: #ff6eb4;
}
1 curtida
pode me ajudar?
www.loja-kauan.com.br
1 curtida
Conseguiu? precisa de ajuda?
Oii Diego boa noite! Usei o código deu certo, mas os produtos não ficaram alinhados, sabe como ajustar isso, por favor?
Sabe como diminuir o texto de “ver mais” e a lupa também?
Tudo no mobile…
Obrigada!!
/ *Dois produtos por grade no mobile */
@media only screen and (max-width: 767px) {
.listagem .listagem-linha li {
width: 50%;
float: left;
padding: 0 !important;
margin: 0 !important;
}
1 curtida
/* 2 produtos por grade no mobile*/
@media (max-width: 768px){#listagemProdutos > ul{display:flex;
flex-wrap:wrap;
justify-content:center;
align-items:flex-start}
#listagemProdutos > ul li.listagem-linha ul{display:flex;
flex-wrap:wrap;
align-items:flex-start;
justify-content:center}
#listagemProdutos > ul li.listagem-linha ul li{width:50%;
margin:0 0 15px}.listagem.com-caixa .listagem-item{border:0;
min-height:368px}.listagem.com-caixa .listagem-item .imagem-produto{border:0;
padding:0}.listagem .listagem-item .info-produto{border:none!important;
padding:5px 0}.listagem .listagem-item .info-produto a.nome-produto{min-height:110px;
display:flex;
align-items:center}.busca .botao-busca{padding:5px 14px!important}.listagem .listagem-item .acoes-produto-responsiva,
#btn-top{display:none!important}.preco-produto s.preco-venda{display:block;
font-size:14px}.preco-produto .desconto-a-vista, .preco-produto strong.titulo{font-size: 11px !important}.preco-venda {display:block;
font-size:12px !important;}}
2 curtidas
seria esse CSS para carregar depois
caso tenha dificuldade em colocar na plataforma, pode me mandar msg no privado.
@media only screen and (min-width: 360px){
.showcase__slide {
flex: 0 1 48%;
max-width: 48%;
margin-bottom: 5%;
}
}
Oi onde exatamente coloco esse código? coloquei no CSS, html, java e não foi me ajuda, meus produtos estão só um por tela e ainda o texto longe da imagem.