{"id":514,"date":"2022-07-22T20:10:39","date_gmt":"2022-07-22T23:10:39","guid":{"rendered":"https:\/\/kangaroo.host\/blog\/wordpress-como-criar-menu-elementor\/"},"modified":"2024-11-01T22:52:53","modified_gmt":"2024-11-02T01:52:53","slug":"wordpress-como-criar-menu-elementor","status":"publish","type":"post","link":"https:\/\/kangaroo.host\/blog\/wordpress-como-criar-menu-elementor\/","title":{"rendered":"Elementor: Como criar menu no WordPress"},"content":{"rendered":"

Em tempos de pandemia, ter uma boa presen\u00e7a digital se mostrou uma necessidade de import\u00e2ncia ainda maior. E parte disso, claro, inclui construir seu site para come\u00e7ar a difundi-lo pela internet.
\n<\/span><\/p>\n

Por muito tempo, construir o site foi uma tarefa muito dif\u00edcil, e restrita apenas \u00e0queles que, de fato, tinham conhecimentos em linguagens de programa\u00e7\u00e3o, para poder construir a p\u00e1gina e o conte\u00fado.
\n<\/span><\/p>\n

Contudo, para o bem do avan\u00e7o da internet, diversas ferramentas foram criadas e disponibilizadas \u2013 muitas delas gratuitamente \u2013 para que esse processo fosse mais pr\u00e1tico e menos t\u00e9cnico, focando mais no que sua criatividade pode fazer, n\u00e3o no que voc\u00ea sabe fazer.
\n<\/span><\/p>\n

Uma dessas ferramentas \u00e9 o Elementor<\/a>, um poderoso plugin construtor de p\u00e1ginas, desenvolvido para o WordPress<\/a>, que atualmente \u00e9 a plataforma de constru\u00e7\u00e3o de sites mais utilizada em todo o mundo.
\n<\/span><\/p>\n

Se voc\u00ea est\u00e1 interessado em saber como o Elementor pode ajudar na constru\u00e7\u00e3o de seu site, acompanhe nosso artigo at\u00e9 o final e confira algumas dicas e sugest\u00f5es de como iniciar seu novo projeto.
\n<\/span><\/p>\n

Sum\u00e1rio:
\n<\/strong><\/span><\/h4>\n
    \n
  1. O que \u00e9 o Elementor?<\/a>
    \n<\/span><\/li>\n
  2. Como instalar?<\/a>
    \n<\/span><\/li>\n
  3. Criando menu no WordPress<\/a>
    \n<\/span><\/li>\n
  4. Adicionando menu no Elementor PRO<\/a>
    \n<\/span><\/li>\n
  5. Adicionando na vers\u00e3o free FREE<\/a>
    \n<\/span><\/li>\n
  6. Personalizando o modelo<\/a>
    \n<\/span><\/li>\n
  7. Importando dentro de p\u00e1ginas<\/a>
    \n<\/span><\/li>\n
  8. Conclus\u00e3o<\/a>
    \n<\/span><\/li>\n<\/ol>\n

    O que \u00e9 o Elementor?
    \n<\/strong><\/span><\/h2>\n

    O Elementor \u00e9 um plugin Freemium (com uma vers\u00e3o gr\u00e1tis e uma paga, contando com recursos extras) e sua metodologia consiste em um sistema bem simples, baseado em arrasta-e-solta<\/em>, no qual voc\u00ea tem acesso a uma s\u00e9rie de elementos que ajudam a compor a estrutura e conte\u00fado do site.
    \n<\/span><\/p>\n

    Arrastando esses elementos para a p\u00e1gina do site, voc\u00ea pode organiz\u00e1-los e compor todo o visual da p\u00e1gina, adicionando recursos que v\u00e3o desde textos e imagens at\u00e9 carross\u00e9is, atualiza\u00e7\u00f5es autom\u00e1ticas de posts e mapas.
    \n<\/span><\/p>\n

    Caso queira conferir um pouco mais sobre v\u00e1rios aspectos do construtor, temos um post inteiro dedicado a ele<\/a>, cobrindo um pouco mais do plugin e recursos do plugin.
    \n<\/span><\/p>\n

    Nesse post, nos ateremos apenas \u00e0s dicas iniciais para que voc\u00ea tenha as no\u00e7\u00f5es b\u00e1sicas para criar o seu cabe\u00e7alho de forma simples.
    \n<\/span><\/p>\n

    \n

    Como instalar o Elementor em meu WordPress?
    \n<\/strong><\/span><\/h2>\n

    Todo o processo de instala\u00e7\u00e3o do plugin \u00e9 extremamente tranquilo, e pode ser feito diretamente da \u00e1rea de administra\u00e7\u00e3o do seu site WordPress.
    \n<\/span><\/p>\n

    Como o plugin possui duas vers\u00f5es, a paga e a gratuita, \u00e9 poss\u00edvel instalar a vers\u00e3o gr\u00e1tis direto da loja de plugins do WordPress, facilitando todo o processo.
    \n<\/span><\/p>\n

    Para isso, claro, voc\u00ea precisar\u00e1 j\u00e1 ter o WP instalado e ter acesso de administrador do site, com permiss\u00f5es suficientes para realizar a instala\u00e7\u00e3o de um plugin. Vamos l\u00e1:
    \n<\/span><\/p>\n

      \n
    1. \n
      Ao navegar pelo wp-admin, voc\u00ea poder\u00e1 localizar a guia de plugins e, ao clicar em “Adicionar novo”;<\/span><\/span><\/div>\n

      \"Adicionar
      \n<\/span><\/p>\n<\/li>\n

    2. \n
      Agora, basta buscar pelo plugin Elementor e clicar em “Instalar agora”;<\/span><\/span><\/div>\n

      \"Instalar
      \n<\/span><\/p>\n<\/li>\n

    3. \n
      Feito isso, basca clicar em “Ativar” e o processo de instala\u00e7\u00e3o e ativa\u00e7\u00e3o da vers\u00e3o gratuita estar\u00e1 finalizado.<\/span><\/span><\/div>\n

      \"Ativar<\/span><\/p>\n<\/li>\n<\/ol>\n

      Com essas poucas etapas conclu\u00eddas, voc\u00ea j\u00e1 poder\u00e1 come\u00e7ar a utilizar o plugin sem qualquer dificuldade.
      \n<\/span><\/p>\n

      E um ponto muito importante \u00e9 de que ele n\u00e3o requer qualquer configura\u00e7\u00e3o inicial, o que significa que assim que ele \u00e9 ativado no site, voc\u00ea j\u00e1 pode ir direto para a cria\u00e7\u00e3o de suas p\u00e1ginas.
      \n<\/span><\/p>\n

      Contudo, uma p\u00e1gina de boas-vindas e cadastro ser\u00e1 exibida. Como n\u00e3o \u00e9 algo mandat\u00f3rio, voc\u00ea pode fechar essa guia caso n\u00e3o deseje prosseguir preenchendo as informa\u00e7\u00f5es.<\/span><\/p>\n

      \n

      Criando o Menu no WordPress
      \n<\/strong><\/span><\/h2>\n

      Ainda dentro de seu WP Admin, voc\u00ea precisar\u00e1 criar a estrutura do seu cabe\u00e7alho que ser\u00e1 utilizado no site, isto \u00e9, inserir as informa\u00e7\u00f5es que estar\u00e3o presentes.
      \n<\/span><\/p>\n

      Fazer isso \u00e9 bem simples, e voc\u00ea poder\u00e1 seguir os seguintes passos:
      \n<\/span><\/p>\n

        \n
      1. Na barra lateral \u00e0 esquerda, encontre a se\u00e7\u00e3o “Apar\u00eancia” e, nela, acesse a op\u00e7\u00e3o “Menus;
        \n\"Menu\"<\/span><\/span><\/span><\/li>\n
      2. Agora, voc\u00ea poder\u00e1 criar o seu menu, inserindo o nome dele e configurando onde ele estar\u00e1 localizado. Neste caso, estar\u00e1 em nosso cabe\u00e7alho;
        \n<\/span><\/span><\/span>\"Criar<\/li>\n
      3. Uma vez criado, voc\u00ea poder\u00e1 usar a guia lateral para adicionar novos componentes, como P\u00e1ginas, Categorias, Posts e Links personalizados;
        \n\"Adicionar
        \n<\/span><\/span><\/span><\/li>\n
      4. Com nossos componentes devidamente adicionados, agora vamos salvar e partir para a customiza\u00e7\u00e3o da parte visual;
        \n\"Itens
        \n<\/span><\/li>\n<\/ol>\n

        Como criar menu com Elementor?
        \n<\/strong><\/span><\/p>\n

        A constru\u00e7\u00e3o de p\u00e1ginas no Elementor \u00e9 bem intuitiva, uma vez que parte do processo b\u00e1sico de adi\u00e7\u00e3o de uma p\u00e1gina comum no WordPress.
        \n<\/span><\/p>\n

        Ap\u00f3s criar a p\u00e1gina no WordPress, a\u00ed sim come\u00e7amos a compor o visual e adicionar nossos elementos do site. Para criar o menu, o processo \u00e9 semelhante, mas \u00e9 feito atrav\u00e9s dos “Modelos”.
        \n<\/span><\/p>\n

        Com esses modelos, poderemos criar uma predefini\u00e7\u00e3o, que pode ser inserida mais facilmente nas p\u00e1ginas.
        \n<\/span><\/p>\n

        Antes disso, vamos partir do come\u00e7o, a cria\u00e7\u00e3o da p\u00e1gina:
        \n<\/span><\/p>\n

          \n
        1. \n
          Em nosso WP admin, com acesso administrador, seguiremos passando o mouse em “Novo” e clicando em “P\u00e1gina”;
          \n<\/span><\/div>\n

          \"Adicionar<\/span><\/p>\n<\/li>\n

        2. \n
          Assim que a tela de cria\u00e7\u00e3o for carregada, voc\u00ea poder\u00e1 adicionar o nome que ser\u00e1 dado ao modelo e, feito isso, clique em “Editar com Elementor”;
          \n<\/span><\/div>\n

          \"Adicionar<\/p>\n<\/li>\n

        3. \n
          Quando a p\u00e1gina do construtor carregar, teremos uma vis\u00e3o parecida com essa:
          \n\"Editor
          \n\u00a0<\/span><\/span><\/div>\n<\/li>\n
        4. \n
          Como pode ver, a p\u00e1gina vem com alguns elementos um pouco desconexos. Para corrigir isso, vamos clicar no \u00edcone de engrenagem, no canto inferior esquerdo;
          \n\"Publicar<\/span><\/span><\/span><\/p>\n<\/div>\n<\/li>\n
        5. \n
          \n
          Na guia de configura\u00e7\u00f5es gerais, vamos alterar o layout da p\u00e1gina para “Elementor Canvas”, assim teremos uma p\u00e1gina completamente em branco.<\/span><\/div>\n
          \"Canvas<\/div>\n<\/div>\n<\/li>\n<\/ol>\n
          Feito isso, fecharemos rapidamente a guia de sauda\u00e7\u00e3o da navega\u00e7\u00e3o f\u00e1cil ao clicar no X. Apenas para limpar nossa \u00e1rea de trabalho mesmo;<\/span><\/div>\n
          <\/div>\n
          Agora, come\u00e7aremos a parte interessante, a adi\u00e7\u00e3o dos elementos.
          \n<\/span><\/div>\n

          \u00c9 importante dizer que independente de realizar a cria\u00e7\u00e3o com o Elementor Pro ou Free, esse processo ser\u00e1 exatamente o mesmo at\u00e9 aqui.
          \n<\/span><\/p>\n

          Agora, siga as instru\u00e7\u00f5es para sua vers\u00e3o do Elementor de acordo com o que preparamos abaixo, para que voc\u00ea consiga fazer todo o processo corretamente em sua vers\u00e3o.
          \n<\/span><\/p>\n

          Adicionando menu no Elementor Pro
          \n<\/strong><\/span><\/h2>\n

          o seu site est\u00e1 com a vers\u00e3o Pro ativa, os passos abaixo v\u00e3o te ajudar a preparar tudo para seguir com a personaliza\u00e7\u00e3o. n\u00e3o pode faltar em nosso pequeno projeto. Veja como podemos fazer:
          \n<\/span><\/p>\n