
Como configurar o cabeçalho da sua loja
Hoje vamos configurar o cabeçalho ou logotipo e o título do seu aplicativo
Esta é a parte superior do seu aplicativo, que está sempre visível e acessível em todas as seções
O cabeçalho tem 4 objetivos
- Exibir a identidade do seu aplicativo
- Dar um título a uma seção
- Atalhos de exibição
- Navegar no aplicativo
Então, vamos ao menu Conteúdo e Design > Design > Design geral
Clique no Logo e Título
Aqui posso adicionar o título em formato de texto ou adicionar um logotipo
Estou realmente procurando por algo com uma marca, então vou adicionar um logotipo
Eu já tinha um pronto :)
Voila!
Agora estou selecionando o alinhamento do logo: à esquerda ou centralizado
Fácil não?
Mas você quer fazer mais certo? Eu sabia
Você pode personalizar seu cabeçalho ainda mais ativando o menu avançado aqui
Agora eu tenho mais opções
Posso mudar a cor da fonte, o separador, adicionar imagens de fundo
Também posso adicionar links ao meu cabeçalho
Vou adicionar um link para o carrinho. Clique em adicione uma ação, selecione o ícone e defina a cor do atalho. Perfeito
Para o PWA, você pode escolher exibir o título do atalho em desktop e tablets
Em seguida, a cor da marca do carrinho e está pronto
Na última etapa, os outros elementos do cabeçalho:
Isto é a seta de retrocesso que será exibida quando seus usuários navegarem em seu catálogo. Dependendo do seu modelo de navegação, você pode ter outras opções. Por exemplo, com o Swipe, você pode escolher o ícone para abrir o menu
Estou adicionando o vídeo dos modelos de navegação na barra de informações
Vamos pré- visualizar
Terminado!
Deixa eu te mostrar o resultado final
Agora você sabe como personalizar o cabeçalho de sua loja
Te vejo em breve para outro tutorial
Vídeos semelhantes








