Pular para o conteúdo
GloboGlobo Docs
Instalar app
Português (Brasil)

Ajuste as cores do menu

Defina as cores da barra de menu, dos submenus, das abas, dos rótulos de produto e do botão de adicionar ao carrinho.

Guia prático Todos os planos 3 min de leitura

As cores na aba Cores valem para todos os itens do menu, então você combina o menu com a sua marca em um só lugar.

Altere uma cor

  1. Abra a aba Cores

    No editor de menus, clique no ícone de balde de tinta na barra lateral esquerda (1).

    Abra a aba Cores (1) e clique em um campo de cor (2).

  2. Escolha uma cor

    Clique no campo ao lado de uma cor (2). Escolha uma cor ou digite um código hexadecimal, como #FFFFFF.

  3. Confira a pré-visualização

    Passe o mouse sobre os itens na pré-visualização para conferir as cores ao passar o mouse.

  4. Salve e publique

    Clique em Salvar e depois em Publicar.

Configurações de cor

Cor de fundo
O fundo da barra de menu.
Hover background color
O fundo de um item de nível superior ao passar o mouse ou enquanto o submenu dele está aberto.
Separator color
As linhas divisórias entre os itens, exibidas quando Exibir divisor no desktop ou Exibir divisor no celular está ativado nas Configurações do menu.
Cor do texto
Texto e ícones dos itens de nível superior.
Hover text color
Texto e ícones dos itens de nível superior ao passar o mouse.

Menus suspensos, mega menus e seu conteúdo.

Cor de fundo
O fundo do submenu.
Border color
A borda do submenu, exibida quando Exibir borda está ativado nas Configurações do menu.
Heading color
Títulos dentro dos submenus, como os títulos de listas de links.
Cor do texto
Links e texto dentro dos submenus.
Hover text color
Links do submenu ao passar o mouse.
Description color
Texto de descrição abaixo dos itens.
Hover description color
Texto de descrição ao passar o mouse.
Heading color
Nomes das abas.
Active heading color
O nome da aba selecionada.
Active background color
O fundo da aba selecionada.

Rótulo

Rótulos nos produtos exibidos no menu.

Sale text color · Sale background color
O rótulo de oferta nos produtos com desconto.
Sold out text color · Sold out background color
O rótulo de produto esgotado.

Botão Adicionar ao carrinho

Exibido quando Exibir botão Adicionar ao carrinho está ativado nas Configurações do menu > Avançado.

Cor do texto · Hover text color
Texto do botão, normalmente e ao passar o mouse.
Cor de fundo · Hover background color
Fundo do botão, normalmente e ao passar o mouse.

Solução de problemas

Os itens ficam difíceis de ler ou somem ao passar o mouse

Confira se a Cor do texto contrasta com a Cor de fundo e se a Hover text color contrasta com a Hover background color. Texto branco ao passar o mouse sobre um fundo branco ao passar o mouse faz os itens sumirem ao passar o mouse.

Quero um item em uma cor diferente

Use as configurações de Cor do próprio item (plano Pro Navigation), por exemplo para um item “Promoção” em vermelho. Veja Edite um item do menu.

Esta página foi útil?

Relatar um problema