Elementor oferece regularmente temas que ajudam você criar um site completa a partir destes. Todos os meses, lançamos novos temas que são construídos em torno de um nicho específico, mas flexíveis o suficiente para que você possa finalmente personalizá-los para atender às suas necessidades.

Combinado com Elementor Pro, esses temas ajudam você a começar rapidamente com todas as partes do seu site, incluindo:

o pidades estáticas, como a página inicial,

  • o cabeçalho
  • o rodapé
  • página 404
  • a seção Arquivo 
  • o blog
  • Popups e outros

Neste tutorial, mostraremos a você Como criar um website conclua usando o construtor visual de páginas Elementor.

Mas antes, se você nunca instalou o WordPress, descubra Como instalar um blog WordPress passos 7 et Como encontrar, instalar e ativar um tema WordPress em seu blog 

Então, voltemos ao porquê de estarmos aqui.

Como construir um site completo com temas Elementor

Neste tutorial, você aprenderá como usar um tema como base para todas as partes importantes do seu site e, em seguida, juntar tudo para criar um site coerente.

Mais precisamente, o tema Agência digital.

Seu site terá várias páginas básicas, como páginas:

  • Inicial
  • sobre nós
  • Serviços
  • Clientes
  • Blog
  • Contato

E também oferece seções dedicadas também ao conteúdo dinâmico. Por exemplo, os arquivos e modelos de postagem de seu blog correspondem automaticamente às suas páginas independentes. Você também pode alterar seu cabeçalho, rodapé e páginas 404.

Como criar um elemento de site completo ou blogpascher 1

então aqui Como criar um website com um tema Elementor:

1. Instale e ative o tema Elementor Hello 

Como você vai usar o Elementor e um template de tema para construir todo o seu site, você não precisa procurar por outros elementos.

Em vez disso, você só precisará de um site leve e com desempenho otimizado, fornecido pelo tema Elementor Hello.

Para começar, vá para Aparência → Temas → Adicionar e pesquisar " Olá elementor" Em seguida, instale e ative o tema. 

2. Configure as páginas estáticas básicas do seu site

Em seguida, vá para o menu Páginas → Adicionar para criar as páginas básicas do seu site.

Primeiro, crie uma página chamada " Inicial "E clique no botão Editar com Elementor para iniciar o Elementor.

Clique configurações para abrir o configurações da página e altere seu layout para ser igual a Elementor Fullwidth.

Em seguida, abra a biblioteca de modelos Elementor e pesquise "Agência Digital" em PÁGINAS :

Você deve ver uma lista de modelos de página deste tema. Inserir modelo Início da lista de modelos.

Agora você deve ver uma página inicial completa. O cabeçalho parece um pouco enfadonho por enquanto - mas não se preocupe, vamos corrigir isso em breve..

Em seguida, adicione outra página para usar para o seu " sobre nós"

Como antes, crie uma página e altere o Layout para Elementor Fullwidth. Em seguida, abra a biblioteca de modelos e insira o modelo Sobre do tema Agência Digital.

Agora, basta repetir o mesmo processo para criar todas as outras páginas, incluindo: Serviços, Clientes e Contato.

Não se preocupe com a página do Blog ainda. Esta página não é estática como as outras. Por esse motivo, você o criará lá por meio de um método diferente (que abordaremos mais tarde neste tutorial).

Para terminar de configurar suas páginas estáticas, você precisa dizer à instalação do WordPress para usar uma página inicial estática. Para fazer isso…

  • ir a Configurações → Reprodução
  • Escolher  Uma página estática (escolha abaixo) nas configurações da sua página inicial 
  • Selecione a página que incorpora o modelo de página inicial do tema

3. Crie as outras partes do seu site

Agora você está pronto para criar as outras partes do seu site usando o Elementor. O Elementor permite que você vá além da criação de páginas estáticas (como você fez acima).

Com o Elementor, você também pode projetar seções como: en-head; o rodapé, etc ...

E graças ao tema Elementor, você poderá importar modelos para todas as seções que já estão nas páginas estáticas que você criou na etapa anterior.

Para acessar o construtor visual do Elementor, vá para Modelos→ Construtor de Temas. Você precisará instalar o Elementor Pro para poder acessá-lo.

Agora é hora de criar suas seções

cabeçalho

Para começar, vá até a guia cabeçalho da interface do construtor visual e clique em adicionar Novo. Na próxima tela, você verá uma seleção de modelos na biblioteca Elementor. Assim como você fez com as páginas estáticas, procure por “Agência Digital” e insira:

Elementor - inserir modelo de cabeçalho

Agora você deve ver uma visualização visual do seu cabeçalho, bem como um menu de navegação do modelo que você inseriu.

Se você quiser mudá-lo

  • ir a  Aparência → Menus no seu painel do WordPress
  • Criar um novo cardápio

Depois de criar um menu, você pode adicionar as páginas criadas na etapa 2 ao menu de navegação.

Leia também: 10 ferramentas de automação para marketing de pequenas empresas

Quando terminar de adicionar itens de menu, salve seu menu e retorne ao modelo de cabeçalho na interface do Elementor.

privativa, publicar seu cabeçalho e usar condições de exibição para exibir seu modelo de cabeçalho em todo o site. Se desejar, você também pode usar as condições de exibição para criar diferentes cabeçalhos para diferentes tipos de conteúdo:

Então aperte Salvar fechar

