Conteúdos por assunto

Fique por dentro das novidades do seu tema preferido

Aprenda a criar sites incríveis com facilidade

Use o poder da internet para divulgar o seu negócio

Inspire-se com as estratégias de grandes empresas

Conteúdos variados para alavancar os resultados do seu projeto

A confirmação da sua inscrição foi enviada para o seu e-mail

Agradecemos sua inscrição e esperamos que você aproveite nossos conteúdos!

Elementor: entenda como criar seu site com este plugin!

Saiba tudo sobre o Elementor e como criar seu site

Compartilhe:

Quer ter um site com design intuitivo, fácil de navegar e até mesmo de editar a aparência? Então você precisa saber a como utilizar o Elementor no WordPress.

O Elementor é um dos plugins mais utilizados e intuitivos para a criação de sites. Portanto, vem descobrir como utilizar esta ferramenta no seu projeto online! 

Se eu te disser que existe um construtor de páginas com mais de 5 milhões de instalações ativas e, além disso, promete ser “ilimitado em design”, você acreditaria? Bom, é isso que promete o Elementor

Lançado em 2016, este plugin está experimentando um rápido crescimento e, dessa forma, está estourando nos principais sites WordPress hoje. Seus usuários são loucos por ele e seria quase considerado um fracasso não o usar. 

No entanto, ele merece tantos elogios? É realmente uma ferramenta obrigatória ou toda essa fama é superestimada? Para descobrir, te convidamos a entender o que é Elementor e o que ele tem de especial. Vamos lá?

Saiba Mais: Confira o passo a passo para instalar WordPress

O que é Elementor WordPress

Fonte: WordPress.com

Elementor é um construtor de páginas para WordPress que é usado na forma de um plugin. Ele permite que você crie páginas complexas no WordPress sem codificação, graças ao uso de modelos de página prontos ou do zero, para adicionar arrastando e soltando em seu conteúdo. Todas as alterações são visíveis em tempo real. 

Elementor WordPress não é apenas um construtor de páginas como outros que existem por aí. Ele faz parte de um círculo muito fechado: o das extensões com mais de 5 milhões de instalações ativas.

Existem apenas oito plugins, neste caso: Yoast SEO, Jetpack, Akismet, Contact Form 7, WooCommerce, Classic Editor e Really Simple SSL. 

Por que utilizar o Elementor no seu site? 

Se você deseja ter controle total sobre a aparência do seu site WordPress, sem ter que mergulhar em seu código, então, o Elementor é para você. Além disso, mesmo se você tiver o conhecimento técnico para codificar tudo sozinho, o Elementor torna o design do seu site fácil e intuitivo.  

Usar o Elementor para criar sites pode economizar seu tempo e ajudar você a construir seus sites com mais rapidez. Além disso, ajuda a reduzir a complexidade de seus sites, eliminar bugs e a criar um processo de manutenção mais fácil quando se trata de atualizações e testes. 

Banner curso de Elementor Pro

Veja mais vantagens do Elementor: 

  • Além de ser grátis, não será necessário atualizar para a versão Pro para grande parte dos sites. 
  • Uma gama de recursos muito ricos e fáceis de usar. 
  • Não requer nenhum conhecimento em HTML, CSS ou PHP e permite a criação de layouts personalizados. 
  • Oferece uma interface de edição em tempo real. 
  • Permite ajustar separadamente as versões para desktop, celular e tablet. 
  • Possibilita utilizar parâmetros precisos para a gestão de alinhamentos e margens.  

Como utilizar o plugin Elementor no WordPress 

Você deve primeiro instalá-lo e ativá-lo para que o plugin elementor funcione no WordPress. A instalação é padrão – como qualquer outro plugin do WordPress

Depois, há um painel de controle que você pode visitar se quiser. Para isso, vá diretamente para suas páginas do WordPress e crie uma nova. 

A opção “Editar com Elementor” deve aparecer quando o plugin estiver instalado. Assim, você acessa a interface do usuário diretamente no front end do seu site. 

Listamos a seguir os diferentes elementos que aparecem: 

  1. O canva principal, onde tem seus blocos de conteúdo para ajustar. 
  1. Todos os elementos disponíveis de conteúdo. 
  1. As configurações de cores, fontes, etc.  
  1. O editor de bloco. 
  1. As Configurações gerais para a página em que você está trabalhando. 
  1. O histórico das revisões da página. 
  1. Modo responsivo para otimizar seu site em tablets e celulares. 
  1. Visão geral das mudanças.

Veja como instalar o WordPress no seu plano de hospedagem:

Como criar um site web com Elementor? 

