Elementor: O teu guia completo para o construtor de páginas do WordPress

Maddy Osman Última atualização 08.07.2021
10 min.
How To Use Elementor: A Start-To-Finish Setup Guide
Última atualização 08.07.2021

O Elementor é um dos mais populares construtores de páginas WordPress neste momento. Por uma boa razão: o Elementor está repleto de funcionalidades que tornam a construção de sites personalizados mais fácil do que nunca. Neste artigo, aprenderás tudo o que precisas de saber sobre o Elementor.

Se estás curioso sobre como utilizar Elementor, vieste ao sítio certo. Hoje gita tudo à volta do Elementor - incluindo dicas de instalação e os melhores temas e add-ons. Especialmente no início, a utilização do Elementor pode ser confusa. Vamos analisar mais de perto os seguintes tópicos:

  • Elementor: O que é o Elementor e como funciona o construtor de páginas
  • Vantagens de utilizar o Elementor como construtor de páginas WordPress
  • Diferenças entre o Elementor e o Elementor Pro
  • Como instalar o construtor de páginas Elementor no WordPress
  • Como utilizar o Elementor: explicado passo a passo
  • Os melhores temas do Elementor e como utilizá-los
  • Add-ons recomendados para o Elementor
  • Conclusão: Como utilizar o Elementor - o guia completo

Elementor: O que é e como funciona

Afinal, o que é um construtor de páginas (ou Page Builder)?

Um construtor de páginas/ de sites é comparável a um "kit de construção" para o conteúdo do teu site, no qual podes arrastar e largar elementos individuais para os locais desejados e preenchê-los com o teu próprio conteúdo. No nosso artigo irás aprender as vantagens e desvantagens mais importantes dos construtores de sites.

Elementor é um plugin para a construção de sites concebido para WordPress. O Elementor acrescenta toda uma gama de funcionlidades de arrastar e largar. Assim, até mesmo os principiantes criam fantásticos sites que parecem profissionais.

A maior vantagem do Elementor é que obténs uma visão completa ao vivo do teu site - enquanto fazes alterações.

O Elementor cria uma experiência de design intuitiva, especialmente para principiantes. Para o conseguir, o plugin utiliza dezenas de widgets, uma biblioteca de modelos completa, e uma funcionalidade de histórico de alterações. 

O núcleo do plugin Elementor é gratuito e vem com muitos elementos básicos. Se precisares de funcionalidades mais avançadas, está disponível o Elementor Pro. Esta versão premium do Elementor tem vários níveis de preços, começando em $49/ano para um site e indo até $999/ano para 1.000 sites.

Vantagens de utilizar o Elementor como construtor de páginas WordPress

Como já deves ter adivinhado, o Elementor tem algumas vantagens. Vamos explorar algumas antes de entrarmos no verdadeiro tutorial do Elementor. Algumas das vantagens mais importantes são: 

  • Fácil de usar. A edição visual do frontend combinada com widgets torna o trabalho com o construtor de páginas Elementor incrivelmente fácil, mesmo para principiantes. 
  • Flexível e extensível para programadores. Uma robusta biblioteca de modelos, editor de blocos e controlo total sobre a saída significa que os programadores mais experientes também podem aprender a utilizar e a trabalhar com o tema construtor do Elementor. 
  • Toneladas de opções para a criação de estilos. Podes utilizar o painel do editor com controless deslizantes para ajustar as definições no design dentro de uma estrutura de edição confortável.  
  • Widgets globais que poupam tempo. Alterar, personalizar, guardar e utilizar widgets em múltiplos sites. 
  • Criação de temas por drag & drop. Cria um tema do Elementor do zero com os widgets incorporados - ou utiliza modelos pro do Elementor como base. 
  • Integração do comércio eletrónico. Utiliza o painel widget para criar uma loja online com o controlo total responsivo a que estás habituado de outros construtores com compatibilidade WooCommerce.
  • Ferramentas de marketing incorporadas. Especialmente quando começares com o Elementor, notarás imediatamente o seguinte: podes personalizar os estilos de formulários, criar uma landingpage de Elementor, e utilizar widgets de plugins para construires a tua presença na web e estratégia de marketing ao mesmo tempo. 
  • Grande comunidade e mercado de terceiros. Uma grande vantagem do Elementor é a grande comunidade de programadores por trás dele. Podes passar horas a pesquisar todos os modelos de páginas do Elementor, temas do WordPress e add-ons que ampliam as funcionalidades principais do Elementor. 
