Melhores blocos originais do WordPress [Visão geral rápida]

Trazemos a você um guia sobre como usar o editor e os blocos Gutenberg WordPress. Por favor, leia notícias sobre mudanças de blocos que estão chegando na próxima versão 5.4. Selecionamos todos os blocos de uso mais frequente que devem ser usados em qualquer site. Assim que for lançado, postaremos mais detalhes sobre todos os recursos.

Quando o WordPress anunciou o novo editor Gutenberg em 2018, ficamos entusiasmados com isso. Agora, alguns anos depois, vemos uma grande melhoria. O editor Gutenberg WordPress é uma ótima ferramenta para criar um site.

Todos esses blocos padrão do WordPress para o editor Gutenberg são totalmente funcionais em nosso projeto mais recente Livre Citadela Tema WordPress. Você pode usá-lo em qualquer site, por favor Crie a sua conta aqui e baixe-o gratuitamente.

Com Plug-ins AitThemes Citadela, você pode criar conteúdo específico para apresentação de uma empresa, negócio, blog ou site sem fins lucrativos. Ou até mesmo iniciar um novo negócio online. A velocidade do site e a facilidade de edição do site são os fatores mais importantes.

O que é um bloco?

Os blocos Gutenberg WordPress são unidades de construção do site. Cada um deles tem seu próprio lugar e propósito especial. É muito importante usar o bloco WordPress certo para um determinado tipo de conteúdo.

Mas como você encontra o bloco mais adequado para sua intenção?

Para ajudá-lo a entender melhor os blocos do WordPress, preparamos esta visão geral dos mais populares.

Blocos de conteúdo de texto

Existem vários blocos, que você pode usar para inserir conteúdo de texto em seu site. Você pode usar vários blocos. A partir do WordPress 5.4 há uma nova configuração, você pode alterar a cor do texto.

• Parágrafo
• Cabeçalho
• Citar
• Lista
• Aspas
• Mesa
• Versículo
• pré-formatado

Exceto isso, você usa o bloco Classic, que pode ser mais útil para um parágrafo longo.

Bloco de botões

Criar um botão CTA atraente no WordPress tornou-se super fácil com o bloco de botões. Você não precisa inserir CSS personalizado ou entender HTML. Você pode – mas não precisa – inserir o código hexadecimal de sua cor favorita para tornar o botão bonito e atraente.

Onde usar o bloco de botões?

Uma vez que o visitante da web chega ao seu site, você deseja incentivá-lo a agir. É para isso que servem os botões CTA.

Em geral, existem 3 locais onde você deve usar o bloco de botões do WordPress:

• Página inicial – para concluir a ação que levará ao cumprimento de seu objetivo, como inscrever-se no boletim informativo, descobrir uma oferta especial ou registrar-se para uma avaliação gratuita.
• Página do produto – dependendo de como a página do seu produto é liderada, pode haver 1 botão CTA (COMPRAR) ou mais botões, por exemplo, detalhes do produto, comprar, adicionar à lista de desejos, etc.
• Blog – os botões CTA podem se referir a outro artigo útil ou à compra do seu produto/serviço.

Configurações do bloco de botões

No Inspector, no lado direito, você pode gerenciar facilmente as configurações do seu botão:

• Estilo
• Cor de fundo
• Cor da fonte
• Fronteira

O texto escrito em seu botão CTA deve ser curto e direto, incentivando a ação que você deseja que seus visitantes da web realizem.

Novidades chegando na próxima versão do WordPress 5.4 (lançamento em 31 de março de 2020)

O bloco de botões será substituído pelo novo botãos bloquear.
Você pode assumir com o novo nome que poderá criar mais botões ao lado um a um em um contêiner de bloco. Muitas vezes existe a necessidade de criar dois CTA por vez, por exemplo: Compre Agora e Leia Mais. Além disso, algumas novas configurações de estilo e cor estão chegando. Escolha o estilo de Preenchimento ou Contorno e, em seguida, a cor do plano de fundo. Você pode escolher o fundo Sólido ou Gradiente. Algumas predefinições como ponto de partida estarão disponíveis para um ajuste fino mais fácil. A boa notícia é que todos os blocos de botões existentes estarão funcionando e não há necessidade de migrá-los.

Bloco de colunas

Bloco de colunas é um incrível bloco do WordPress que abre portas para novos layouts. Oferece mais opções de arranjos de elementos de página, resultando em mais alternativas de design.

Trabalhar com o bloco Colunas é fácil:

• Nenhuma instalação de plug-in extra.
• Nenhuma codificação necessária.
• Tudo o que você precisa é um pouco de bom senso para um design elegante.

Em comparação com o hassel anterior que você teve que passar antes do lançamento do editor de blocos do WordPress, é super simples usar o bloco Columns do WordPress.

Como usar o bloco de colunas?

Conforme indicado acima, existem 2 maneiras de usar o bloco Colunas:

• Para organizar o fluxo de seus textos (em um post de blog ou na página normal).
• Para organizar outros blocos em colunas.

Ao organizar o texto em colunas, por exemplo, em uma postagem de blog, você aumenta a legibilidade e torna seu site mais transparente e amigável.

No entanto, quando você usa o bloco Colunas para aninhar outros blocos, como imagens, textos e botões, está alterando todo o layout da página escolhida e criando novos designs.

Configurações do bloco de colunas

Após inserir um bloco Coluna na página, escolha quantas colunas deseja. Pode ser qualquer quantidade de 2 a 6 colunas. Então você pode começar a digitar seu texto ou adicionar blocos em cada coluna.

O alinhamento do conteúdo do seu bloco de colunas pode ser definido separadamente para todo o bloco, bem como para colunas individuais. Você pode até escolher a proporção da largura da coluna. Dessa forma, uma coluna pode ser mais larga que a outra.

bloco de cobertura

Vamos falar sobre o cabeçalho do seu site. É uma seção que define a primeira impressão quando alguém acessa sua página inicial. Meio importante, não é? E você sabia que o bloco Cover pode ser usado como cabeçalho em qualquer uma das suas páginas?

Cover é o bloco central do WordPress que ajuda você a impressionar seus visitantes da web. Especialmente quando é usado corretamente, ou melhor, quando está perfeitamente integrado ao seu web design.

Onde usar o bloco Cover?

Como mencionado acima, o bloco Cover pode ser usado em qualquer uma das suas páginas. Além disso, pode ser adicionado em qualquer lugar da página, ao contrário do cabeçalho do seu site que é fixado no topo do seu site.

Bloco de cobertura pode ser usado como:

• Cabeçalho de qualquer página, incluindo Homepage.
• Imagem ou vídeo substituído por texto usado na página do produto.
• Separador de conteúdo na postagem do blog.

Configurações do bloco de cobertura

A configuração do bloco Cover é muito simples. Primeiro, escolha uma imagem ou um vídeo como plano de fundo. Você também pode usar uma única cor. Depois de definir o plano de fundo, adicione um título e um subtítulo. 

Você pode escolher o alinhamento do bloco e, claro, o alinhamento do texto dentro dele.

O alinhamento do bloco de cobertura oferece as seguintes opções:

• Alinhar à esquerda
• Alinhar Centro
• Alinhar à Direita
• Largura larga
• Largura completa

Meu favorito pessoal é a sobreposição de cores que está disponível no inspetor - a imagem de fundo do bloco de capa pode ser tonalizada para qualquer cor que você desejar. Juntamente com tamanho e cor de fonte personalizados, você pode criar belos contrastes e a aparência final do seu bloco de capa será surpreendente.

No WordPress 5.4, você pode escolher o plano de fundo gradiente em vez de sólido.

Bloco de galeria

Exiba imagens em seu site usando o bloco Galeria. Este bloco padrão do WordPress foi projetado para armazenar suas imagens e exibi-las bem em qualquer página do seu site. Da mesma forma que outros blocos do WordPress, o bloco Gallery pode ser posicionado em qualquer lugar do site ou dentro da postagem do blog.

O upload de suas imagens pode ser feito escolhendo arquivos da biblioteca de mídia, do seu computador ou usando a função arrastar e soltar.

Onde usar o bloco Galeria?

Dependendo do tipo do seu site, você pode querer criar uma galeria de fotos complexa ou uma apresentação de imagens simples. Você pode usar o bloco Galeria em:

• sua página inicial
• Subpáginas individuais criadas como álbuns da sua galeria de fotos
• Páginas de produtos
• postagem no blog

Configurações de bloqueio de galeria

Além das várias opções de alinhamento do próprio bloco Galeria, existem algumas opções interessantes dentro desse bloco, como:

• Número de colunas nas quais as imagens são alinhadas.
• Recorte da imagem para corresponder ao mesmo tamanho (da menor imagem).
• Hiperlink para oferecer a opção de vincular a outra página ou arquivo de mídia.

Bloco de imagem

