Se você quiser crie uma página de blog com Elementor, você tem um par de opções sólidas, dependendo do seu orçamento Uma página de blog dedicada mantém suas postagens organizadas, ajuda o Google a indexar seu conteúdo e dá aos visitantes uma razão para ficar por aqui por mais tempo.
Você não precisa escrever nenhum código para isso Com o Elementor Posts widget (Pro) ou um plugin gratuito como Complementos Mestres para Elementor, você pode construir um costume Página do blog Elementor isso combina com sua marca.
Este tutorial abrange dois métodos para crie uma página de blog no WordPress com Elementor:
- Método 1: Usando o widget Elementor Pro Posts (pago)
- Método 2: Usando o widget Master Addons Blog (gratuito)
Há uma tabela de comparação no final para que você possa ver exatamente o que cada opção oferece Eu também gravei um passo a passo de vídeo, se você preferir isso.
Por que seu site WordPress precisa de uma página de blog
Sua página de blog é o único lugar onde todos os seus posts aparecem Os visitantes podem navegar por artigos, tutoriais, notícias e atualizações de um URL Para os empresários, ele puxa o tráfego de pesquisa orgânica Para os blogueiros, é basicamente todo o ponto do site.
Um bom Design de página do blog WordPress faz algumas coisas por você:
- Tráfego SEO & gt indexes conteúdo fresco mais rápido quando ele é organizado em uma página de blog adequada.
- Sessões mais longas – layout do blog Elementor com miniaturas, trechos e categorias, os visitantes clicam em mais postagens em vez de saltar.
- Autoridade 1900 regularmente em um tópico faz de você o recurso de referência em seu nicho.
- Conversões & posts lead leitores para seus produtos, serviços, ou lista de e-mail.
Fora da caixa, o WordPress apenas empilha postagens em ordem cronológica inversa Não há muito para olhar Com a direita Widget do blog Elementor, você pode trocar isso por grades, layouts de cartões, carrosséis e muito mais, tudo sem código.
Antes de começar: pré-requisitos
Você precisará de algumas coisas prontas antes de começar:
- WordPress instalado na sua hospedagem (qualquer versão recente funciona)
- Plug-in Elementor instalado e ativado (versão gratuita do WordPress.org)
- Algumas postagens de blog publicadas 6 posts precisam de pelo menos 3-6 para que a página do blog tenha conteúdo para exibir Adicione imagens em destaque a cada post para obter o melhor resultado visual.
- Um conjunto de homepage estático 0 para Configurações > Leitura e selecione “A static page.” Defina sua página inicial e crie uma página separada para postagens.
Para o Método 1, você precisará Elementor Pro. Para o Método 2, você só precisa do grátis Plugin Master Addons, que funciona com a versão gratuita do Elementor.
Tutorial em vídeo: Crie uma página de blog com o Elementor
Se o vídeo é mais sua praia, este passo a passo mostra como fazer faça uma página de blog no Elementor usando o widget Master Addons Blog do início ao fim.
OK, vamos aos dois métodos.
Método 1: Crie uma página de blog com o widget Elementor Pro Posts
Se você tem Elementor Pro, já tens o Posts widget (às vezes listado como o elemento “Posts” no painel) É a própria ferramenta da Elementor para exibir postagens de blog em qualquer página.
Passo 1: Adicione o Widget de Postagens à Sua Página
Abra a página onde deseja que seu blog apareça no editor Elementor No painel de widgets à esquerda, procure por “Posts” e arraste o Posts widget na seção da sua página.
O widget irá imediatamente puxar em seus posts publicados e exibi-los em um layout padrão.
Passo 2: Escolha sua skin de layout
Elementor Pro oferece três skins de layout para você escolher:
- Clássico 0 skin por omissão Mostra as publicações numa grelha limpa com imagens, títulos, metadados e excertos em destaque.
- Cartões & quot; uma caixa em estilo de cartão em torno de cada post com um efeito de sombra sutil.
- Conteúdo Completo Êxitos mostra o conteúdo completo da postagem em vez de apenas um trecho.
Por omissão, a skin Clássica mostra uma grelha de 3 colunas com 6 posts Poderá ajustar isto de 1 a 6 colunas e definir qualquer número para posts por página.
Passo 3: Configurar as Configurações de Layout
O Guia Layout é onde você disca como seu Página do blog Elementor na verdade parece:
- Posição da imagem & ergue a imagem em destaque no topo, esquerda, ou escondê-lo completamente.
- Tamanho e proporção da imagem & pick as dimensões de miniatura direita para o seu design.
- Tag título 2 Set a tag HTML (H2, H3, H4, etc) para títulos de post Isso importa para SEO.
- Excerto Comprimento 0 excerto de quantas palavras do post são mostradas.
- Metadados (Escolha quais metainformações exibir: nome do autor, data, hora e comentários).
- Ler Mais Texto ” Mais texto do botão “Read More.
Etapa 4: Configurar consulta e paginação
O Guia Conteúdo possui duas seções importantes: Consulta e Paginação.
Consulta permite controlar quais postagens aparecem na página do seu blog Você pode filtrar por tipo de postagem, categorias, tags ou IDs de postagem específicos Você também pode incluir ou excluir certas postagens dos resultados.
Paginação controla como os usuários navegam por várias páginas de postagens. Três opções estão disponíveis:
- Números (1, 2, 3...)
- Setas anteriores/próximas
- Números + Anterior/Próximo combinados
Passo 5: Estile o layout do seu blog
O Guia estilo possui quatro seções para ajustes visuais:
- Layout 0 gap da coluna, gap da linha, e alinhamento do conteúdo.
- Caixa & estilo de borda, raio de borda, preenchimento, e sombra de caixa para cada cartão postal.
- Imagem Âmbito de borda e espaçamento em destaque para imagens.
- Conteúdo 1 tipografia, cores e espaçamento para títulos de postagens, metadados, trechos e o link Leia mais.
Dica: Use espaçamento e tipografia consistentes em toda a página do blog Defina o mesmo raio de borda para imagens e cartões para criar um visual polido Combine a cor do link Read More com a cor de destaque da sua marca.
Essa é a abordagem Elementor Pro. Funciona bem para básico Grade do blog do elementor layouts, mas você chegará aos limites rapidamente: sem carrossel, sem efeitos de hover, apenas 3 skins.
Se você quiser mais opções sem pagar pelo Pro, vale a pena dar uma olhada no próximo método.
Método 2: Crie uma página de blog com elementor usando complementos mestres (gratuito)
O Widget Mestre Addons Blog (rotulado “MA Blog” no editor) é gratuito e embala em mais opções de layout do que o widget Elementor Pro Posts. 21 variações de layout, animações de hover, um carrossel embutido, filtragem avançada É um dos mais completos Widgets do blog Elementor lá fora.
Passo 1: Instale e Ative complementos mestres
Agarrar Complementos Mestres para Elementor do WordPress.org (gratuito).Após a ativação, você verá o elemento “MA Blog” aparecer no painel de widgets do Elementor.
Passo 2: Adicione o widget do blog e escolha um layout
Arraste o Blog MA widget na sua página Por padrão, ele mostra um layout de blog clássico em uma grade de 4 colunas.
É aqui que fica interessante Você fica três tipos de layout:
- Grade Layout de grade padrão para páginas de blog limpas e organizadas
- Cartão design de cartão Elevated com sombras e bordas
- Lista Layout de lista de notícias ou revistas, ótimo para blogs de notícias ou revistas
Cada tipo de layout possui 7 variações de estilo únicas, dando-lhe um total de 21 designs diferentes de páginas de blog (mais suporte de alvenaria).Pode alternar entre eles com um único clique.
As 7 variações de estilo incluem: Padrão, Sobreposição de Conteúdo, Meta Superior Esquerdo, Cartões de Alinhamento Direito, Cartões de Alinhamento Central, Alinhamento Central com Fundo de Gradiente e Cartão de Banner. Misture-os com layouts de grade, cartão ou lista para construir um verdadeiro página de blog personalizada no Elementor.
Passo 3: Configurar as Opções de Exibição
Você obtém controle granular sobre como as postagens do blog aparecem:
- Pedido Postal & erl por data, título, data modificada, ou aleatório.
- Colunas 1 a 6 colunas.
- Ícone pós-formato ícones para diferentes formatos de postagem (vídeo, áudio, galeria).
- Separador Meta (Escolha o caractere que separa os meta itens (tubo, ponto, traço).
- Título HTML Tag (H2, H3, H4, etc.).
- Tipo de postagem Êxitos regulares, tipos de postagem personalizados ou páginas.
- Espaçamento entre linhas e colunas & tune as lacunas entre os posts.
- Alinhamento Conteúdo  esquerda, centro, ou direita-align seu conteúdo post.
- Postagens por página 0 quantas postagens mostrar por página.
- Paginação Ção possível ou desativar a navegação da página.
Passo 4: Configurar opções de miniaturas
É aqui que os Master Addons se aproximam do Elementor Pro. O painel de miniaturas permite:
- Activar ou desactivar as imagens em destaque
- Defina uma altura personalizada para miniaturas
- Escolha a posição da miniatura (superior, esquerda, direita)
- Escolha de 26 efeitos de animação hover (Pendure, pulse, empurre, estoure, flutue, afunde e muito mais)
- Aplicar 16 efeitos de cor (Flushing, Sépia, Escala de Cinza, Brilho, etc)
- Selecione de 5 formas de miniaturas (Padrão, arredondado, círculo, borda de gradiente e muito mais)
Na captura de tela acima, EU tenho a animação de hover “Hang”, efeito de cor “Flushing” e forma de miniatura “Gradient Bordered” aplicadaPoucos detalhes como esses são o que separam uma página de blog de aparência genérica de uma que realmente se parece com alguém projetou o seu Página do blog Elementor de propósito.
Etapa 5: Configurar metadados de postagem
Sob Configurações de postagensvocê controla quais metainformações aparecem em cada postagem do blog:
- Postar título (mostrar/ocultar)
- Imagem do avatar do autor
- Nome autor
- Data de publicação
- Categorias
- Contagem de comentários
- Comprimento do trecho (definir a contagem exata de palavras)
- Leia mais texto (totalmente personalizável)
- Mostrar conteúdo completo vs trecho
Passo 6: Use Filtragem Avançada
O Configurações Avançadas painel é onde você reduz exatamente quais postagens aparecem:
- Exclua postagens específicas 1 Rem de certas postagens por ID da página do blog.
- Filtrar por tag 100 postagens com certas tags.
- Filtrar por autor (útil para blogs com vários autores).
- Compensar  Skip os primeiros N posts. Handy quando tiver apresentado um post separadamente.
- Abra na nova guia 1 Make blog post links abertos em uma nova guia do navegador.
Passo 7: Habilite o Carrossel de Postagem do Blog
Você provavelmente já viu sites que mostram suas últimas postagens em um carrossel de rolagem na página inicial O widget Master Addons Blog tem isso embutido Alternar o Carrossel do blog Elementor ligado e configure-o:
- Reprodução automática & quot; role automaticamente em uma velocidade definida por você.
- Estilo navegação Çostar entre pontos ou setas.
- Posição da seta é setas de navegação dentro ou fora do carrossel.
Combine o carrossel com Configurações Avançadas para filtrar postagens específicas (como “featured” ou “editors pick” tags) e coloque-o em qualquer lugar do seu site, não apenas na página do blog.
Importante: Certifique-se de que você habilitou “Load Font Awesome 4 Suporte” de Elementor > Configurações. Caso contrário, os ícones de seta no carrossel não serão exibidos corretamente.
Passo 8: Estile sua página de blog
O Guia estilo abrange todos os ajustes visuais:
- Miniatura (brilho, saturação)
- Título e Meta 0 tipografia, cor do texto, e cor do hover
- Conteúdo 0 cor, cor de fundo, tipografia, sombra de caixa, preenchimento, e margem de conteúdo
- Caixa Cor do fundo, borda e sombra da caixa para todo o cartão postal
- Paginação 0 Tipo, cor do estado normal, cor do estado de h, borda, e enchimento
Entre esses controles, você pode combinar o seu layout do blog Elementor à marca do seu site até ao pixel Cores, tipos de letra, espaçamento, sombras, tudo ajustável a partir do painel Elementor.
Elementor Pro Posts Widget vs Master Addons Blog Widget
Aqui está tudo disposto lado a lado para que você possa ver qual Widget do blog Elementor se encaixa na sua situação.
| Característica | Elementor Pro Posts Widget | Master Addons Blog Widget (Gratis) |
|---|---|---|
| Preço | Requer Elementor Pro (US$ 59/ano+) | Grátis |
| Variações Layout | 3 skins (Clássico, Cartas, Conteúdo Completo) | 21 variações (7 estilos x 3 tipos de layout) |
| Tipos Layout | Apenas grade | Grade, cartão e lista |
| Maçonaria | Sim | Sim |
| Efeitos de Hover de Miniatura | Nenhum | 26 animações de hover + 16 efeitos de cores |
| Formas de miniatura | Apenas raio fronteiriço | 5 formas (Padrão, Arredondado, Círculo, Borda de Gradiente, etc) |
| Opções Metadados | Nome do Autor, Data, Hora, Comentários | Autor Avatar, Nome do Autor, Data, Categorias, Tags, Contagem de Comentários |
| Filtragem de consulta | Tipo de postagem, Incluir/Excluir | Tipo de postagem, Filtrar por tag, Filtrar por autor, Exclusão de postagem, Offset |
| Paginação | 3 tipos (Números, Anterior/Seguinte, Combinados) | Números + Prev/Next com texto personalizável |
| Carrossel | Não disponível | Carrossel completo com autoplay, controle de velocidade, setas ou pontos |
| Abrir na Nova Guia | Não | Sim |
| Ícones pós-formato | Não | Sim |
Para páginas básicas do blog, o widget Elementor Pro Posts faz o trabalho Se você precisar de efeitos de hover, um carrossel ou apenas mais design da página do blog WordPress variedade, o widget Master Addons Blog cobre tudo isso gratuitamente.
Dicas para um melhor layout do blog do elementor
Algumas coisas que aprendi ao construir páginas de blog para dezenas de sites WordPress:
1. sempre use imagens em destaque
Um post sem uma imagem em destaque aparece como um retângulo em branco na grade do seu blog Parece quebrado Defina uma imagem em destaque para cada post, mesmo que seja um gráfico de marca simples Se os tamanhos dos arquivos são uma preocupação, aqui está o nosso guia sobre o melhores plugins otimizador de imagem WordPress.
2. Mantenha trechos curtos
Trechos longos desordenam a grade e empurram posts abaixo da dobra 15-25 palavras é suficiente para dizer aos leitores o que o post cobre O objetivo é levá-los a clicar, não ler a coisa toda da página do blog.
3. use contagens consistentes de colunas
Três colunas funciona melhor para a maioria das páginas do blog Duas colunas é bom para sites de conteúdo pesado com trechos mais longos Quatro colunas funciona quando você tem muitos posts curtos com imagens em destaque forte E uma vez leitores clicar através de um artigo completo, ajudá-los a ficar lá & n o leitor de leitores melhor plugin de índice para WordPress adiciona links de salto para que postagens longas sejam fáceis de percorrer.
4. defina tags de título adequadas
O título da página do seu blog deve ser H1. postar títulos dentro da grade do blog deve ser H2 ou H3 Isso ajuda os motores de busca entender sua estrutura de página Para mais dicas de SEO, leia o nosso melhores práticas de SEO para Elementor guia.
5. Adicionar categorias aos metadados
Mostrar categorias em seus metadados de postagem ajuda os visitantes a encontrar conteúdo relacionado O widget Blog Master Addons permite exibir categorias diretamente sob cada título de postagem.
6. Teste em dispositivos móveis
Visualize a página do seu blog no celular e tablet antes de publicar Uma grade de 3 colunas empilha para 1 coluna em telas pequenas, o que é bom, mas às vezes o espaçamento ou tamanhos de fonte se desprendem após o colapso Dê-lhe um scroll-through rápido em seu telefone Para mais controle, verifique o nosso guia em design responsivo com pontos de interrupção Elementor.
7. Use um carrossel em sua página inicial
Colocar um carrossel do blog Elementor na sua página inicial, além da própria página do blog Dessa forma, cada visitante vê suas últimas postagens logo quando pousa, mesmo que nunca clique em “Blog” no nav. O widget Master Addons Blog tem o carrossel embutido, então leva cerca de 30 segundos para configurar.
Perguntas frequentes
Posso criar uma página de blog com a versão gratuita do Elementor?
Sim. Enquanto o Elementor gratuito não inclui um widget Posts, você pode usar o Widget Mestre Addons Blog que funciona com a versão gratuita do Elementor Ele lhe dá 21 variações de layout, efeitos de hover, suporte de carrossel e filtragem avançada sem nenhum custo.
Como adiciono uma página de blog à navegação do meu site Elementor?
Crie uma nova página no WordPress (chame-a de “Blog”), projete-a com o Elementor usando o widget Posts ou o widget Master Addons Blog e, em seguida, adicione essa página ao seu menu de navegação por Aparência > Menus Você também pode usar o Construtor de temas Master Addons para criar um cabeçalho personalizado com sua navegação.
Quantas postagens de blog devo exibir por página?
6 a 12 posts por página é o ponto ideal para a maioria dos sites Menos de 6 podem fazer a página parecer vazia, enquanto mais de 12 aumenta o tempo de carregamento e sobrecarrega os visitantes Habilitar a paginação para que os leitores possam navegar por posts mais antigos.
Posso mostrar postagens de blog de uma categoria específica na página do blog do Elementor?
Sim. Ambos os Complementos Elementor Pro e Master suportam a filtragem de postagens por categoria Em Complementos Master, use o painel Configurações Avançadas para filtrar por tag, autor ou excluir postagens específicas Isso permite construir várias páginas de blog para diferentes tópicos.
Qual é o melhor layout de blog Elementor para SEO?
Um layout de grade com imagens em destaque, postar títulos usando tags H2/H3, trechos curtos, metadados de categoria e paginação adequada é o melhor para SEO Certifique-se de que a página do seu blog carregue rapidamente otimizando imagens e usando um tema Elementor Leve.
Pensamentos Finais
Edifício a página de blog personalizada no Elementor leva cerca de 10-15 minutos com qualquer método O widget Elementor Pro Posts lida bem com o básico se você já tiver uma licença Pro.
Para mais opções de layout, o Widget Mestre Addons Blog oferece 21 variações de layout, 26 animações de hover, 16 efeitos de cores, um carrossel e filtragem avançada de postagens. Isso é suficiente para crie uma página de blog com Elementor parece que contrataste um designer.
Funciona com a versão gratuita do Elementor também. Baixar Master Addons e teste.
Se algo não estiver funcionando corretamente durante a configuração, deixe-nos uma mensagem e vamos resolver isso.
Leitura relacionada:
