Submenus

Conceitos básicos de menu

No Joomla, três elementos contribuem para a exibição de um menu ao utilizador:

• Um Menu é um contentor para itens de menu.
• Um Item de menu é uma hiperligação para uma página do sítio ou uma página externa.
• Um Módulo de menu disponibiliza um método para atribuir o menu a uma posição na página e para controlar aspetos da aparência ou comportamento do menu ou da página.

Menus simples consistem em listas de hiperligações. Por vezes, membros de uma lista têm relações hospedeiro-filho exibidas como filhos indentados ou listas pendentes. As relações hospedeiro-filho podem ser aninhadas a qualquer nível. No entanto, o aninhamento para além de dois níveis pode tornar as listas pouco atrativas e difíceis de utilizar.

Há ocasiões em que pode querer mostrar os filhos de um menu hospedeiro como um submenu separado. Um caso de uso comum é mostrar um submenu à esquerda de uma página, o conteúdo da página ao centro e um índice da página à direita. Este tutorial explica como fazê-lo.

Dados de exemplo

Suponha que tem uma série de artigos sobre animais. Pode ser sobre animais de estimação, uma ficha informativa de veterinário ou um jardim zoológico. Segue-se uma estrutura de exemplo curta para fins de demonstração:

Animais
    Gatos
        Birmaneses
        Azul-russo
    Cães
        Collies
        Pomerânios

As listas podem ser bastante longas, pelo que pode querer exibir apenas uma lista de raças de gatos nas páginas sobre gatos e apenas uma lista de raças de cães nas páginas sobre cães. A captura de ecrã seguinte mostra o esquema alvo que o utilizador gostaria de alcançar:

Neste exemplo, quando o utilizador seleciona o item de menu Animais, a página Animais é carregada e o módulo de submenu Gatos desaparece (o módulo Cães também não aparece). Ao selecionar o item de menu Gatos, o módulo de submenu Gatos aparece ao lado da página Gatos. Ao selecionar o item de menu Birmaneses, a página Birmaneses aparece. Ao selecionar o item de menu Cães, o módulo de submenu Gatos é substituído por um módulo de submenu Cães ao lado da página Cães.

Para experimentar este tutorial por si próprio, precisará de criar alguns artigos, um menu com itens de menu e três módulos de menu.

Criar artigos

Se for super eficiente, pode criar um artigo e depois criar um item de menu a partir do artigo. Para isso, teria primeiro de criar um novo menu e seguir alguns passos extra durante a criação do artigo. Por isso, é melhor manter as coisas simples no início e começar pelos seus novos artigos:

• Selecione Conteúdo → Artigos → + no menu do Administrador. Ou selecione o botão Novo na lista de Artigos.
• Preencha o formulário como faria para qualquer artigo.
• Selecione o botão Guardar e Novo em vez de Guardar e Fechar para avançar para o próximo artigo novo.

Os dados de exemplo mostrados acima requerem sete artigos.

Criar um novo menu

No menu do Administrador:

• Selecione Menus → Gerir.
• Na página da lista de Menus, selecione o botão Novo para criar um novo menu.
• No formulário Menus — Adicionar, dê ao menu um título: Animais e um nome único: animals.
• Em alguns casos, pode precisar de recordar a si próprio para que serve este menu. Por isso, preencha o campo de descrição.
• Guardar ou Guardar e Fechar.

Criar itens de menu

Existem sete itens de menu a criar.

Item de menu Animals

Os novos itens de menu vão estar localizados no menu Animals.

• Selecione Menus → Animals → + no menu do Administrador.
• Preencha o formulário Menu — Editar item.
  • Título: Animals
  • Tipo de item de menu: Artigo único
  • Escolher artigo: Animals - este é o artigo hospedeiro usado para introduzir a série sobre animais
  • Menu: Animals
  • Hospedeiro: — Sem hospedeiro — esta é a raiz do menu
• Selecione Guardar e novo na lista pendente de Guardar e fechar.

Item de menu Cats

Isto é basicamente uma repetição do item de menu Animals. Exceto:

• O título deve ser Cats.
• O artigo selecionado no campo Escolher artigo deve ser Cats.
• O item hospedeiro deve ser definido como Animals.

Item de menu Burmese

Repita novamente. Exceto:

• O título deve ser Burmese.
• O artigo selecionado no campo Escolher artigo deve ser Burmese.
• O item hospedeiro deve ser definido como Cats.

Mais itens de menu

