Como adicionar um menu de painel de slides em temas do WordPress

Se você é um desenvolvedor WordPress ou um designer de tema WordPress, você pode querer adicionar um menu personalizado em seu editor de tema para controlar as opções do menu. No entanto, o painel de administração do WordPress não possui uma opção de menu de painel de slides por padrão . Isso significa que você precisa recorrer a um plug-in ou modelo de terceiros para adicionar esse recurso aos seus temas. Portanto, hoje vamos explicar como adicionar um menu de painel de slides em temas do WordPress.

Menu do painel de slides em temas do WordPress: por que incluí-lo?

Existem muitas razões pelas quais a inclusão de um painel lateral pode ser importante. A primeira razão é que os visitantes terão mais facilidade em navegar em seu site WordPress se você dedicar um tempo para desenvolver menus intuitivos. A segunda razão é que os painéis de slides são necessários para dispositivos móveis. Portanto, você precisa ter certeza de tê-los se quiser que seu site funcione bem em dispositivos móveis . No entanto, se muitos dos usuários do seu site estiverem usando dispositivos móveis, é essencial testar o layout do menu nessas telas menores antes de entrar no ar com o WordPress. Felizmente, quando visualizados em um dispositivo móvel, os estilos padrão de muitos temas do WordPress exibirão menus compatíveis com dispositivos móveis. Um menu responsivo em tela cheia ou um menu de painel deslizante dinâmico em temas do WordPress pode ser um belo toque para personalizar ainda mais sua navegação móvel. Por esse motivo, vamos examinar a integração de um menu de painel deslizante nos temas do WordPress.

Etapa 1: instalar o plug-in de menu responsivo

Instalar e ativar o plug-in Menu responsivo é o primeiro passo. Existem duas versões diferentes deste plugin, uma versão paga e outra gratuita . Embora a versão paga do Menu responsivo ofereça alguns extras interessantes, como lógica condicional e mais opções de tema, usaremos o plug-in de código aberto para este tutorial. Ao ativar o menu responsivo, vá para Menu responsivo > Menus. Assim que estiver lá, vá até a barra de ferramentas e clique no botão “Criar novo menu”. Dê um nome ao seu novo menu e salve seu trabalho. Não se preocupe se ele disser que está vazio.

Segundo Passo: Escolha o Tema

O novo menu responsivo fornecerá quatro opções de design diferentes. Você pode comprar mais temas, se quiser. Este tutorial fará uso do tema selecionado pelo sistema. Então, você pode continuar selecionando a opção “Próximo”. Se ainda não o fez, dê um nome ao seu menu responsivo e escolha o tipo de menu no painel do WordPress que deseja que apareça na barra lateral. Selecionamos a opção 'Navegação' para este tutorial.

Se você deseja que seus visitantes vejam apenas o novo menu do painel de slides, você também pode optar por ocultar o menu padrão que aparece com seu tema WordPress. Para fazer isso, use a área denominada “Hide Theme Menu” para inserir algum código CSS. Clique no botão “Saiba mais” para obter mais informações sobre como inserir o código apropriado para o tema escolhido. A edição Pro adiciona mais algumas opções de personalização para o usuário.

Etapa três: configurá-lo

Depois de ajustar os parâmetros ao seu gosto, você pode gerar seu menu clicando no botão “Criar Menu”. Depois de fazer isso, você encontrará uma visualização do seu site à direita, com opções para alternar para o modo móvel, tablet ou desktop na parte inferior . À esquerda, você verá outras configurações de personalização. Observe o idioma que aparece acima das opções do menu. Tanto o título do menu quanto uma linha de “Conteúdo Adicional”, como o plugin o rotula, são mostrados aqui.

Selecione “Menu móvel” e depois “Contêiner” no menu lateral para fazer alterações ou ocultar o texto. Na área Texto do título, você pode inserir qualquer coisa, desde “Menu principal” até “Navegação”. Para desativar a barra de título, basta alternar o interruptor rotulado “Título” para a posição desligada. Depois de fazer isso, vá para a opção 'Conteúdo adicional'. Você tem a opção de desativar esse recurso ou substituir o texto por qualquer outra coisa. Quando terminar de personalizar o menu, não se esqueça de clicar no botão "Atualizar" na parte inferior da página.

Antes de ir ao ar, é importante fazer alguns testes preliminares. Para garantir que tudo esteja funcionando corretamente, você pode querer usar um navegador diferente daqueles que você normalmente usa para acessar seu site. Neste exemplo, usamos o navegador Google Chrome. Para acessar o site em dispositivos móveis, baixamos um aplicativo chamado “ Internet Explorer for Android”. Copiamos e colamos o URL deste site no aplicativo e os resultados foram surpreendentes. Descobrimos que o menu foi formatado corretamente nas orientações paisagem e retrato, e todos os links funcionaram conforme o esperado. No entanto, sua milhagem pode variar quando se trata de dispositivos móveis. Incentivamos você a testar seu menu em tantos dispositivos e navegadores quanto possível antes de colocá-lo no ar. Se você encontrar algum problema, agora é a hora de corrigi-lo.

Etapa cinco: entrar em operação

Uma vez que o cardápio foi testado e você está satisfeito de que tudo está funcionando conforme o planejado, é hora de disponibilizá-lo ao público. Clique no ícone do menu no canto superior direito do seu site e selecione “Configurações do menu” no menu suspenso. Você verá uma lista de itens com o título “Mobile Menu” no topo da lista. É aqui que você inserirá o endereço da Web para a página do plug-in do menu móvel. Feito isso, clique em “Salvar alterações” e aguarde alguns segundos para que as alterações tenham efeito. É isso!

Conclusão

Agora que você sabe como adicionar um menu de painel de slides em temas do WordPress, experimente em seu próprio site. E agora, se você quiser atualizar seu site com menus adicionais, você sabe como fazê-lo . Felizmente, este artigo ajudou você a aprender uma nova habilidade e não o deixou se sentindo sobrecarregado.