O Menu Colapsável está estável a partir da versão 3.10.122.

Índice

Introdução
Desenvolvimento inicial do Menu Colapsável
Customização do Menu Colapsável
Mega Menu

Introdução

O Menu Colapsável é totalmente responsivo.

Quando o tamanho de ecrã é reduzido não passa logo para hamburger. Em vez disso, quando o número de itens não couber no ecrã (devido ao pequeno tamanho do ecrã ou ao elevado número de itens), é criado um novo “item” com o nome “More”, no qual são inseridos os itens do menu para os quais não há espaço. O próximo item a ser removido é sempre o último que está visível na lista.

Quando o tamanho do ecrã chega aos 576px o menu colapsa para menu hamburger. Há também dois outros botões disponíveis para os clientes utilizarem, "contactos" e "perfil".

O conteúdo do Menu Hamburger são apenas os Items da árvore de páginas.

Esta feature ainda está em desenvolvimento.

Em mobile o Menu Profile vai conter toda a logica de login e de conta do utilizador.

Esta feature ainda está em desenvolvimento.

O conteúdo da janela de contactos é customizado no tripoint nas configurações do site. De momento suportamos telefone/telemóvel, email, Skype e Whatsapp:

Isto traduzir-se-á num menu que ao clicar na respectiva opção irá reencaminhar para a app/site do Skype, Whatsapp, Email ou abrir o popup para ligar ao correspondente valor;

Para uter acesso ao Menu Colapsável deve ser feito um pedido para a equipa de Website fazer a alteração do Layout.

Algumas informações que devem vir no pedido:

Posição do logo, à esquerda do menu, à direita do menu, etc.
Caso seja necessário uma barra criada acima do menu onde colocar conteúdo personalizado e acordar previamente o nome que esse conteúdo vai ter no tripoint;
Quais os ícones mobile (hamburger, perfil e contactos) a por no menu;
Em mobile a posição do logo (esquerda, direita, centro);
Acordar tambem a posição do Login etc. especialmente haja a barra personalizada mencionada acima.

O menu em si é customizável através do CSS no tripoint. Contudo há algumas cores e valores que podem ser tratadas pela equipa de Website neste desenvolvimento inicial, nomeadamente a cor do fundo, cor do texto, cor dos ícones e altura / padding do menu. Caso queira estes valores definidos, deve indicá-lo no pedido.

Depois do desenvolvimento inicial, qualquer nova página do site que seja criada no Tripoint vai ser associada ao menu como anteriormente.

O Mega Menu está estável a partir da versão 3.10.122. O Mega Menu só por si não é um tipo de Menu, apenas uma adenda ao Menu Colapsável.

Há dois tipos de Mega Menu que são configuráveis no tripoint de momento, o tipo tree e o tipo showcase.

Os requisitos para uma entrada de menu poder ter um MegaMenu são:

Não ter pai (isto é, ser primeiro nível do menu)
Ter a checkbox “Colocar esta página no menu” checkada

Para ativar um Mega Menu do tipo tree, é só preciso checkar a checkbox de “Ativar” e escolher na dropdown “Tipo de Menu” o tipo "tree".

Em desktop o Mega Menu tipo tree tem 6 colunas, em tablet tem 4 e em mobile tem 1 coluna.

Desktop

Tablet

Mobile

Para ativar um Mega Menu do tipo showcase, é só preciso checkar a checkbox de “Ativar” e escolher na dropdown “Tipo de Menu” o tipo "showcase". Além disso deve ser escolhida, na dropdown “Tipo de Showcase” o nome da Montra a associar ao MegaMenu.

Esta Montra é criada e editada na window Montras como sempre foi e, por enquanto, deve ser do tipo ResponsiveGrid caso contrário não será responsiva.