Barra lateral
O que você vai aprender
- Pra que serve esta section
- Por que ela substitui o cabeçalho tradicional neste tema
- Como ela se comporta no celular
Pra que serve
✨ Diferente da maioria dos temas Shopify (inclusive do Prestige), este tema não tem uma section de cabeçalho tradicional no topo. A navegação principal fica numa barra lateral fixa, um traço de identidade visual do Ultimate.
No desktop, a Barra lateral fica sempre visível, presa na lateral da tela, com o logo, um menu de links, redes sociais e um segundo menu na parte de baixo. No celular, ela vira um menu escondido (acessado por um botão "hambúrguer" numa barra fina no topo), pra não ocupar espaço da tela permanentemente.
Como configurar
| Configuração | Pra que serve |
|---|---|
| Esquema de cores | Cor de fundo/texto da barra lateral. |
| Largura | Largura da barra lateral no desktop, em px. O conteúdo da página se ajusta automaticamente pra não ficar embaixo dela. |
| Raio do canto | Arredondamento dos cantos da barra lateral. |
| Bordas | Nenhuma ou Sólida. |
| Sombra | Ativa uma sombra sutil ao redor da barra lateral. |
| Desfoque de fundo | Deixa o fundo da barra semitransparente com efeito de desfoque (o conteúdo da página aparece borrado atrás dela). |
| Alinhamento do conteúdo | Centralizado ou à Esquerda. |
| Menu 1 | Menu de navegação mostrado na parte de cima da barra. |
| Redes sociais | Mesmos campos do block Links de redes sociais, ícones mostrados na parte de baixo da barra. |
| Menu 2 | Um segundo menu, mostrado abaixo das redes sociais. |
Boas práticas
- Ajuste a Largura com cuidado: ela reserva esse espaço fixo em todo o site no desktop, uma largura grande demais reduz bastante o espaço útil pro conteúdo das páginas.
- Use os dois menus (Menu 1 e Menu 2) pra separar navegação principal (categorias de produto) de links secundários (institucional, ajuda), em vez de colocar tudo misturado num só.