Pular para o conteúdo principal
ClubHelix
Navegar pelo guia

Gestão do site

Navegação

Monte a navegação do site: variações de cabeçalho e rodapé com opções de layout (logo centralizado, menu dividido, rodapé de uma linha e mais) e fundos, megamenus, barras superiores e faixas de patrocinadores, e associe cada uma a páginas. Clique em qualquer parte da tela para editar no painel de configurações, em visualização de celular ou computador, e restaure qualquer versão anterior pelo histórico.

Traduzido automaticamente. Esta página de ajuda foi traduzida automaticamente do inglês, então algumas palavras podem não ser exatas.


A sua navegação é o menu que corre pelo topo do seu site público (o cabeçalho) e a faixa de links bem no fim da página (o rodapé). Você pode montar várias variantes com nome de cada um — todo site tem um cabeçalho e um rodapé Padrão obrigatórios, e você pode adicionar mais variantes e atribuí-las a páginas específicas (útil para um programa das categorias de base, uma central de eventos ou qualquer seção que precise de um menu próprio). Você a encontra em Gestão do site, na barra lateral do painel, na página Navegação.

Quem pode usar

Você precisa da função de administrador para criar, editar ou salvar menus. Os moderadores podem abrir as páginas e dar uma olhada, mas só os administradores podem salvar — o salvamento de um moderador é recusado. Tudo o que você salva aparece na hora no seu site público.

O que há na página

A página Navegação é uma galeria das suas variantes de menu, dividida em Variantes de cabeçalho e Variantes de rodapé:

  • Cada variante é um cartão que mostra o nome, um resumo do conteúdo e quantas páginas a usam. A Padrão de cada tipo tem um selo e não pode ser excluída.
  • + Novo cabeçalho / + Novo rodapé cria uma variante (até 8 de cada tipo). Duplicar começa uma nova variante a partir de uma existente — geralmente é o caminho mais rápido.
  • Renomear, Tornar padrão e Excluir ficam em cada cartão. Excluir uma variante devolve automaticamente as páginas dela à Padrão.

Clicar em Editar abre o editor visual desse menu, com três abas:

  • Editor visual (padrão) — o menu desenhado numa página de exemplo, com clique para editar, como no editor de páginas. Clique em qualquer parte — um item do menu, a barra superior, o logo, o fundo da barra, uma coluna do rodapé, a faixa de patrocinadores — e só as configurações daquele elemento se abrem numa gaveta de configurações à direita, a mesma gaveta que o editor de páginas usa para as seções. O editor visual continua funcionando por trás dela, então clicar em outro elemento leva a gaveta para ele; Esc ou o ✕ a fecha. Arraste um item do menu (ou uma coluna do rodapé) sobre outro para reordenar. Os botões Adicionar a este cabeçalho / rodapé ficam acima do editor visual e no pé da gaveta, então estão sempre à mão — eles acrescentam um novo item e já o selecionam.
  • Numa tela estreita (um celular ou uma janela dividida), a gaveta ocupa a tela inteira e os campos ficam empilhados numa só coluna em vez de encolherem, então nada fica pequeno demais para ler ou tocar. Feche-a para voltar ao editor visual.
  • Todas as configurações — os painéis completos, em formato longo, com uma prévia em tempo real fixada, úteis para editar muita coisa de uma vez.
  • JSON (avançado) — para copiar um menu entre variantes ou organizações.

O botão flutuante de salvar de sempre fica no canto superior direito.

Passo a passo

  1. Abra uma variante de cabeçalho e encontre a seção Itens.
  2. Clique em + Link, + CTA (um botão de chamada para ação), + Menu suspenso ou + Megamenu.
  3. Defina o Texto (o que os visitantes leem), escolha um Estilo e defina a Visibilidade.
  4. Para um link ou CTA, escolha Página interna e selecione um destino, ou Link externo e cole um endereço https:// completo.
  5. Use as setas ↑ / ↓ para reordenar ou ✕ para remover. Você pode ter até 12 itens de primeiro nível; os menus suspensos comportam até 8 links; os megamenus comportam até 4 colunas de 8 links cada.

Monte um megamenu

Um megamenu abre um painel da largura da tela com colunas de links agrupados — o padrão que os sites de grandes federações usam para seções com muitas páginas.

  1. Adicione um item + Megamenu (ou mude o Tipo de um menu suspenso existente para Megamenu — os links dele preenchem a primeira coluna).
  2. Adicione até 4 colunas, cada uma com um título opcional e até 8 links.
  3. Nos celulares, o painel se recolhe num único grupo expansível dentro do menu de hambúrguer.

Adicione uma barra superior de utilidades

  1. Numa variante de cabeçalho, ative a seção Barra superior de utilidades.
  2. Escolha um fundo e depois adicione links pequenos (até 8) e ícones de redes sociais (até 8).
  3. A faixa aparece acima da sua barra de navegação principal — ideal para links entre sites (redes no estilo "My Football") e ícones de redes sociais.

Escolha o layout e o fundo do cabeçalho

  1. Abra uma variante de cabeçalho e clique no fundo da barra no editor visual (ou use Todas as configurações).
  2. Escolha um Layout:
    • Logo à esquerda, links à direita: o seu logo à esquerda, o menu e o botão de entrar à direita. Todo site começa com este.
    • Logo centralizado, links abaixo: o seu logo centralizado numa linha própria, com o menu centralizado logo abaixo.
    • Links centralizados, botões à direita: o logo à esquerda, o menu centralizado e os seus botões CTA e o de entrar à direita.
    • Menu dividido, logo centralizado: o menu dividido dos dois lados de um logo centralizado. A primeira metade dos seus itens vai para a esquerda.
  3. Escolha um Fundo: Cor principal (a cor principal do seu tema com texto branco, ou texto escuro se essa cor for muito clara), Claro (o fundo da sua página com a cor de texto do seu tema), Escuro (quase preto, com texto branco) ou Claro com uma linha colorida (uma barra clara com uma linha na sua cor principal embaixo).
  4. O editor visual se atualiza conforme você escolhe. Salve para publicar.

Nos celulares, todos os layouts mostram o seu logo e o botão de menu, então o menu no celular funciona do mesmo jeito, seja qual for a sua escolha.

  1. Com Página interna selecionada, use a caixa de pesquisa para filtrar as rotas integradas e todas as páginas da sua organização (inclusive os rascunhos).
  2. Se você digitar um caminho que ainda não existe, verá um aviso em âmbar. Para um caminho simples, você pode clicar em Criar página em … para criar um rascunho e ir direto para o editor de páginas.
  3. Um link para uma página que não existe mostra um selo Página ausente e fica escondido no site público até essa página ser publicada.
  1. Abra uma variante de rodapé.
  2. Defina o Layout, o Fundo, o Tom do texto, um Texto de introdução opcional e a sua Linha de direitos autorais. Os layouts são:
    • Colunas: colunas de links com título, lado a lado, com os patrocinadores acima delas. Todo site começa com este.
    • Centralizado, compacto: tudo centralizado, com os seus links numa única linha que quebra conforme o espaço.
    • Colunas com faixa de patrocinadores: colunas de links com título e, depois, os seus patrocinadores numa faixa própria.
    • Linha mínima: direitos autorais, links e ícones de redes sociais numa única linha.
  3. Adicione Colunas (até 6, cada uma com até 10 linhas de links), Redes sociais (até 10, com um seletor de ícones das marcas), um botão CTA do rodapé opcional e uma faixa de logos de Patrocinadores e parceiros (até 12 logos, cada um com um link opcional para o site do patrocinador).
  1. Crie a variante aqui primeiro (geralmente duplicando a Padrão).
  2. Abra a página no editor de Páginas. Quando você tem mais de uma variante de um tipo, os seletores Cabeçalho e Rodapé aparecem na barra de ferramentas do editor, ao lado do controle da barra lateral.
  3. Escolha a variante — ela é salva na hora e a prévia do editor se atualiza. Escolha a opção "(padrão)" para voltar.

Salve as suas alterações

  1. Assim que você edita qualquer coisa, o botão de salvar mostra Alterações não salvas.
  2. Clique em Salvar cabeçalho (ou Salvar rodapé). O botão mostra Salvando… e depois Salvo.
  3. Descartar volta à última versão salva; Exportar JSON baixa uma cópia do menu.

Volte a uma versão anterior

Cada salvamento grava uma versão, listada da mais recente para a mais antiga no cartão Histórico de versões, no pé do editor do menu.

  1. Abra o menu pela galeria Navegação e role abaixo do editor até Histórico de versões. Cada linha mostra quando foi salva, quem salvou, um resumo curto (quantidade de itens, megamenu, logos de patrocinadores e assim por diante) e quantas configurações mudaram desde a versão anterior; a primeira linha tem o selo No ar agora.
  2. Clique em Restaurar na versão que você quer trazer de volta e confirme. O editor recarrega com essa versão, e ela entra no ar no seu site público na hora. Se a versão não se encaixar mais nas regras atuais de menu, você verá uma mensagem e nada muda.
  3. A restauração também é gravada como uma nova versão, então você sempre pode avançar de novo — nada se perde. Use os links ← Mais recentes / Mais antigas → para percorrer históricos mais longos.

Referência de campos

CampoOndeO que faz
LayoutCabeçalho / RodapéA disposição geral: quatro layouts de cabeçalho e quatro de rodapé (veja o Passo a passo).
Fundo / Tom do textoCabeçalho / RodapéAs cores da barra. O cabeçalho oferece Cor principal, Claro, Escuro e Claro com uma linha colorida.
Barra superior de utilidadesCabeçalhoFaixa fina opcional acima da barra de navegação: links pequenos, ícones de redes sociais e um fundo próprio.
Texto para quem entrou / Texto para quem não entrouCabeçalhoTexto e estilo dos botões de conta e de entrar.
Fixar o cabeçalho no topo ao rolarCabeçalhoMantém a barra de navegação visível enquanto os visitantes rolam a página.
Mostrar o nome do site ao lado do logoCabeçalhoDesligue se o seu logo já inclui o nome do clube. É uma configuração de identidade visual do site inteiro, compartilhada por todas as variantes.
TipoItemLink, Botão CTA, Menu suspenso ou Megamenu.
EstiloItemA aparência do botão (Simples, Barra de navegação, Marca ou Status).
VisibilidadeItem / Link do rodapéSempre visível, Só visitantes que não entraram, Somente sócios, Sócios e acima, Moderadores e administradores ou Somente administradores.
TextoItem / Coluna / Rede socialO texto exibido (ícones FontAwesome são permitidos).
Página interna / Link externoCampo de URLEscolha uma página do seu site ou um endereço https:// externo.
Patrocinadores e parceirosRodapéFaixa de logos acima das colunas: URL da imagem, nome do patrocinador (texto alternativo) e um link opcional por logo.
Texto de introdução / Linha de direitos autoraisRodapéUma frase opcional e o aviso de direitos autorais acima do rodapé ou dentro dele.

Dicas e perguntas frequentes

  • Qual menu aparece em qual página? Todas as páginas usam o cabeçalho e o rodapé Padrão, a menos que fixem uma variante no editor de páginas. As rotas integradas (notícias, eventos, loja, conta) sempre usam a Padrão.
  • Ícones nos textos: abra o assistente "Use ícones FontAwesome em qualquer texto" para colar um trecho de ícone gratuito em qualquer texto.
  • Os links de inscrição e de entrar se escondem sozinhos quando não se aplicam mais. Um link para a página de inscrição fica escondido automaticamente para os visitantes que já fazem parte da sua organização (inclusive quem tem um pedido pendente), e os links Entrar / Cadastrar-se ficam escondidos para os visitantes que entraram — seja qual for a configuração de Visibilidade do item. Você pode deixar esses links em "Sempre visível" sem problema.
  • Os títulos das colunas do meu rodapé sumiram. Os rodapés Centralizado, compacto e Linha mínima mostram os seus links numa única linha, então os títulos das colunas não aparecem. Volte para Colunas para trazê-los de volta; nada se perde.
  • O cabeçalho pode ficar por cima da minha imagem de destaque? Ainda não. Um texto sobre uma foto não tem como ficar legível em todas as páginas, então cada fundo é sólido.
  • Os links externos abrem numa nova aba e ficam protegidos automaticamente.
  • Errou? Cada salvamento grava uma versão — use o Histórico de versões, abaixo do editor do menu, para restaurar qualquer versão anterior, e assim você pode fazer mudanças com confiança.
  • A marca ClubHelix fica abaixo do seu rodapé editável e depende do seu plano. No plano Free, a faixa "Powered by ClubHelix" aparece acima do cabeçalho do seu site e no rodapé; no Standard, aparece só no rodapé; no Pro e no Enterprise, o seu site não mostra nenhuma marca ClubHelix visível. Não há configuração para isso — muda automaticamente com o seu plano.
  • Veja também: crie as páginas para as quais o seu menu aponta em Páginas, ajuste cores e botões em Tema e defina o seu logo em Identidade visual. Veja a Visão geral do painel para ter o panorama completo.