Os 15 construtores de páginas WordPress mais populares em comparação

Há mais do que apenas um construtor de páginas WordPress. Vamos apresentar-te agora 15 diferentes plugins para te ajudar a avançar mais rapidamente com o WordPress. Conhece os melhores construtores de páginas WordPress atualmente no mercado.

Diferenças entre o Elementor e o Elementor Pro

Antes de prosseguirmos, é importante mencionar que existe uma versão Pro do Elementor. Com a versão gratuita já conseguirás fazer bastante, mas se procuras ainda mais funcionalidades deves considerar o Elementor Pro

A versão gratuita do Elementor inclui tudo o que precisas para criar um site, incluindo funcionalidades de construção:

  • Cabeçalho 
  • Caixas de texto 
  • Widgets de imagem 
  • Widgets de vídeo 
  • Widgets de galerias
  • Testemunhos 
  • Widgets divisores 
  • Widgets de acordeões 

O Elementor Pro acrescenta várias funcionalidades destinadas a empresas, incluindo:

  • Formulários 
  • Slides 
  • Portefólios 
  • Tabelas de preços 
  • Carrossel de imagem 
  • Widgets contadores 
  • Pop-ups 
  • Widgets de botões sociais
  • Rodapé personalizado e construtor de cabeçalhos 
  • "call to action"

Também podes adicionar fontes e pontos de interrupção personalizados e utilizar muitos widgets premium. Aqui podes encontrar uma comparação da versão gratuita do Elementor e do Elementor Pro: 

Diferenças entre Elementor e Elementor  Pro
Infográfico comparando as características do Elementor e do Elementor Pro

Como instalar o construtor de páginas Elementor no WordPress

Parainstalares o Elementor precisas de um WordPress instalado com umplano de alojamentoe umnome de domínio. Quando entrares no painel de controle do teu site WordPress, vai a Plugins > Add New

How To Install the Elementor Page Builder in WordPress
Ecrã de pesquisa de plugins WordPress no painel de controle

Procura pelo Elementor e instala-o. Depois clica em Ativar

How to install the Elementor plugin
Instalar e ativar o plugin Elementor no painel de controlo WordPress.

Se escolheres o Elementor Pro (ou quiseres atualizar a partir do plugin Elementor básico), vai ao site do Elementor a A minha conta e clica no botão descarregar o plugin . Isto irá guardar um ficheiro ZIP no teu computador. 

Elementor account view
Visualização da conta Elementor, acesso ao menu Downloads

A seguir, entras no teu painel WordPress e navegas para Plugins > Add New. Carrega o ficheiro ZIP que acabaste de guardar no teu computador, clica em Instalar, e depois em Ativar. Para que isto funcione é necessário teres a versão gratuita do plugin Elementor instalada e ativada. 

Adding plugins to WordPress
Adição de plugins ao WordPress

A partir daí, precisas deativar a tua licença. Para isso, vai a Elementor > Licença e depois clica em Ligar e Ativar

Activating the Elementor Pro license in the WordPress dashboard.]
Ativação da licença Elementor Pro no painel de controle do WordPress

No ecrã seguinte, clica em Ligar e depois inicia a sessão na tua conta Elementor . 

Connecting the Elementor license with your WordPress website
Ligando a licença Elementor ao teu site WordPress

Serás redireccionado/a de volta para o painel de controle. A mensagem no topo do ecrã a pedir para ativares a tua licença deverá ter desaparecido. 

Como utilizar o Elementor: explicação passo a passo

Agora que a instalação está concluída, é altura de começares a trabalhar na forma de utilizar o Elementor na prática. O Elementor recomenda a instalação do plugin Envato Elements que te fornece uma seleção de modelos de páginas Elementor no painel de controle. Certifica-te de que tens o tema padrão doWordPress instalado e ativado. 

Downloading the Envato Elements plugin in the WordPress dashboard
Download do plugin Envato Elements a partir do painel do WordPress

Para começar, navega até ao Elements no painel de controle WordPress. Podes escolher entre kits de modelos gratuitos e premium. Decide qual preferes. Escolhe depois um modelo que te convenha.

A list of free template kits by Envato Elements in WordPress
Uma lista de kits de modelos gratuitos do Envato Elements no WordPress

Percorre o menu do modelo e seleciona um design de página inicial que desejes importar. Repete isto para cada novo modelo de página específica que pretendas criar. Muitas pessoas optam frequentemente por utilizá-lo para criar páginas como Sobre Nós, Serviço , e Contacto - mas isso depende de ti.

