Duração estimada: 90 minutos

Ao final desta lição, você terá o Elementor instalado e ativado no seu WordPress com uma tela básica estruturada.

Lição 1.1: Instalação passo a passo do Elementor

Com uma instalação limpa do WordPress, apenas com os plugins “Classic editor”, “Widget Editor” e o tema “Betheme”, procederemos à instalação do construtor visual Elementor.

Passo 1: Acessar seu painel do WordPress

1. Abra seu navegador web (Chrome, Firefox, etc.)
2. Digite o endereço do seu site WordPress seguido de /wp-admin
   • Exemplo: https://seusite.com/wp-admin
3. Insira seu nome de usuário e senha.
4. Clique em “Acessar”.

Passo 2: Navegar até a área de plugins

Uma vez dentro do painel do WordPress:

1. No menu esquerdo, procure a opção “Plugins”.
2. Passe o cursor sobre “Plugins”.
3. No submenu que aparece, clique em “Adicionar novo”.

Explicação visual:

├── Painel
├── Posts
├── Mídia
├── Páginas
├── Comentários
├── **APARÊNCIA**
├── **Plugins** ← Clique aqui!
│   ├── Plugins instalados
│   └── **Adicionar novo** ← Depois aqui!
└── Ferramentas

Passo 3: Buscar Elementor

Na tela “Adicionar plugins”:

1. Olhe para o canto superior direito da tela.
2. Você verá uma caixa de pesquisa que diz “Pesquisar plugins”.
3. Digite exatamente: “Elementor”.
4. Pressione Enter ou clique na lupa.

Passo 4: Identificar o plugin correto

Você verá vários resultados. Precisa encontrar o oficial:

Cuidado com estes:

• “Elementor Pro” – É a versão paga
• “Elementor Addons” – São extensões
• “Elementor Hello” – É um tema, não o plugin

Passo 5: Instalar Elementor

Uma vez identificado o plugin correto:

1. Clique no botão “Instalar agora” que está abaixo do nome “Elementor”.
2. Aguarde alguns segundos enquanto o WordPress baixa e instala o plugin.
3. Você verá que o botão muda para “Ativar”.

Passo 6: Ativar Elementor

1. Clique no botão “Ativar”.
2. Você verá uma mensagem na parte superior dizendo: “Plugin ativado”.
3. Observe que no menu esquerdo agora aparece “Elementor” como nova opção.

Verificação de instalação correta

Para garantir que está tudo certo:

1. Vá para qualquer página existente
   • Menu esquerdo → “Páginas” → “Todas as páginas”
   • Escolha qualquer página e clique em “Editar”
2. Você deveria ver um novo botão azul que diz “Editar com Elementor”

Se você vir este botão, parabéns! O Elementor está instalado corretamente.

Lição 1.2: Instalação de um tema compatível

Objetivo: Instalar um tema leve que funcione perfeitamente com o Elementor.

⚠️ Atenção: se você tem o Betheme, use sempre este. Leia apenas o seguinte como documentação/aprendizado ⚠️

Por que precisamos de um tema compatível?

• Alguns temas têm seu próprio sistema de design.
• Isso pode gerar conflitos com o Elementor.
• Temas leves permitem que o Elementor tenha controle total.

Passo 1: Ir para a área de temas

1. No menu esquerdo, procure “Aparência”.
2. Passe o cursor sobre “Aparência”.
3. Clique em “Temas”.

Passo 2: Adicionar novo tema

1. Na parte superior da tela, você verá um botão “Adicionar novo”.
2. Clique nele.

Passo 3: Buscar “Hello Elementor” (ou instalar Betheme pago)

1. Na caixa de pesquisa (canto superior direito), digite: “Hello Elementor”.
2. Pressione Enter.

Passo 4: Instalar o tema

1. Você encontrará o tema “Hello Elementor” criado por Elementor.com.
2. Passe o cursor sobre a imagem do tema.
3. Aparecerá um botão “Instalar”.
4. Clique em “Instalar”.
5. Aguarde até que a instalação seja concluída.
6. O botão mudará para “Ativar”.
7. Clique em “Ativar”.

O que é Hello Elementor?

• É um tema ultraleve (menos de 6KB).
• Não inclui estilos próprios.
• Permite que o Elementor controle todo o design.
• É 100% gratuito.
• Mantido pela equipe do Elementor.

Passo 5: Verificar a ativação

Depois de ativar o Hello Elementor:

