Como criar um menu de barra lateral dobrável no WordPress (a maneira mais fácil)

Deseja criar um menu de barra lateral recolhível no WordPress?

Um menu dobrável pode dar aos visitantes do seu site uma maneira fácil de acessar muitos links, sem sobrecarregar sua barra lateral. É perfeito para grandes sites, lojas de comércio eletrônico ou qualquer site que tenha um layout mais complexo.

Neste artigo, mostraremos como criar facilmente um menu de barra lateral recolhível no WordPress.

O que é um menu de barra lateral recolhível (e quando usar um)

Os menus mais amigáveis ​​fornecem acesso fácil a todos os links que os visitantes precisam. No entanto, isso pode ser complicado para sites que têm muitas páginas ou um layout mais complexo.

Pense em uma grande loja de comércio eletrônico que possui muitas categorias e subcategorias de produtos, como a Amazon.

Exibir cada categoria de produto em um menu padrão não seria uma boa ideia. Os compradores provavelmente precisariam percorrer o menu para encontrar a categoria em que estão interessados.

É aqui que entram os menus recolhíveis. Esses menus organizam seu conteúdo em uma relação pai-filho. Se o visitante clicar em um item pai em um menu recolhível, ele será expandido para exibir todo o conteúdo filho desse pai.

O canal de notícias Guardian usa um menu dobrável para seu site móvel.

Os menus recolhíveis às vezes são chamados de menus expansíveis. Isso ocorre porque suas diferentes seções se expandem quando um visitante clica nelas.

Por padrão, os menus recolhíveis ocultam muito conteúdo e complexidade dos visitantes. Isso é muito mais fácil de usar do que percorrer uma longa lista de categorias e subcategorias.

Dito isso, vamos dar uma olhada em como você pode criar facilmente um menu de barra lateral recolhível em seu site WordPress.

Como criar um menu de barra lateral dobrável no WordPress

Você pode criar um menu de barra lateral recolhível no WordPress usando o plugin Bellows Accordion Menu.

Bellows Accordion Menu fornece um código de acesso útil para que você possa colocar seu menu recolhível em qualquer página, postagem ou área de widget, incluindo sua barra lateral.

Primeiro, você precisará instalar e ativar o plugin. Se precisar de ajuda, consulte nosso guia sobre como instalar um plugin do WordPress.

Após a ativação, vá para a página Aparência »Menus em seu painel do WordPress.

Para começar, digite um nome para o seu menu no campo 'Nome do menu'. Os visitantes do seu site não verão o nome, pois é apenas para sua própria referência. Você pode então clicar no botão Criar Menu.

Em seguida, você pode escolher as páginas que deseja adicionar ao menu recolhível. Por padrão, o WordPress exibe apenas suas páginas mais recentes. Se você quiser ver uma lista de todas as páginas do seu site, clique na guia Exibir tudo.

Alternativamente, você pode clicar em Selecionar tudo. Isso adicionará todas as suas páginas ao menu recolhível.

Quando estiver satisfeito com sua seleção, clique no botão 'Adicionar ao menu'. Você também pode selecionar postagens, categorias de blog ou adicionar links personalizados. Para mais detalhes, consulte nosso guia sobre como adicionar um menu de navegação no WordPress.

Depois de adicionar todas as suas diferentes páginas da Web ao menu, você pode movê-las arrastando e soltando-as. Isso mudará a ordem em que essas páginas aparecem em seu menu recolhível.

Menus recolhíveis são todos sobre relacionamentos pai-filho.

Quando um visitante clica em um item pai em seu menu recolhível, ele se expande para revelar todo o conteúdo filho.

Para criar esse relacionamento, basta arrastar e soltar para organizar todas as suas páginas filhas abaixo da pai.

Em seguida, pegue cada criança e arraste-a um pouco para a direita. Você pode então liberar esta página. Isso irá recuar o item e transformá-lo em uma página filho.

Não se esqueça de clicar no botão Salvar alterações quando terminar.

Agora queremos adicionar este menu dobrável à barra lateral do WordPress. Para fazer isso, usaremos algum shortcode que o Bellows Accordion cria automaticamente.

Para pegar o shortcode, vá para Appearance » Bellows Menu . Se ainda não estiver selecionado, certifique-se de selecionar a guia Mostrar tudo.

Agora você pode clicar na caixa Shortcode, que deve destacar todo o código. Agora, copie este código usando o atalho de teclado Command + c ou Ctrl + c.

A próxima etapa é colar esse código de acesso em um widget, então vá para Appearance » Widgets . Isso exibirá todas as áreas widgetizadas em seu tema atual. As opções que você vê podem variar, mas a maioria dos temas modernos do WordPress apresenta uma barra lateral.

Depois de encontrar a área da barra lateral, clique nela. Esta seção agora será expandida.

Para adicionar um bloco, clique no ícone + e comece a digitar o Shortcode. Quando ele aparecer, selecione o bloco Shortcode.

Agora, basta colar o código de acesso do menu recolhível neste bloco. Para publicar seu menu, você precisará clicar no botão Atualizar na parte superior da tela.

Agora, quando você visitar seu site, deverá ver um novo menu da barra lateral recolhível.

O plugin Bellows Accordion torna super fácil personalizar este menu padrão. Por exemplo, você pode alterar o esquema de cores para refletir melhor a marca do seu site.

Se você quiser ajustar o menu padrão, basta acessar Aparência » Menu Fole no painel do WordPress.

Este menu tem todas as configurações necessárias para personalizar seu menu dobrável. Há muitas configurações para explorar. No entanto, você pode querer começar indo para Main Configuration » Basic Configuration .

Aqui, você pode alternar entre várias cores de menu diferentes. Você também pode escolher se os visitantes podem expandir vários submenus de uma só vez usando as configurações de dobradura de acordeão.

Para alterar o alinhamento e a largura do menu, clique na guia 'Layout & Position'.

Se você preferir visualizar suas alterações em tempo real, poderá editar o menu da barra lateral recolhível no WordPress Customizer. Para fazer isso, vá até Aparência » Personalizar .

Na barra à esquerda, selecione Fole.

Aqui, você encontrará muitas configurações diferentes para sua barra lateral recolhível. Isso inclui alterar a largura, o alinhamento e a cor do menu da barra lateral.

Esperamos que este artigo tenha ajudado você a aprender como criar um menu de barra lateral recolhível no WordPress. Você também pode consultar nosso guia sobre como rastrear os visitantes do seu site e o melhor software de notificação por push para aumentar seu tráfego.

Se você gostou deste artigo, assine nosso canal do YouTube para tutoriais em vídeo do WordPress. Você também pode nos encontrar no Twitter e no Facebook.