A list of free template kits by Envato Elements in WordPress
Opções de modelos de página inicial no kit de modelos do CoWorking Space

Depois de teres criado as tuas páginas, pode seditá-las usando o Elementor. Para o fazeres, vai a Páginas > Todas, passa o cursor sobre a página que pretendes editar, e clica em Editar com Elementor

Uma vez carregada a página, deverás ver o editor do Elementor em ação. No lado esquerdo do ecrã, verás o modo editor ativado. E, do lado direito, verás a pré-visualização do editor. Esta é basicamente uma visão ao vivo do teu site que podes reorganizar, reformatar e editar diretamente. 

Elementor: O teu guia completo para o construtor de páginas do WordPress
Edição de uma página inicial no Elementor

O conteúdo está dividido em seções no modo de edição. Quando passaa com o rato pelas secções, estas devem ficar realçadas a azul claro. 

Ao clicares numa secção, podes editar diretamente o conteúdo da mesma. Se clicares com o botão direito do rato, o painel da secção abre-se. Aqui podes ver como, após clicares numa imagem no modelo, o painel de controle da imagem aparece no lado esquerdo:  

Editing images in Elementor
Edição de imagens no Elementor

Trabalhar com widgets é um processo semelhante: se já estiver presente no modelo, basta clicaresno ícone de lápis cinzento para abrir o modo de edição para esse widget em particular. Este irá então reaparecer no lado esquerdo. 

Se quiseres fazer alterações a um widget carrossel de imagem, podes clicar nele no modelo predefinido e depois fazer alterações às definições, ajustando o tamanho, texto associado e imagens. 

Adding an image carousel widget in Elementor
Adição de um widget carrossel de imagem no Elementor

À medida que aprendes a utilizar os modelos do Elementor e a desenhar o layout das tuas páginas a teu gosto, podes começar a pensar no estilo. Podes personalizar as cores ajustando-as a nível global (para todo o teu site se utilizares o Pro) e também numa base de widget. 

Mudar a cor do texto nos teus títulos é super fácil:

Changing the color, font, and style of text in Elementor
Alteração da cor, fonte e estilo do texto no Elementor

Podes ajustar os estilos e tamanhos das fontes, quer o texto tenha ou não uma sombra (e a sua opacidade), e vários outras configurações de estilo para espaçamento, margens e limites. Podes até ajustar o tamanho e o padrão da linha do widget divisor. 

Podes inserir ícones de redes sociais, personalizar a sua cor e tamanho, e determinar a sua colocação. Também podes alterar a sua forma, adicionar colunas e alterar a sua orientação. 

Adding social media icons using Elementor
Adição de ícones de redes sociais com o Elementor .

Todo o fluxo de trabalho com o Elementor é de fácil utilização. Se cometeres um erro, é fácil de corrigir porque podes sempre visualizar o teu histórico de revisões e regressar a uma versão mais antiga do teu site com um clique. 

The Revision History and Navigator views in Elementor
As visualizações histórico de revisão e navegador no Elementor

Da mesma forma, o navegador torna fácil ver cada secção, área interior, e widget de uma só vez, para que não tenhas de percorrer infinitamente para cima ou para baixo. Manipular qualquer parte do teu site é semelhante no Elementor. Seleciona uma secção ou widget, faz alterações, e guarda o teu trabalho. E quando estiveres pronto, podes publicar o teu site. 

Se quiseres acrescentar mais funcionalidades ou quiseres um tema inicial ainda mais robusto, podes usar temas Elementor e add-ons - que é exatamente aquilo que vamos tratar a seguir. Agora que compreendeste o básico da utilização do Elementor, vamos dar uma vista de olhos a alguns dos temas mais populares disponíveis para a plataforma. 