Continue até ter sete itens de menu, um para cada artigo.

Lista de itens de menu

Depois de criar todos os itens de menu, verifique se têm as relações hospedeiro-dependente corretas e se estão na ordem correta. Pode ordenar pela coluna Ordenação (a segunda coluna) e usar as pegas (reticências verticais) para arrastar os itens para a ordem correta. Se algum item tiver um hospedeiro errado, basta selecionar o título do item e alterar o hospedeiro no formulário Menus — Editar item.

Módulos de menu

Nesta etapa tem um menu, mas este ainda não tem um módulo para ser atribuído a uma função na página. Poderia usar o menu inteiro como um menu padrão ou um menu pendente. No entanto, o objetivo deste tutorial é demonstrar como criar submenus. Para isso precisa de três módulos diferentes:

• Um módulo Animals para um submenu com itens de menu sobre Animals, Cats e Dogs.
• Um módulo Cats para um submenu com itens de menu sobre raças de gatos.
• Um módulo Dogs para um submenu com itens de menu sobre raças de cães.

Módulo de submenu Animals

No menu do Administrador:

• Selecione Conteúdo → Módulos do sítio → + ou selecione Novo na lista de Módulos (Sítio).
• Selecione o módulo Menu.
• No formulário Módulos — Editar menu insira os seguintes dados:
  • Título: Animals
  • Escolher menu: Animals
  • Item base: Animals (este é o item de menu hospedeiro)
  • Nível inicial: 1
  • Nível final: 2 (isto limita os itens aos itens de menu sobre Cats e Dogs)
  • Função: sidebar-left (ou onde lhe for mais conveniente)

Atribuição de menu Animals

Os submenus normalmente só são mostrados nas páginas onde são relevantes, neste caso apenas em três páginas. No separador Atribuição de módulo:

• Defina o campo Atribuição de módulo como Apenas nas páginas selecionadas. Isto revela uma lista hierárquica de todos os itens em todos os menus.
• Assinale as caixas junto a Animals, Cats e Dogs.
• Assinale as caixas junto às raças de gatos e cães. Caso contrário, o submenu Animals irá desaparecer nas páginas sobre raças.
• Certifique-se de que nenhuma outra caixa está assinalada.
• Guardar e fechar

Módulo de submenu Cats

Este é muito semelhante:

• Selecione Conteúdo → Módulos do sítio → + ou selecione Novo na lista de Módulos (Sítio).
• Selecione o módulo Menu.
• No formulário de edição Módulos — Menu, introduza os seguintes dados:
  • Título: Cats
  • Selecionar menu: Animals
  • Item base: Cats (este é o item de menu hospedeiro)
  • Nível inicial: 3
  • Nível final: Todos
  • Função: sidebar-left (ou outro que lhe convenha)

Atribuição de menu Cats

Na Atribuição de menu

• Defina o campo Atribuição de módulo como Apenas nas páginas selecionadas. Isso revela uma lista hierárquica de todos os itens em todos os menus.
• Marque as caixas junto a Cats, Burmese e Russian Blue. Certifique-se de que nenhuma outra caixa está marcada.
• Guardar e fechar

Módulo de submenu Dogs

Mais do mesmo ...

Nome alternativo de item de menu

Até aqui, tudo bem! Mas não há nenhuma hiperligação para a página Animals a partir do Menu principal, nem de qualquer outro menu do sítio. A forma mais simples de resolver isto é através de um Nome alternativo de item de menu. Para este exemplo, é criada uma entrada no menu no topo da página, intitulado Main Menu Blog. A partir do menu do Administrador:

• Selecione Menus → Main Menu Blog (ou o menu do sítio que preferir).
• Selecione o botão Novo na Barra de ferramentas.
• Preencha o formulário Menus — Editar item
  • Título: Animals
  • Nome alternativo: creatures - já existe um item de menu chamado Animals, por isso deve usar um nome alternativo diferente.
  • Tipo de item de menu: Nome alternativo de item de menu
  • Item de menu: Animals - selecionado a partir da lista de itens de menu existentes.

• Guardar
• Ordenação - após guardar, a ordem pode ser alterada. Neste exemplo, é colocado em primeiro lugar.

Verificar o resultado

Veja as páginas no seu sítio. Neste exemplo, a maioria das páginas não mostrará os submenus na posição do lado esquerdo. A hiperligação Animals no menu superior abrirá a página animals, a partir da qual é possível navegar para as páginas Cats ou Dogs: