O que são padrões de bloco do WordPress e como usá-los?

Publicados: 2022-05-20

Prefácio
Por que você deve se preocupar com os Padrões de Blocos?
O que são Padrões de Bloco no WordPress?
Quais são as vantagens dos Padrões de Blocos?
- Velocidade de desenvolvimento
- Design único
- Base de código confiável
- Reutilização
- Liberdade creativa
Como usar padrões de bloco
- Usando a Biblioteca de Padrões de Blocos do Editor Gutenberg
- Usando o diretório de blocos do WordPress
- Usando padrões de bloco baseados em temas
Como criar padrões de bloco
Conclusão

Há alguns anos, o WordPress introduziu uma nova maneira de criar páginas da web. Essa inovação é conhecida como Gutenberg , alternativamente conhecido como editor de blocos do WordPress ou simplesmente editor do WordPress. O Gutenberg fornece uma maneira simples para qualquer pessoa criar conteúdo rico de maneira fácil. Ele faz isso com WordPress Blocks e WordPress Block Patterns.

Os blocos são a pedra angular do poder de Gutenberg. Como o brinquedo infantil amado, os blocos do WordPress permitem que você construa uma página empilhando-os da maneira que desejar. Você pode tirar os que não quiser e é fácil começar de novo se não gostar do que construiu.

Você pode usar blocos para adicionar vídeos, imagens e designs criativos ao seu site sem habilidades técnicas ou de codificação. Mais fácil ainda, você pode usar uma coleção de blocos, conhecidos como Padrões de Bloco, para dar ao seu site um layout pronto para uso. Personalize esses Padrões de Bloco com seu conteúdo e pronto!

Hoje, o projeto Gutenberg evoluiu para um nível totalmente novo. À medida que continua a evoluir, está abrindo caminho para o próximo Full-Site Editor, que virá com a atualização do WordPress 6.0 no final deste mês, oferecendo uma maneira de aplicar Blocks a todas as partes do seu site, em vez de apenas postagens e páginas. Construir sites incríveis e editá-los ao longo do tempo será ainda mais fácil! Falaremos mais sobre isso em um próximo post.

Por enquanto, vamos falar sobre WordPress Block Patterns, o que eles fazem e por que eles são importantes para você…

Por que você deve se preocupar com os Padrões de Blocos?

Mesmo os sites mais bonitos precisam de atualizações de vez em quando, mas acompanhar as demandas cada vez maiores dos negócios on-line apresenta um problema. Você precisa fazer as alterações rapidamente, mesmo que não saiba codificar.

Se você está começando do zero, acaba em uma situação semelhante. Você precisa montar seu site rapidamente. Como proprietário de um site, você quer se concentrar na criação de conteúdo e ganhar dinheiro, e definitivamente não quer perder tempo lutando com código. No entanto, criar um novo design pode levar dias ou até semanas.

É aí que entram os padrões de bloco: eles permitem que você construa seu site de maneira rápida e bonita. Você pode tentar diferentes combinações de blocos para ver o que funciona melhor para você. Como você descobrirá, existem centenas de ideias disponíveis para você.

Por outro lado, se você não usa padrões de bloco, pode ser forçado a aprender a codificar. Mesmo se você usar um tema premium do WordPress, terá que editar o código de back-end para atender às suas necessidades. O tempo necessário para fazer alterações pode ser maior do que você pode pagar e seu orçamento aumentará se você contratar um profissional para cuidar disso para você.

Padrões de bloco eliminam muito dessa dor – editar seu site se torna (ousamos dizer) muito divertido. Você escolhe vários padrões, tenta várias combinações e rapidamente tem um site funcional que impressiona seus visitantes.

O que são Padrões de Bloco no WordPress?

Padrões de bloco do WordPress são combinações pré-construídas de blocos que você pode alterar como desejar. Você pode ter um padrão que representa uma página da Web completa ou pode selecionar um que represente uma seção do seu site, como um menu de ícones sociais. Você não precisa saber como codificar para usá-los e, graças aos recursos de edição do Gutenberg, você tem controle sobre a aparência do padrão no final.

Quais são as vantagens dos Padrões de Blocos?

Padrões de Gutenberg e blocos são conceitos relativamente novos. Tradicionalmente, os sites WordPress são criados com construtores de sites ou criando um modelo do zero. Embora essas abordagens funcionem muito bem, elas geralmente exigem treinamento extensivo ou experiência em codificação para obter os melhores resultados. Muitos usuários do WordPress também reclamam que os criadores de sites criam páginas desajeitadas que demoram muito para carregar.