Os melhores temas do Elementor

  • Olá: Hello é um tema gratuito e fácil de usar, concebido para o Elementor. Hello é um verdadeiro tema para começar com o Elementor. Hello não contém nenhum estilo ou guião, mas vem com os principais Plugins do WordPress compatíveis. 
  • Layers: O Elementor adotou Layers para que seja agora compatível com o plugin e oferece escolhas de design adequadas aos profissionais - completamente grátis. 
  • Astra: Conhecido como o tema mais popular do WordPress de todos os tempos, Astra é leve, rápido e fácil de personalizar através do Elementor. A versão gratuita é muito rica em funcionalidades, mas existe também uma versão Pro que oferece uma maior seleção de widgets predefinidos e opções de personalização. Os preços começam nos $47/ano.
  • Hestia: Hestia é outro tema compatível com o Elementor. Oferece-te gratuitamente um design moderno. Mas também podes fazer o upgrade para a versão Pro para obter mais opções de widgets e melhorar a compatibilidade do Elementor. Os preços começam nos $69/ano.
  • GeneratePress: Este tema WordPress gratuito e de código aberto é uma escolha sólida para construir qualquer tipo de site. Há também uma versão Pro com mais funcionalidades que começa nos US $ 44/ano. 
  • OceanWP: Este tema premium do WordPress oferece compatibilidade total com o Elementor, incluindo múltiplas demonstrações, extensões e widgets, a partir de $39/ano. 
  • Customify: Este tema é gratuito. Graças à integração com o Elementor e o Header & Footer Builder, tens imensas opções de personalização. Também podes fazer o upgrade para a versão Pro, que está disponível a partir de $59/ano para módulos adicionais, atualizações e suporte.
  • Neve: Este Theme tem um deign Mobile First que funciona com o Elementor e é de utilização livre. Há uma versão Pro com ainda mais funcionalidades disponíveis a partir de $59/ano.
  • Phlox Pro: Este tema premium está disponível em ThemeForest por $49 e inclui mais de 150 modelos Elementor. 
  • Zakra: Concebido para velocidade e SEO, este tema inclui mais de 65 modelos de arranque. A versão Pro inclui demos premium e um conjunto mais amplo de funcionalidades, a partir de $59/ano. 

Add-ons recomendados para o Elementor 

O Elementor está repleto de funcionalidades. Sabes agora como usar temas Elementor, mas também deves considerar os vários add-ons populares para ampliar ainda mais a funcionalidade. 

Enquanto aprendes a utilizar o Elementor, podes verificar os seguintes add-ons:

  • Ultimate Addons: Extende o Elementor com mais add-ons, widgets e blocos, a partir de $55. 
  • Essential Addons para o Elementor : Esta é a mais popular biblioteca Elementor para o Elementor e vem com mais de 70 opções, a partir de $39,97 para um único site. 
  • Elementor Pack: Este pack está repleto de widgets e add-ons Elementor gratuitos. A versão Pro oferece ainda mais widgets, bem como suporte e atualizações, a partir de $29/ano.
  • Prime Slider: Com este add-on podes criar um controle deslizante no cabeçalho e na área hero de teu site Elementor. Podes descarregar o plugin gratuitamente ou optar pela versão Pro, que inclui suporte e atualizações, a partir de $7,92/ano.
  • ToolKit para Elementor : ToolKit visa simplificar a criação de sites Elementor graças a melhorias de desempenho e ferramentas administrativas mais intuitivas. Podes começar com este add-on em até três sites por $49/ano.
  • Happy Addons: Por último, mas não menos importante, há Happy Addons. O add-on adiciona novos widgets, secções e predefinições a0 Elementor. Existe uma versão gratuita e uma versão pro. Esta última vem com funcionalidades adicionais como Live Copy, suporte 24h/dia e 7 dias/semana e atualizações. O preço começa nos $29/ano. 

Conclusão sobre o construtor de páginas Elementor

O Elementor é frequentemente aclamado como o melhor plugin construtor de páginas para WordPress. Há uma boa razão para isto: o design rico em funcionalidades, a forte comunidade e a disponibilidade de temas e add-ons tornam o Elementor uma forma flexível e acessível de construir um site. 

Se quiseres aprender a utilizar o Elementor, precisas de começar com um plano de alojamento sólido. Nós na RAIDBOXES oferecemos-te alojamento WordPress específico que cobre uma variedade de necessidades. Se tiveres alguma dúvida sobre os nossos planos, não hesites em contactar-nos.

As tuas perguntas sobre o tema Elementor

Que perguntas tens para a Maddy? Aguardamos o teu comentário. Interessas-te por WordPress e web design? Então segue-nos na RAIDBOXES no Twitter, Facebook, LinkedIn ou através da nossa newsletter.

Maddy Osman é uma estratega de conteúdo SEO. Trabalha com clientes selecionados na área WordPress e alojamento web. Com formação em web design e WordPress, tem um profundo conhecimento de SEO - e sabe exatamente como ligar marcas com conteúdos relevantes de SEO.

Artigos relacionados

Comentários sobre este artigo

Escreve um comentário

O teu endereço de e-mail não será publicado. Os campos obrigatórios estão marcados com *.