Primeiro você precisa entender a hierarquia da estrutura da página, e assim, construir uma página básica com Elementor: 

  • Uma página pode ter qualquer número de seções. 
  • Cada seção pode ter uma ou mais colunas. 
  • Uma coluna pode abrigar um ou mais itens de conteúdo. 
  • Cada conteúdo pode ser estilizado individualmente 

Você pode adicionar novas colunas em uma nova seção e, em seguida, preencher essas colunas com conteúdo arrastando e soltando blocos específicos da barra lateral. 

Após configurar um bloco de conteúdo, você pode clicar nele para ajustar os detalhes de seu conteúdo e apresentação. Três guias principais estão disponíveis: Estilo, Layout e Avançado

Assim, um por um, você pode trabalhar com blocos de conteúdo individuais até que a página inteira esteja pronta. 

Se sua dúvida é como editar com Elementor, saiba que no geral, o Elementor é muito fácil de usar e bastante intuitivo. Portanto, trabalhar com suas páginas se torna muito divertido, após entrar na hierarquia da página / estrutura e conhecer todos os elementos de conteúdo.

Selecione um tema Elementor 

O Elementor oferece muitas possibilidades de design, mas pode ser difícil começar se você não tiver um projeto de design em mente. Você pode então usar um dos muitos modelos predefinidos do Elementor. Mais de 150 modelos estão disponíveis na versão gratuita e mais de 300 na versão Pro. 

Se isso não for suficiente, você também pode obter algo chamado Kits Elementor. Isto é, coleções de modelos que seguem o mesmo quadro. Isso permite que você crie um site completo e coeso. 

Na biblioteca, você encontra todos os tipos de páginas, dependendo de seus objetivos. Dessa forma, você encontrará uma boa seleção de páginas de informações, páginas de contato, home pages, landing pages (também para vários nichos, como hotéis, restaurantes, etc.), portfólios, páginas de times e muito mais. 

Você não apenas pode importar um template elementor para a sua página, mas também pode modificá-los livremente até obter o resultado que mais se adequa à sua ideia. 

Que tipos de site é possível criar com Elementor? 

Com o Elementor, começando de uma folha em branco, podemos fazer quase tudo, graças a uma ampla gama de ferramentas. Portanto, você só precisa ter as ideias e o resto virá.  

Assim que chegar à interface do Elementor pela primeira vez, você verá que sua tela está dividida em duas seções. 

À esquerda, você tem uma coluna de configurações que oferece a possibilidade de personalizar a aparência de sua página adicionando elementos (Widgets, em inglês), ou seja, blocos de conteúdo pronto para uso (por exemplo,título, imagem, vídeo, botão etc.). 

À direita, você tem uma prévia da renderização visual de sua página.

Como muitos de seus concorrentes, Elementor adota uma hierarquia em termos dos elementos que estruturam sua página:  

  • Você adiciona uma seção. 
  • Agrega várias colunas (1 a 10) a ele. 
  • Você incorpora seus elementos em suas colunas para começar a trabalhar neles. 

As funcionalidades do plugin, como a coluna que contém os elementos, podem ser facilmente ocultadas ou reduzidas. Assim, é possível e realmente ver o resultado, sem ser poluído pela interface de trabalho.

No Elementor, como em muitos construtores de páginas, trabalhamos com arrastar e soltar. Você escolhe o elemento de sua escolha clicando nele com o mouse e, em seguida, arrasta-o para onde quiser na página. 

Uma variedade de widgets  

Na versão gratuita do Elementor, você encontrará uma grande variedade de widgets a sua disposição: 

  • Widgets básicos: Título, editor de texto, imagem, botão; 
  • Widgets gerais: podem ser classificados da seguinte forma; 
  • Conteúdo: Galeria, Carrossel, Guias, Acordeões; 
  • Widgets de persuasão: Testemunho, Avaliação, Barra de progresso; 
  • Os widgets mais técnicos: Código curto, HTML personalizado; 
  • Widgets WordPress: aqueles que você já conhece e estão disponíveis na ferramenta de personalização. 

Ou seja, essa versão é suficiente para atender às diversas e variadas necessidades de qualquer tipo de site. Já na versão Pro do plugin, temos widgets adicionais, alguns dos quais até mesmo se tornaram essenciais para um bom número de construtores de sites. 

Por exemplo, você pode inserir tabelas valores para exibir os preços de suas ofertas, frases de chamariz, contagens regressivas ou até mesmo formulários. Por falar em formulários, o widget “Formulário” também oferece recursos bastante extensos. Isso inclui até mesmo o recaptcha, que protege o site contra spams.  

Além disso, o widget de formulário do Elementor oferece uma escolha de 20 tipos diferentes de campos, incluindo alguns avançados (senha, download de arquivo, etc.).

Além do mais, é claro que você tem controle sobre o design e a aparência visual: escolha de cores, espaçamento, tipografia, plano de fundo, etc. 