1. Abra seu site em uma nova aba.
2. Observe que o design é muito básico, quase branco.
3. Isso é normal – significa que o tema está pronto para que o Elementor assuma o controle.

Lição 1.3: Configuração básica do Elementor

Objetivo: Configurar as opções essenciais do Elementor para um bom início.

Acessar a configuração geral

1. Visite sua tela Home como se fosse qualquer usuário.
2. No menu superior, você verá “Editar com Elementor”, clique nele.
3. A tela do editor de conteúdo será carregada.
4. Na barra superior, no lado esquerdo, você verá o logotipo, clique nele e selecione “Configurações do site“.
5. Você verá opções como “Cores globais, Fontes globais, tipografia, botões, margens, campos de formulário, etc”. Estes são valores que você pode modificar e que se aplicarão a todo o site.
6. Faça as alterações que desejar e clique no botão que aparece no final “Salvar alterações“.

Lição 1.4: Criar página de teste

Objetivo: Criar sua primeira página com o Elementor para verificar se tudo funciona.

Passo 1: Criar nova página

1. No menu esquerdo, clique em “Páginas”.
2. Clique em “Adicionar nova”.

Passo 2: Dar nome à página

1. No campo “Adicionar título”, escreva: “Minha primeira página com Elementor”.
2. Não escreva nada no editor clássico do WordPress.

Passo 3: Abrir com Elementor

1. Procure o botão azul que diz “Editar com Elementor”.
2. Ele está localizado logo acima do editor de texto.
3. Clique nele.

Passo 4: Primeiro contato com o editor

Parabéns! Você está dentro do editor do Elementor.

O que você deveria ver:

1. Painel esquerdo: Lista de widgets (ícones).
2. Área central: Espaço vazio com um botão “+”.
3. Painel direito: Vazio por enquanto.

Passo 5: Testar um widget simples

1. No painel esquerdo, procure “Título”.
2. Arraste-o (clique + mantenha pressionado + mova) para a área central.
3. Solte o mouse.

Passo 6: Configurar o título

1. Clique no widget que você acabou de adicionar.
2. No painel esquerdo, vá para a aba “Conteúdo”.
3. No campo “Título”, escreva: “Olá Mundo! Minha primeira página com Elementor”

Passo 7: Salvar e visualizar

1. Clique no botão “Publicar” (abaixo à esquerda ou acima à direita, dependendo da versão).
2. Clique em “Ver página” (ícone de olho).
3. Você verá sua página ao vivo!

EXERCÍCIO PRÁTICO DO MÓDULO 1

Objetivo: Verificar se você aprendeu tudo corretamente.

Tarefa 1: Instalação limpa

1. Desinstale o Elementor se você já o tinha.
2. Reinstale-o do zero seguindo os passos.

Tarefa 2: Configuração completa

Configure o Elementor com estes valores exatos:

• Cor primária: #4CAF50 (verde).
• Fonte primária: ‘Open Sans’
• Espaçamento entre widgets: 15

Tarefa 3: Página de teste

Crie uma página chamada “Prática Módulo 1” que contenha:

1. Um título principal.
2. Um parágrafo de texto.
3. Uma imagem (você pode usar qualquer uma).
4. Um botão.

Verificação final:

Sua página deveria ficar assim no editor:

[TÍTULO: "Prática concluída"]
[TEXTO: "Aprendi a instalar e configurar o Elementor"]
[IMAGEM: Qualquer imagem]
[BOTÃO: "Ver mais"]

PERGUNTAS FREQUENTES

P: Preciso do Elementor Pro para começar?

R: NÃO. O Elementor Gratuito é mais que suficiente para aprender e criar sites profissionais.

P: Posso mudar de tema depois?

R: SIM, mas alguns temas podem não ser compatíveis. Hello Elementor é a opção mais segura para iniciantes. Para profissionais, pode-se usar temas como BeTheme (recomendado).

P: O Elementor deixa meu site lento?

R: É um construtor visual pesado, portanto recomenda-se não instalar muitos plugins em um site WordPress com este construtor.

RECURSOS ADICIONAIS

1. Documentação oficial: https://docs.elementor.com/ (em perfeito inglês)
2. Fórum de suporte: https://wordpress.org/support/plugin/elementor/

PRÓXIMO MÓDULO: “Primeiro contato com o editor” – Você aprenderá a navegar pela interface, usar widgets básicos e criar sua primeira seção.