Padrões de bloco vêm com uma nova abordagem e vantagens exclusivas. Eles são um trunfo tanto para iniciantes quanto para web designers experientes. Vamos examinar os benefícios mais críticos.

Velocidade de desenvolvimento

A vantagem mais importante é a velocidade com que você pode construir um site sem conhecimento de codificação. Como os padrões de bloco são pré-fabricados, você só precisa escolher os que deseja. Coloque-os na página e reorganize-os até ficar satisfeito com a aparência do seu site.

Padrões de bloco permitem fácil personalização. Você pode usar suas imagens preferidas e aplicar cores que combinem com sua marca. Você terá um site funcional pronto para impulsionar seus negócios em alguns dias, até mesmo horas!

Design único

Esse benefício é importante para qualquer proprietário de site que não queira um design de site simples. Você pode reorganizar os padrões de bloco com base em suas necessidades específicas. Escolha, misture e reorganize os padrões de blocos até encontrar a combinação que você gosta. Você acabará facilmente com um site exclusivo que se destaca da concorrência.

Base de código confiável

Provavelmente, você não quer gastar seu tempo codificando. Ainda assim, você quer confiar que seu site é robusto. Seu site deve ficar ótimo em todos os dispositivos, com diferentes tamanhos de tela. Padrões de bloco resolvem esse problema por design.

A maioria dos padrões vem de desenvolvedores que são apaixonados por seu trabalho. Esses profissionais valorizam suas reputações. Então, quando você escolhe um padrão de bloco, você pode relaxar sabendo que ele está bem codificado e testado.

Você descobrirá que os padrões também têm benefícios de velocidade e desempenho. O tempo de carregamento do seu site afeta seu SEO, então isso pode ter um impacto no seu tráfego. Em particular, os padrões de bloco tendem a ser mais leves e mais otimizados do que muitos temas criados com construtores de sites populares.

Reutilização

Outro aspecto divertido de usar padrões de bloco é que você pode reutilizá-los. Se você tiver sites diferentes, esse recurso é muito útil. Você também pode redirecionar seus padrões em diferentes páginas do seu site.

Se você cria sites para outras pessoas, usar padrões de bloco pode ser a diferença entre cumprir um prazo e perder um cliente. Salve seus padrões favoritos e personalize-os para cada site que você criar.

Liberdade creativa

Um dos benefícios mais atraentes dos padrões de bloco é a liberdade criativa que você obtém. Um site construído a partir de um modelo força você a permanecer dentro de um conceito. Para pessoas que gostam de se expressar, isso pode ser irritante. Mas, com padrões de blocos, você pode explorar ideias diferentes com facilidade.

Tudo o que você precisa fazer é percorrer as muitas bibliotecas de padrões ricas disponíveis para você. Você pode escolher entre as opções que se adaptam a todos os orçamentos; muitos padrões são gratuitos. A melhor parte é que você não precisa se comprometer com nenhuma combinação. Se você mudar de ideia, poderá explorar uma nova ideia com apenas alguns cliques.

Você pode encontrar padrões de bloqueio para qualquer seção do seu site; menus, postagens em destaque, rodapés e cabeçalhos, tabelas de preços e muito mais! Você ficará surpreso com o que pode fazer sozinho, sem a necessidade de nenhuma habilidade técnica.

Como usar padrões de bloco

Usando a Biblioteca de Padrões de Blocos do Editor Gutenberg

A maneira mais fácil é acessar a biblioteca de padrões de blocos em seu editor Gutenberg. Aqui estão os passos básicos.

  • Clique no botão azul “mais” no canto superior direito do seu editor.
    Inserção de bloco de alternância de padrões de bloco do WordPress
  • Em seguida, clique na guia "Padrões". Você verá uma seleção de padrões que você pode escolher.
    Selecionar guia de padrões
  • Clique no padrão desejado e ele aparecerá no editor.
    Editar padrão de bloco
  • Agora você pode tornar o padrão seu ajustando-o para atender às suas necessidades.
    Editar padrão de bloco

Usando o diretório de blocos do WordPress

Você também pode visitar o WordPress Block Pattern Directory em wordpress.org/patterns. Este diretório contém uma extensa coleção de padrões que você pode começar a usar imediatamente.
Diretório de padrões de bloco do WordPress

Os padrões são organizados com base na funcionalidade que eles fornecem. Você pode encontrar layouts de página, galerias, designs baseados em vídeo e muito mais. Você pode ver quais são os mais recentes. Ou, se preferir, você pode classificá-los por popularidade.

Há também uma lista com curadoria de padrões em destaque. Essa é uma seleção de alguns dos melhores designs que você pode encontrar. Todos eles são de uso gratuito e podem ser usados ​​em sites comerciais.