Diferenças entre Elementor grátis e Elementor Pro

Como mencionamos antes, o Elementor grátis vem com um conjunto de widgets muito bem projetado, mas se você é uma agência ou profissional que desenvolve sites para seus clientes, precisará de mais, e é aí que vem a versão Pro para auxiliar! 

A versão Elementor Pro adiciona mais de 30 outros widgets avançados, incluindo, por exemplo, elementos de tema que lhe darão muito mais opções de personalização e design. 

A combinação de tudo isso realmente dá a você a liberdade de projetar seu site da maneira que você quiser e, além disso, se quiser levar essa personalização um passo adiante, você pode verificar os complementos PowerPack Elementor.

CSS personalizado ao vivo 

Você pode não usar este recurso devido à extensa customização do construtor do Elementor, mas como um desenvolvedor ou designer pode ser útil às vezes.

Este recurso do Elementor Pro permite adicionar CSS personalizado a qualquer widget ou bloco e, dessa forma, ver as alterações feitas nele ao vivo no editor. 

Se você está familiarizado com a codificação e frequentemente se encontra em situações em que precisa fazer edições que não estão ao alcance dos criadores por meio de arrastar e soltar, então recomendamos obter o Pro Pack. 

Integrar em qualquer lugar 

O Elementor Pro tem uma opção que permite incorporar widgets ou linhas onde você quiser usando códigos de acesso. 

Esta opção pode ser útil porque você pode usar códigos de acesso para exibir widgets no rodapé, nas barras laterais e até mesmo nas postagens do blog. Este recurso pode ser útil para qualquer pessoa, dependendo da necessidade. 

Ele também pode ser usado para adicionar caixas de inscrição, banners ou, além disso, qualquer outro widget usando códigos curtos em postagens de blog. Assim, você pode escrever seu blog como costuma fazer e incorporar o código curto quando e se necessário.

Curso de Elementor Pro

Integração WooCommerce 

Com a versão Pro, você pode personalizar facilmente sua loja de comércio eletrônico, pois ela vem com vários widgets WooCommerce.

Além disso, você pode arrastar e soltar os widgets para personalizar partes da loja virtual

Salve suas criações 

Com o plugin gratuito do Elementor, você pode facilmente salvar modelos de linha com o botão Salvar, mas você não tem a opção de salvar widgets. 

A opção de salvar widgets está disponível apenas no Elementor Pro. Embora não pareça um requisito, no caso de widgets mais complexos, como tabelas e grades de trabalho, pode levar muito tempo para personalizar a mesma coisa repetidamente quando você pode carregá-lo por meio de um modelo salvo. Assim, a tarefa se torna muito fácil de realizar.

Portanto, a opção de salvar é mais útil para desenvolvedores do que para usuários finais, pois pode ser usada para criar modelos e designs de widget padrão e pode ser alterada posteriormente, conforme necessário.

No entanto, para usuários que já conhecem algo e querem fazer seu site de maneira ainda mais personalizada, pode aprender tudo de forma bem intuitiva no Elementor.

Qual é o preço do Elementor Pro? 

A versão Pro do Elementor é uma ferramenta poderosa e oferece muito, mas tem um preço. 

Se você não está familiarizado com os construtores de páginas e deseja experimentar o produto, a versão gratuita será uma boa opção para você, pois pode tentar e depois mudar para a versão profissional. 

A versão PRO do Elementor está disponível em cinco versões: ESSENTIAL, ADVANCED, EXPERT, STUDIO e AGENCY. 

Cada versão oferece a mesma funcionalidade, então a diferença está no número de sites que você pode criar.

Você pode verificar as informações completas e o preço do elementor pro no site oficial clicando aqui

Conclusão 

Então, para finalizar: o que achamos desse construtor de páginas? Alguns pontos chaves a se considerar estão listados a seguir. 

  • A interface é impecável, especialmente em termos de animações, que permite saber realmente o que dará o resultado final. Além disso, a visualização dinâmica proporciona um ambiente de trabalho agradável, onde se torna quase relaxante construir sua página. 
  • As possibilidades em termos de personalização são muitas. Efeitos, estilo, configurações avançadas. No entanto, com o Elementor, você realmente tem a sensação de ter controle sobre quase tudo e de poder se divertir com o design do seu site WordPress
  • Uma versão gratuita que já oferece vários widgets e uma versão paga acessível que adiciona outros, para ir ainda mais longe. 
  • Um grande catálogo de modelos para evitar sempre partir de uma folha em branco. 
  • Atualizações regulares que garantem um produto escalonável e durável ao longo do tempo. 
  • Uma comunidade ativa para ajudá-lo a encontrar respostas para suas perguntas. 

E então, qual a sua opinião? Esperamos ter ajudado!