Bloco de imagem nada mais é do que o bloco para exibir uma imagem em seu site.

Isso mesmo. Se você deseja apenas adicionar uma imagem a qualquer uma das suas páginas, deve usar o bloco Image WordPress. Pode ser semelhante a outros blocos apresentados, mas existem diferenças significativas que o tornam perfeito para imagens individuais.

Quando usar o bloco de imagem?

O bloqueio de imagem deve ser usado especialmente quando o objeto exibido na imagem é particularmente importante para o visitante da web que você deseja:

• Chame a atenção do visitante da web com uma imagem específica.
• Exibir imagem com legenda.
• Mostre infográficos que ajudem os visitantes a entender melhor o assunto discutido.

Configurações de bloqueio de imagem

Uma das maiores vantagens do bloco Image WordPress são as opções de tamanho de imagem. Você pode redimensionar facilmente uma imagem puxando-a pelo canto, escolhendo um tamanho fixo em pixels ou definindo o tamanho em porcentagem.

Outra opção significativa são os campos de entrada para texto alternativo, legenda e link. Eu recomendo fortemente o uso desses campos, pois eles desempenham um papel importante no SEO da página.

Bloco de mídia e texto

Vamos passar para layouts de página mais avançados que você pode criar usando o bloco de mídia e texto. Este bloco central do WordPress permite que você combine mídia e texto lado a lado, de uma forma estética e contextual.

Onde usar o bloco de mídia e texto?

Embora o bloco de mídia e texto seja mais adequado para uso em postagens de blog, com um pouco de imaginação, você também pode usá-lo em outros lugares. Por exemplo, você pode criar uma boa visão geral de um produto ou serviço usando imagem e texto um ao lado do outro.

Não se esqueça de adicionar um bloco de botão à seção de texto do bloco de mídia e texto, se usado como visão geral do produto/serviço. Dessa forma, você pode criar uma boa seção de CTA em qualquer página.

Vantagens do bloco de mídia e texto

• Reunindo imagem e texto que se encaixam contextualmente.
• Evitando o extravio de imagem dentro do blogpost.
• Ajudar na responsividade do site (use a função “Stack on mobile”).

Configurações de bloco de mídia e texto

Ao observar a configuração do bloco de mídia e texto, você notará algumas opções de alinhamento, algumas delas exclusivas, em comparação com a maioria dos outros blocos.

A configuração interessante e útil deste bloco é a cor de fundo. Ao colorir a área ao redor da imagem e do texto que se encaixam, você pode realçar visualmente a conexão entre eles.

Insira um link do WordPress versão 5.4 (31.3.2020). Você pode escolher entre link, arquivo de mídia ou página de anexo.

Bloco de mesa

O bloco de tabela é um dos exemplos de como o WordPress melhorou após a introdução do editor de blocos do WordPress na versão 5.0 e posterior. Considerando que antes você precisava de um plug-in para inserir tabelas em seu site WordPress, agora você pode simplesmente usar o bloco Table.

Onde usar o bloco de mesa?

As tabelas desempenham um papel importante no fornecimento de conteúdo útil de maneira bem organizada e transparente. Certamente, a maioria dos sites usou tabelas. Aqui estão apenas alguns exemplos de uso de tabelas em diferentes sites:

• Comparação de dados
• Tabelas de preços
• Detalhes técnicos do produto
• receitas
• Visão geral dos pacotes de associação

Ter o bloco Table como parte do núcleo gratuito do WordPress é realmente incrível.

Configurações do bloco de tabela

Ao inserir um bloco Tabela na página, você precisa definir um número de colunas e linhas de sua tabela. Não se preocupe, este número não é fixo. Você pode adicionar mais linhas e colunas (ou removê-las) a qualquer momento.

Em seguida, escolha um estilo de sua mesa: padrão ou listrado. Passe para o alinhamento e estilo de fonte e, finalmente, preencha sua tabela antes de adicionar um toque final a ela.

Mais opções incluem:

• Cor de fundo
• Células de largura fixa
• Cabeçalho
• Rodapé
• Link (a entrada de texto em uma tabela pode vincular a outras páginas)

Qual bloco você gostaria de ver a seguir?

Espero que você tenha gostado de ler sobre nossa seleção de blocos centrais do WordPress muito úteis – disponíveis gratuitamente para todos. Por favor, informe-nos sobre quais blocos você gostaria de ler a seguir ou quais funcionalidades você acha que ainda faltam no núcleo do WordPress. Obrigado por ler!