Através do campo Edição de css avançada, você pode inserir códigos de CSS que permitem fazer pequenas alterações em seu Layout, como, por exemplo, alterar a cor de um botão ou texto.
Importante:
A Nuvemshop não gera nenhum tipo de código em HTML ou CSS. Se você não possui conhecimento em CSS ou HTML e precisar alterar algum elemento de sua loja, entre em contato com uns dos 🛠️ Especialistas Nuvemshop para ele poder te ajudar.
A seguir, te explicamos quais alterações são possíveis usando código CSS.
Trocar a cor de qualquer elemento do layout
Clique para mais informações
Você pode, por exemplo, alterar a cor da tag de ofertas ou o botão de compras, mudando de uma cor para outra.
No exemplo abaixo, alteramos a cor do botão de oferta para rosa:
Ocultar elementos
Clique para mais informações
É possível ocultar alguns elementos que não quiser que apareça em sua loja, como a barra de categorias principal, por exemplo.
No exemplo abaixo, ocultamos a barra de categorias principais que fica do lado esquerdo da loja:
Modificar tamanhos dos elementos
Clique para mais informações
Com as edições via CSS, você poderá aumentar o tamanho do logo dentro do seu layout, por exemplo. Mas é possível fazer isso com tamanho de banners, fonte e imagens.
Na imagem abaixo, alteramos o tamanho do logotipo de uma loja:
Mudar o alinhamento ou posição de algum elemento
Clique para mais informações
Você pode jogar um elemento para esquerda, para direito ou centralizá-lo; assim como jogá-lo mais para cima ou mais para baixo.
No exemplo abaixo, mostramos como fica após alteração do alinhamento do menu principal no cabeçalho:
Antes
Depois
Outras possíveis alterações por CSS
Clique para mais informações
- Alterar cor de um texto ou do preço de um produto;
- Esconder o cálculo de frete;
- Ocultar tag de "Frete Grátis" ou "Oferta";
- Mover um elemento para esquerda, direita ou centralizar;
- Retirar as opções de cores no filtro de busca de produtos;
- Retirar menu lateral:
- Diminuir espaço entre imagem do produto e informações, como nome e valor;
- Esconder as opções de Cores por Escrito das variações no filtro de buscas, na página de produtos;
- Alterar cor do cabeçalho do layout.
E para inserir o código de CSS em sua loja online, seguir os passos do tutorial:
📝 Como editar o código CSS da minha loja?
Success
Através do código CSS não é possível criar novos elementos, ou seja, você só pode alterar um elemento que já existe em sua loja.