rodapé

Agora é hora de criar o rodapé do seu site:

  • Retorne à interface do construtor de página visual
  • Clique na aba Rodapé 
  • Clique no botão para Adicionar novo rodapé
  • No pop-up, dê um nome ao rodapé e clique em Criar modelo

Agora você deve ver uma lista de modelos de rodapé, assim como fez com seu cabeçalho. Procure por "Agência Digital" e insira o template de rodapé.

Depois de inserir o modelo de rodapé, você deverá ver uma visualização do seu rodapé:

privativa, publicar seu modelo de rodapé e use os termos de exibição para exibi-lo em todo o seu site.

página Blog

Ao contrário das páginas estáticas que você criou na etapa 2, a página do blog do seu site é um " arquivo ". Basicamente, isso significa que ele exibe dinamicamente o conteúdo mais recente do seu site.

Se um usuário clicar em um item específico na página do blog, ele será direcionado para uma página que exibe o conteúdo desse item. Isso é chamado de página "única". Seu design exclusivo garante que todo o seu conteúdo tenha a mesma aparência – a única coisa que muda é o conteúdo real (como título da postagem, corpo, imagem em destaque etc.).

Descubra também Como adicionar índice no WordPress com Elementor

Para criar páginas de arquivo e modelos de página exclusivos, você deve usar o construtor visual Elementor - não zonas página ou artigo Padrão do WordPress.

Começar…

  • Abra a interface do Construtor de Temas
  • Vá para a guia Arquivo
  • Clique em Adicionar novo
  • Dê um nome e clique em Criar modelo

Tal como acontece com o cabeçalho e rodapé, você verá uma lista de modelos de página de arquivo. Procure o template “Agência Digital” e insira-o.

Agora você deve ver o design básico da sua página de artigos.

Deve-se notar que se você vir apenas um artigo, é normal, porque o WordPress vem apenas com um exemplo padrão que é “Hello World! ".

Por enquanto, tudo que você precisa fazer é publicar sua página de arquivo e configure-a para ser exibida em todos os arquivos.

Leia nosso guia sobre Como migrar manualmente um site WordPress

Em seguida, você pode acessar o menu de postagens em seu painel e criar novas postagens no blog. Atribua cada item a uma categoria chamada “Novidades".

Agora, quando você for à sua página do Blog, deverá ver automaticamente todas essas novas postagens:

Criação da página de modelo de postagem do blog

Neste ponto, a página do seu blog tem uma aparência bastante amigável. Mas se você clicar em uma postagem de blog específica, o layout não corresponderá ao restante do seu site.

Para resolver esse problema, você precisa criar um modelo "exclusivo" com o Elementor:

  • Construtor visual Open Elementor
  • Vá para a guia Individual Publique
  • Clique adicionar Novo

No pop-up Novo modelo :

  • Dê-lhe um nome
  • selecionar Publique na lista suspensa Selecione o tipo de postagem. Isso diz ao Elementor que você deseja usar este modelo para as suas postagens de blog (ao contrário de Páginas ou algum outro tipo de postagem personalizado que você possa usar)

Mais uma vez, você verá a biblioteca de modelos Elementor. Encontre o modelo de artigo exclusivo do modelo "Agência Digital" e insira-o.

Leia também Modo de manutenção no WordPress: Explicação e configuração

Se desejar, você pode usar os vários widgets de dados de publicação dinâmica para controlar a aparência de sua página.

Por exemplo, se você modificar o widget  Informações da postagem, você poderá controlar os elementos de metadados que aparecem, como na publicação ...

  • Auteur
  • Data de publicação
  • comentários
  • Etc.

Quando estiver satisfeito com o modelo do item, clique em publicar. Em seguida, você pode usar as opções de exibição para que este modelo exclusivo se aplique apenas a postagens na categoria "Além das notícias"

  • Selecione a partir do catégorie
  • Escolha a categoria Novidades

Então aperte Salvar fechar.

Agora, todas as postagens do seu blog devem ter um design que corresponda ao restante do seu site.

Para terminar as coisas, vá para Aparência → Menus e adicione sua página de blog ao menu de navegação. Para fazer isso, você pode adicionar um link para a categoria "Notícias" na seção Categorias.

Página 404

Finalmente, você precisa criar a página 404 do seu site. A página 404 do seu site é o que os visitantes verão se seguirem um link quebrado ou tentarem visitar uma página que não existe.

Descubra também nossa 5 WordPress plugins para gerenciar melhor os erros 404

Para criar sua página 404, use o construtor visual Elementor para adicionar outro modelo exclusivo.

  • Construtor visual Open Elementor
  • Vá para a guia Erro 404
  • Clique adicionar Novo
  • Inserir modelo de agência digital da página 404
página 404 - crie um site completo

Em seguida, publique seu modelo para completar seu site.

Obtenha o Elementor Pro agora!

Conclusão

Então ! Isso é tudo neste guia que mostra passo a passo Como criar um website completo com Elementor. Se você tem comentários ou sugestões, não hesite em nos informar na seção reservada.

No entanto, você também pode consultar nossos recursos, se você precisar de mais elementos para realizar seus projetos de criação de sites da Internet, consultando nosso guia no site Criação de blog WordPress ou aquele em Divi: o melhor tema WordPress de todos os tempos.

Mas enquanto isso, compartilhe este artigo em suas diferentes redes sociais

...