Depois de selecionar um padrão na biblioteca, passe o mouse sobre a imagem de exibição. Você verá um botão que diz "Copiar". Clique nele e cole-o no Editor Gutenberg. Se você tiver experiência com codificação, também poderá colá-lo em seu editor de código favorito para fazer alterações.

Alternativamente, clique na miniatura para visualizar o padrão. Isso mostrará como o design fica em uma página da web. Você verá um botão azul que permite copiar o padrão para uso em seu design. Depois de copiar o padrão, abra seu editor Gutenberg. Clique para indicar onde você deseja que o padrão apareça. Cole-o e você pode ajustá-lo ao seu gosto.

Usando padrões de bloco baseados em tema

Alguns temas dão acesso a coleções exclusivas de padrões. Estes podem ser gratuitos ou pagos. Cada tema difere um pouco na forma como os padrões são adicionados ao seu site. Em geral, você deve ver uma opção para navegar pelos designs. Você pode então importar o padrão desejado para sua página.

Como criar padrões de bloco

Se você estiver à altura da tarefa, crie um padrão de bloco personalizado. Um layout personalizado é a melhor abordagem se você tiver uma ideia exclusiva que não está disponível em nenhuma biblioteca. Essa opção também faz sentido se você gosta de criar algo só seu.

O primeiro passo na criação de um padrão de bloco é decidir a que propósito ou função ele servirá. Este é um padrão que você usará em todas as suas páginas? Você precisa de um layout que usará para exibir seus produtos em seu site? Tire algum tempo para descobrir isso e anote seus pensamentos.

Então, você quer ter um esboço do que vai entrar no padrão em um pedaço de papel. Não se preocupe com o quão bom parece. Você não precisa criar uma obra-prima artística. Um layout simples do que você deseja é mais que suficiente. O que importa é que você tenha clareza sobre o que está tentando criar. Esta etapa também economizará seu tempo.

Suporte WordPress 24 horas por dia, 7 dias por semana

de especialistas reais do WordPress

SABER MAIS

A etapa final é criar o código para seu padrão de bloco. A maneira mais fácil de fazer o processo é usar um plugin. Vá para o repositório de plugins do WordPress. Digite a palavra-chave “padrões de bloco” como sua frase de pesquisa. Você verá vários plugins que permitem criar padrões. Experimente alguns deles para ver qual se adapta ao seu fluxo de trabalho preferido.

Se sua ideia for muito complicada para um plugin manipular, você ainda poderá criar seu padrão de bloco. O desafio é que, se você não estiver familiarizado com codificação, precisará contratar alguém para ajudá-lo com isso. Mas você ainda pode ter suas próprias ideias e instruir seu desenvolvedor sobre o que deseja. O WordPress Codex fornece documentação detalhada sobre como codificar um padrão de bloco.

Depois de terminar de criar seu padrão, você pode compartilhá-lo com a comunidade, tornando-o parte da Biblioteca de Padrões de Blocos do WordPress. Esta é uma ótima maneira de contribuir. Faça login na sua conta do WorPress.org e siga as instruções se quiser compartilhar seu padrão de bloqueio.

Conclusão

Padrões de bloco no WordPress tornaram a construção de sites acessível a pessoas de todos os níveis de habilidade. Você não precisa de muito dinheiro para ter um site que possa se destacar entre a concorrência. Seu site tem um design único mais rápido do que nunca. Você também ganhará a confiança de que está trabalhando com um código criado especificamente para o ecossistema WordPress. Os padrões de bloco continuarão evoluindo. Então, quando você os usa, você faz parte do progresso natural dessa tecnologia.

Graças aos padrões de bloco do WordPress, você pode se concentrar na criação de conteúdo. Chega de perder o sono se preocupando com como você vai construir seu site!

Tudo o que você precisa fazer é selecionar um bom host WordPress, configurar seu site, selecionar o tema e começar a construir as páginas mais rápido do que nunca com Block Patterns.

Como seu próximo passo, dê a si mesmo algum tempo para experimentar. Brinque com as ideias e veja o que mais lhe agrada. Se você não estiver pronto para começar a construir seu site, explore algumas das bibliotecas de padrões de blocos. Percorra os designs e veja o que está disponível para você. É apenas uma questão de tempo até você se sentir inspirado.

Claro, pode haver uma curva de aprendizado se esse conceito for novo para você. Isso é perfeitamente normal. A boa notícia é que não existem regras rígidas e rápidas. Você decide como deseja usar os padrões de bloco de uma maneira que atenda às suas necessidades e pode começar hoje mesmo!

Desempenho na Web

O tempo de carregamento é importante! Você sabe a velocidade do seu site?

SABER MAIS