DE{CODE}: Temas modernos e o futuro do WordPress: trabalhando com edição completa de sites e além

Publicados: 2023-02-12

O WordPress 5.9 introduziu o Full Site Editing no núcleo, significando uma grande mudança na forma como construímos sites com o WordPress. Nesta sessão DE{CODE}, junte-se ao advogado do desenvolvedor do WP Engine, Nick Diego, enquanto ele descompacta essas alterações, bem como algumas maneiras de aproveitá-las para criar sites melhores - a maneira moderna do WordPress.

Vídeo: Trabalhando com edição de site completo e além

Slides da Sessão

Modern Theming & The Future of WordPress- Working with Full Site Editing and Beyond.pdf do WP Engine

Transcrição de texto completo

NICK DIEGO : Olá, bem-vindo ao “Trabalhando com edição completa de sites e o futuro dos temas modernos no WordPress”. Meu nome é Nick Diego e sou um defensor do desenvolvedor aqui na WP Engine. Então, um pouco sobre mim, comecei a trabalhar com o WordPress em 2012. Eu era principalmente um desenvolvedor de plug-ins e, desde então, fiz a transição para fazer muito com temas de blocos. Na verdade, entrei no WP Engine em novembro de 2021, então esse é um novo show para mim. Sou apaixonado por blocos e padrões e tudo sobre edição de site completo, e é por isso que não poderia estar mais animado para fazer esta apresentação hoje.

Então, o que é edição de site completo? Ouvimos muito sobre isso nos últimos anos. Portanto, na verdade, é “uma coleção de recursos que traz a experiência familiar e a extensibilidade dos blocos para todas as partes do seu site, em vez de apenas postagens e páginas”. Na verdade, é um conjunto de recursos, que inclui itens como o Editor do site, Estilos globais, blocos de temas, modelos e, é claro, Temas de blocos.

Portanto, em nossa conversa de hoje, abordaremos algumas coisas diferentes. Vamos começar com o básico. Quero ter certeza de que estamos todos na mesma página, especialmente do ponto de vista da terminologia. Em seguida, falaremos sobre a anatomia de um tema de bloco, depois estilos globais, configurações que incluem o arquivo theme.json. E, finalmente, vou compartilhar meus pensamentos sobre temas modernos e como eles serão.

Então, na apresentação de hoje, vamos usar vários exemplos diferentes, e esses serão do tema 2022, que foi incluído no WordPress 5.9 em janeiro de 2022. Este é um tema de bloco que foi desenvolvido pelo Core Equipe WordPress, e é um ótimo lugar para começar, e está disponível no repositório de plugins, então não há melhor tema para usar como exemplo.

Então, ao começarmos hoje, novamente, vamos começar com o básico. E não há nada mais básico do que um bloco. Portanto, se você usa o WordPress nos últimos anos, provavelmente está familiarizado com os blocos. Eles são a unidade fundamental de conteúdo no WordPress. Pode ser um parágrafo de texto para uma galeria de imagens. Pode assumir quase qualquer forma. E a ideia por trás da edição completa do site é que, em breve ou agora, tudo no seu site será um bloco. Discutiremos mais sobre como isso funciona.

Agora, aqui temos um exemplo de vários blocos diferentes que estão atualmente no WordPress. Você deve estar familiarizado com as duas colunas da esquerda. Temos parágrafos e cabeçalhos e blocos de cobertura – e assim por diante. No 5.9 – novamente, que foi lançado este ano – agora temos o que chamamos de blocos temáticos. Esses são blocos de conteúdo que, tradicionalmente, você não conseguiria editar diretamente no WordPress.

Isso inclui coisas como o logotipo do site, loop de consulta, trecho da postagem, autor da postagem. Esses são todos os tipos de conteúdo que você precisaria para mergulhar em seus arquivos de modelo baseados em PHP e codificar diretamente ou usar um plug-in de terceiros que o ajudasse na edição dessas áreas. E todos eles estão chegando ou chegaram ao WordPress e permitem que os usuários os editem diretamente, e todos eles assumem a forma de um bloco.

Em seguida, queremos falar sobre padrões. Os padrões são uma espécie de pedra angular da experiência de edição de site completo. Os padrões podem ser uma conversa inteira em si mesmos, mas vamos dar uma prévia dos padrões se você não estiver familiarizado. Novamente, um padrão é apenas uma coleção predefinida de blocos que formam um layout específico. Um padrão pode ser um único bloco com algum estilo. Pode ser vários blocos.

Os padrões permitem que os usuários, com um único clique, insiram um design inteiro diretamente em seu site, em vez de ter que criar o design manualmente, um bloco por vez, o que pode realmente acelerar o desenvolvimento de um site. Também é muito útil se você se lembrar - você vê este lindo site de demonstração, e tem todo esse conteúdo lá. E você instala o tema e pensa, bem, como faço para obter essa demonstração? Os padrões resolvem isso para você porque o autor do tema pode fornecer um monte de layouts de página ou designs individuais que, com um único clique, um usuário pode inserir e obter aquela demonstração que viu e pela qual foi atraído quando escolheu o tema.

Então, vamos dar uma olhada rápida em um padrão aqui. Temos apenas um título simples, algum texto e alguns botões. E isso pode ser, novamente, inserido com um único clique na página, e vemos aqui que é composto de três blocos diferentes, um bloco de título, um bloco de parágrafo e um bloco de botões.

Agora com o 5.9, novamente, que saiu este ano, vimos a introdução do Pattern Explorer. Portanto, o tema de 2022, que mencionei anteriormente, aquele que estamos usando em todos os nossos exemplos, é chamado de tema Incubadora – muitos pássaros. E você pode ver aqui no Pattern Explorer, temos vários designs diferentes que os autores do tema criaram.

Então, como usuário, posso inserir qualquer um deles diretamente no site e obtenho a mesma estética para a qual o autor do tema projetou o tema, sua série de palestrantes, alguns pássaros lado a lado - o que você quiser. E os padrões, e os padrões que são servidos com um tema, são muito importantes para a experiência de edição de site completo.

Em seguida, temos o Editor. Não podemos deixar de falar do Editor. Se você usa o WordPress, provavelmente está muito familiarizado com isso. Mas eu quero mencionar isso porque o Editor teve muitos nomes diferentes no passado – Editor de Bloco, Gutenberg, O Editor de Gutenberg. Para os propósitos desta discussão, vamos apenas chamar o Editor. Esse é o nome oficial dele, e será o que você verá aqui. Novamente, isso foi introduzido no WordPress 5.0 no final de 2018.

Portanto, dentro do Editor, basta clicar no Insertor e inserir seus blocos e padrões. Agora, eu queria mostrar a tela porque a seguir precisamos falar sobre o Site Editor. Eventualmente, o prefixo do site do Editor do Site provavelmente desaparecerá e teremos apenas o Editor. Mas o Site Editor é uma experiência coesa que permite editar e navegar diretamente entre vários modelos, partes de modelos, opções de estilo e muito mais.

Então, basicamente, o Editor do Site leva nosso editor padrão com o qual nos acostumamos nos últimos anos e o leva para o próximo nível, permitindo que os usuários editem áreas adicionais do seu site que agora são todas alimentadas por blocos. Assim, o WordPress 5.9 introduziu a edição completa do site e, com isso, o Editor do Site. E no 6.0, que será lançado em maio, veremos muitos aprimoramentos, o que é muito empolgante.

Portanto, se você estiver usando um tema de bloco como 2022, poderá acessar o Editor do site. Existem duas maneiras diferentes, a barra lateral superior e a seção de aparência. Agora, o Editor do site, novamente, porque faz parte do– é muito poderoso, está disponível apenas para administradores. Portanto, não se preocupem, editores, eles não poderão acessar o Editor do site. Você precisa ser um administrador para acessar o Editor do Site.

E uma vez que entramos aqui, ele se parece muito com o editor padrão, mas você notará algo um pouco diferente. No topo aqui, temos Home. E isso nos diz que, na verdade, estamos editando o modelo home.HTML, e temos algumas áreas diferentes da página que podemos editar separadamente. Como você pode ver aqui, temos o cabeçalho e o rodapé.

Portanto, isso é algo que você nunca poderia fazer antes. Você nunca poderia editar o home.PHP, mas agora o modelo HTML diretamente da interface, não sem alguma outra extensão de terceiros.

E se clicarmos na página e na exibição de lista, podemos ver que temos um loop de consulta. Novamente, esses temas de construção familiares provavelmente são muito, muito, muito familiares com a construção de loops dentro de modelos para temas, mas aqui podemos fazer tudo isso com blocos usando o loop de consulta. E também podemos ver alguns desses outros blocos temáticos, como o título da postagem, a imagem em destaque, o trecho da postagem e a data da postagem. Todos eles podem ser movidos e modificados pelo usuário a partir da interface sem necessidade de codificação.

Agora, se você clicar em um pequeno ícone do WordPress ou ícone do site, podemos obter esta barra lateral. E então podemos ver que temos acesso a todos os nossos modelos e partes do modelo. Agora, quero observar que o fluxo– todas essas telas estão totalmente em desenvolvimento. A edição completa do site ainda está na versão beta, e muitos refinamentos e melhorias virão. O que estamos vendo hoje pode não parecer o mesmo daqui a seis meses, mas é um começo fantástico.

Então, se descermos para os modelos, podemos ver todos os modelos que estão incluídos no 2022. Você deve ver alguns familiares, como Página e Índice e Início e 404. E então, se formos para nossas partes de modelo, podemos ver alguns personalizados partes do modelo que foram incluídas pelos autores do tema. Portanto, temos alguns cabeçalhos diferentes e um rodapé.

Agora, novamente, todos eles são editáveis ​​pelo usuário. E assim, se virmos este pequeno ponto aqui, podemos ver que esta parte do modelo de cabeçalho foi editada por mim. Agora, quando você edita uma peça de modelo ou um modelo, essas alterações são salvas no banco de dados. Na verdade, eles não modificam os modelos em seu tema, o que é ótimo porque você sempre pode voltar aos modelos de tema ou às partes do modelo.

Mas, novamente, se clicarmos aqui, podemos começar a editar essa parte do modelo de cabeçalho e você verá que tudo isso é feito de blocos. Portanto, é a mesma experiência que você usaria no Editor ao editar uma postagem ou página. Você pode fazer isso agora dentro do Editor do Site para todos os seus modelos e partes do modelo.

Esse foi um rápido resumo do Editor de site e como ele funciona, mas agora quero falar sobre a anatomia de um tema de bloco, que é o principal componente fundamental da edição de site completo. Então, como funciona a anatomia de um tema de bloco? Bem, na verdade é dividido em algumas categorias diferentes. Portanto, temos temas de bloco. Eles adotam totalmente a edição de site completo. Os modelos de tema são compostos inteiramente de blocos. Modelos e partes de modelo são HTML em vez de PHP.

E quero observar que um tema de bloco pode ser muito simples. Tudo o que ele precisa fazer é consistir em um arquivo style.CSS e um arquivo index.html, bem como um arquivo index.PHP. Este arquivo PHP é uma espécie de resquício do desenvolvimento tradicional do tema WordPress e provavelmente desaparecerá no futuro.

E, finalmente, a maioria dos temas de bloco inclui um arquivo theme.JSON. Falaremos sobre isso separadamente. É um tópico muito importante sobre configurações e estilos globais. Então, vamos dar uma olhada na estrutura do arquivo do tema. Portanto, este é 2022, uma versão resumida da estrutura de arquivos dentro de 2022. E podemos ver os arquivos necessários aqui.

Também notamos que existem algumas pastas, ou seja, Templates e Template Parts. Dentro de cada uma dessas pastas, você tem todos os arquivos HTML para cada modelo e parte do modelo. O que não está visível aqui, o que é realmente empolgante, então eu queria inserir isso, Gutenberg, o plug-in do Gutenberg, onde toda essa edição futura de desenvolvimento completo do site está sendo feita, recentemente introduziu uma nova pasta chamada Padrões. Então você pode realmente colocar seus arquivos de padrão dentro da pasta Pattern, e o WordPress irá registrá-los para você. Apenas uma espiada. Recomendo fortemente que você verifique o Gutenberg e todos os novos recursos.

Mas voltando ao slide aqui. Temos nossos modelos e peças de modelo. E você pode ver os arquivos HTML individuais para cada um. Agora, para entender um pouco mais como isso funciona, vamos dar uma olhada no arquivo 404.HTML. Este é um arquivo ou uma página em seu site que você nunca poderia editar diretamente, a menos que mergulhasse no código ou usasse um recurso de terceiros que permitisse editar este modelo.

Voltando ao Editor do Site, podemos ver que nossa página 404 está bem aqui. Se clicarmos nele, o usuário agora pode editar os diferentes componentes desse modelo. No entanto, vamos dar uma olhada em qual código HTML real compõe esse modelo, o código que realmente está no tema.

Aqui, podemos ver que temos nosso arquivo 404.HTML, e ele tem várias marcações. Começando pela parte superior e inferior, vemos que temos a especificação para um bloco de peça modelo. O que isso está fazendo é referenciar nossas partes de modelo registradas e puxá-las para o modelo. Então, se voltarmos aqui, podemos ver que temos uma parte footer.HTML e uma parte header.HTML. E é isso que está sendo referenciado aqui.

Portanto, este é um bloco exclusivo que permite extrair modelos compostos por outros blocos. Agora, é claro, você pode simplesmente incluir todos os blocos que compõem um cabeçalho e todos os blocos que compõem um rodapé, mas ao fazer referência à parte do modelo, você pode fazer tudo em um só lugar e aplicar a mesma parte do modelo em todos os seus modelos, semelhante ao que você faria em um WordPress tradicional com PHP.

Agora, conforme olhamos mais adiante, temos algumas marcações, apenas algumas marcações principais, e então temos um div. Não vou me aprofundar muito nisso. Há algumas coisas interessantes acontecendo aqui, ou seja, o layout aqui, é verdade, que está fazendo algumas configurações de layout, mas isso é apenas uma marcação geral para a página, o padrão 404.

Agora, eu mencionei padrão. O 404 neste tema é, na verdade, agrupado em um padrão. Portanto, todos os blocos que compõem o conteúdo 404 estão em um padrão. E então temos um bloco de padrão que está realmente referenciando esse padrão e, em seguida, puxando esses blocos. Agora, é claro, novamente, você poderia apenas incluir todos os blocos que compõem a página 404 aqui, mas, ao colocá-los em um padrão e, em seguida, fazer referência a eles, isso apenas torna um pouco mais fácil de gerenciar.

Portanto, quando voltamos ao Editor do site, temos nosso conteúdo e podemos ver as diferentes seções. Então, a parte superior é aquela parte do modelo de cabeçalho sendo puxada. E então, obviamente, a seção principal é aquele padrão 404 sendo puxado. E agora, como todos esses são blocos, tudo o que precisamos fazer é editá-los como normalmente . Podemos torná-lo ousado. Poderíamos mudar a cor. Poderíamos remover blocos, adicionar blocos – e assim por diante.

Muito fácil e não precisamos editar nenhum código. Precisávamos entender como o código funcionava, mas não precisávamos tocar em nenhum código. Então, quando estivermos felizes, basta clicar em Salvar. Novamente, essas alterações são salvas no banco de dados, então você não está realmente modificando os arquivos do tema. Portanto, se revertermos as alterações, voltaremos ao que o tema estiver fornecendo.

Uma das grandes coisas sobre o Site Editor também – e novamente, isso ainda está sendo desenvolvido – é que você pode adicionar novas partes de modelo. Então, novamente, este tema adiciona vários cabeçalhos e rodapés diferentes, mas e se quiséssemos adicionar mais? Talvez quiséssemos uma barra lateral. Talvez quiséssemos diferentes seções de conteúdo. Podemos fazer isso diretamente no Editor do Site.

E, novamente, esse fluxo será aprimorado - mais recursos, mais funções. Mas atualmente está funcional e você pode adicionar tudo aqui. Uma coisa a observar é que você ainda não pode adicionar modelos no Editor do site. Você pode usar uma interface diferente dentro do editor do WordPress, mas ainda não no Editor do Site. Mas isso vai acontecer.

Então, a última parte disso é que falamos sobre fazer todas essas mudanças. Bem, e se você pudesse exportar todas as suas alterações como um único tema que realmente está chegando e é realmente muito interessante ver como isso afetará o desenvolvimento do tema. Assim, com a versão mais recente do Gutenberg, agora você pode exportar todas as suas alterações, além do tema original.

Eles são mesclados e você pode exportá-lo como um novo tema com todas as suas alterações aplicadas aos arquivos dentro do tema. Então você pode imaginar pegar 2022. Você faz o upload. Você faz todas as suas alterações. Você pode modificar alguns modelos e depois exportar um tema completo. Tem algumas implicações muito interessantes para o desenvolvimento futuro do tema.

Agora precisamos falar sobre configurações e estilos globais. Este é o arquivo theme.JSON. Isso é totalmente novo no WordPress e tão empolgante quanto complicado. Então, se olharmos para o tema de 2022, podemos ver aquele arquivo lá no topo. E quando entramos no arquivo theme.JSON, são na verdade cinco seções, sendo uma delas apenas o número da versão.

E falarei brevemente sobre templates customizados e partes de templates. Então é aqui que, se você tiver um modelo personalizado, um modelo totalmente personalizado, que o WordPress não reconheceria naturalmente, é onde você pode registrá-lo aqui. Também é aqui que você registra todas as partes do modelo, como cabeçalhos e rodapés. Qualquer template tradicional, como Index, Page, Post– aqueles templates que o WordPress geralmente reconhece– você não precisa colocar aqui, apenas customizados e, claro, suas próprias partes do template.

Mas a essência do theme.JSON são suas configurações e seção de estilo. Portanto, se olharmos primeiro para as configurações, há muita coisa acontecendo aqui. E, novamente, isso é muito resumido. Mas a parte superior são as configurações globais. Essas são as configurações que afetam o Editor do site e o Editor em todo o site. Isso inclui coisas como borda, cor e tipografia. É aqui que você definiria a paleta de cores do seu tema, as configurações de tipografia do seu tema, as fontes - e assim por diante.

E também temos configurações de nível de bloco, onde você pode, digamos, definir uma paleta de cores para todo o site, mas definir uma paleta de cores menor e uma paleta de cores completamente diferente, por exemplo, para o bloco de parágrafo ou o bloco de botões. Portanto, ele fornece uma enorme flexibilidade, mas as configurações são os recursos disponíveis para um usuário no Editor ou em um bloco.

Então, se olharmos novamente para a cor, definimos aqui nossa paleta. Temos uma cor de primeiro plano, um plano de fundo e, em seguida, o primário, preto, branco e uma espécie de verde floresta. E então, se entrarmos no Editor, podemos ver que quando nosso seletor de cores aparece, temos essas cores definidas para um usuário selecionar.

Agora, vamos ao estilo. Então estilos são basicamente como seu CSS. Tradicionalmente, você adicionaria todo o seu CSS em um arquivo styles.CSS ou alguma outra configuração. Mas a seção de estilos do theme.JSON permite que você defina o estilo no nível do bloco e também no nível global em todo o seu tema. Pense nisso como padrão, certo, porque o Editor - o ponto principal é que os usuários podem entrar lá e começar a modificar e fazer alterações e projetar seu site como quiserem usando blocos.

Mas é preciso haver um padrão, e isso é definido na seção de estilo do theme.JSON. Então, novamente, temos os estilos globais, como nossas cores globais, tipografia global, e também podemos definir estilos no nível do bloco. O problema dos estilos globais é onde definiríamos a cor de fundo do nosso tema. É aqui que definimos os tamanhos de fonte para nossos cabeçalhos, as diferentes opções de tipografia para links, texto, cabeçalhos e todo esse tipo de coisa. E no nível do bloco, podemos fazer o mesmo, mas especificamente para blocos.

Agora, uma das coisas interessantes sobre a seção de configuração de que acabamos de falar é que sempre que você cria uma configuração, o WordPress define uma variável. Então, quando estávamos olhando para essa paleta de cores, definimos fundo, primeiro plano e primário. O WordPress vai realmente gerar uma variável que mapeia para esse código hexadecimal, qualquer que seja o código hexadecimal definido para primário, primeiro plano, plano de fundo.

Em estilos, podemos usar essas variáveis ​​para definir os estilos para estilos globais e de nível de bloco. O benefício disso é que, se um usuário mudar qualquer que seja a cor do plano de fundo, ela fluirá pela especificação de estilo em theme.JSON. Agora, se dermos uma olhada na seção de blocos, aqui temos nosso bloco de botões, e temos isso de um designer de tema.

Eu queria que meus botões tivessem uma cor padrão de verde com algum texto em branco. Você pode ver que na seção de cores do bloco de botões, definimos que a cor de fundo é a primária, que é verde floresta, e nosso texto é o fundo, que é branco. Assim, podemos usar essas variáveis ​​em theme.JSON para definir estilos para nossos blocos e para o próprio site.

Agora, isso se relaciona com estilos globais, aos quais aludi anteriormente. Então, de volta ao Editor do site, se clicarmos neste pequeno círculo de dois tons na parte superior, abriremos nosso painel de estilos globais. Agora, há muita coisa acontecendo aqui, então vou apenas fazer uma demonstração rápida de como isso funciona. Mas saiba que eu encorajo você a baixar o tema de 2022 ou outro tema de bloco e explorar verdadeiramente os estilos globais.

E se entrarmos aqui e olharmos as cores, clicarmos nelas, agora podemos ver que está ali a paleta de cores, aquela que nos dá o tema, assim como alguns elementos diferentes, como nosso fundo, texto e links . Agora, neste painel que estamos vendo aqui, estamos editando os elementos globais do site. Por exemplo, falamos sobre o plano de fundo do site. No momento é branco. Então, se eu clicar em Background, posso entrar aqui e ver que está selecionado como branco. Essa é a cor que definimos em theme.JSON.

Mas e se eu realmente gostar dessa cor de pêssego? Bem, com um único clique, posso clicar e lá vamos nós. A cor de fundo do nosso site agora é pêssego. Portanto, isso dá ao usuário um controle sem precedentes para modificar completamente seu site para atender às suas necessidades. Mas, novamente, theme.JSON está fornecendo o padrão que, como desenvolvedor de tema, você fornece ao usuário e, em seguida, ele pode começar a partir daí.

Essa foi uma breve visão geral da edição completa do site, do Editor do site e dos temas de bloco. Mas quero dedicar algum tempo e falar sobre meus pensamentos sobre o futuro dos temas modernos. Portanto, quando pensamos em temas modernos, acredito que temas modernos enfatizarão o design em detrimento do desenvolvimento. Agora, você pode estar pensando, bem, criar temas é sempre sobre design.

Mas se você pensar no desenvolvimento do tema tradicional, havia muita codificação real que precisava ser feita. Todos os arquivos de modelo eram PHP, o que exigia uma quantidade significativa de conhecimento de WordPress, bem como desenvolvimento de PHP para fazer e acertar. Bem, isso é meio que mudando. Vemos que agora com o Editor, você pode criar temas diretamente na interface do usuário do Editor do site e do editor tradicional.

E isso vai ser um papel importante na forma como projetamos os temas. Portanto, sou um desenvolvedor defensor do WP Engine e, em nossa equipe, estamos construindo um tema experimental chamado Frost. E quando fazemos um novo padrão ou queremos modificar um modelo, não estamos entrando nos arquivos e ajustando os arquivos. Entramos no Site Editor ou no Editor e modificamos esse padrão, ou construímos um padrão ou um modelo. E então estamos felizes com isso, estamos exportando e colocando no tema.

Portanto, não estamos realmente codificando. Na verdade, estamos fazendo tudo visualmente. E o benefício disso é que sabemos que um usuário, as pessoas que vão usar o tema, também estarão lá ajustando o padrão ou ajustando o modelo. E então faz sentido, enquanto estamos construindo o tema, estamos fazendo o mesmo processo que um usuário faria para usar o tema, o que eu acho que é simplesmente mágico.

E isso levará a um método de desenvolvimento de tema de código baixo ou mesmo sem código. Agora, é claro, estamos em uma conferência de desenvolvedores, certo? E então estamos falando de nenhum código e baixo código. Mas meu último ponto, falaremos sobre onde eu acho que está o desenvolvimento. Mas acho que isso é realmente empolgante porque vai trazer uma nova geração de usuários, pessoas que querem construir seu próprio tema, personalizar seu próprio tema, mas talvez não conheçam PHP, talvez não conheçam JavaScript .

Eles podem fazer tudo isso agora no Editor do site, que eu acho que é uma espécie de espírito do WordPress, democratizando a publicação. E acho que a edição de site completo está realmente se esforçando para isso. E nos últimos dois anos ou no ano passado, francamente, vimos tanto progresso com a edição completa do site. Está ficando muito emocionante. Então, eu realmente acredito que a edição completa do site é o futuro do WordPress tradicional.

Agora, pode não ser para todos. Eu quero deixar isso bem claro. E há muito desenvolvimento que ainda é necessário. Então, quando falamos sobre diferentes tipos de pessoas que usam o WordPress, temos tudo, desde o usuário padrão até as agências. E as agências podem querer fornecer uma interface muito limpa e estruturada para seus clientes usarem e trabalharem em seus sites. Isso pode não ser uma edição completa do site. Acho que está tudo bem.

Mas, como estamos vendo na economia, temos Squarespace, Wix e Element, ou outros construtores de páginas. Há um enorme contingente da comunidade de usuários da web que deseja uma ferramenta que lhes permita e os capacite a editar e projetar seu próprio site. E acho que o WordPress realmente está faltando no WordPress, especialmente no Core. E acho que esse é o objetivo da edição de site completo e essa é a promessa da edição de site completo.

Tanta coisa para fazer. Ainda uma tonelada para fazer. Ainda há muitas coisas que precisamos descobrir, ou seja, coisas como controles responsivos e como podemos restringir diferentes componentes da interface do usuário para que certos usuários não estraguem os designs ou modifiquem coisas que não deveriam. Então, muitas coisas ainda para descobrir.

Mas uma das áreas que considero realmente empolgante é o desenvolvimento para edição em site completo. Agora que temos essa ferramenta que permite aos usuários criar seu próprio tema ou criar seu próprio site, precisamos começar a pensar em como podemos levar isso para o próximo nível. Como desenvolvedores, como podemos desenvolver isso? Se pensarmos no WordPress tradicional, pegue a tela do widget – widgets em geral. O WordPress forneceu um nível muito básico de widgets e funcionalidades, e os desenvolvedores saíram e criaram todos os tipos de extensões.

E acho que a mesma ideia precisa ser aplicada à edição completa do site. No momento, existem muito poucas, se houver, extensões e plug-ins que realmente aproveitem a edição completa do site e a levem para o próximo nível. O WordPress continuará iterando na edição completa do site e chegará a um ponto. Mas nunca vai fazer tudo o que todo mundo quer, e acho que agora é a hora de levar a sério a edição de site completo e começar a pensar sobre as maneiras que podemos construir sobre isso como desenvolvedores e realmente trazer essa experiência para o próximo nível.

Então eu desafio todos a sair, explorar Gutenberg, experimentar o tema 2022 e instalá-lo, começar a aprender o desenvolvimento de blocos. Há uma quantidade inacreditável de oportunidades para blocos de nicho. E tente construir seu próprio tema. Tente pegar 2022. Tente modificá-lo. Tente construir seu tema base. É realmente agradável e há muito potencial para essas coisas.

Então, eu quero parar por aqui e agradecer a sua presença. E antes de ir, quero falar sobre alguns recursos que considero realmente importantes, especialmente nesta apresentação, se você é novo na edição de site completo e deseja aprender mais. Então, novamente, você pode, é claro, me seguir. Eu twitto sobre isso o tempo todo.

Mas existem alguns recursos. Então o primeiro é Frost. Eu aludi a isso anteriormente. Portanto, este é um tema que as relações com desenvolvedores do WP Engine estão construindo. E é um produto experimental. Eu não deveria dizer produto. É um experimento, onde estamos tentando usá-lo para educar a comunidade sobre como construir temas de blocos. Estamos aprendendo ao longo do caminho. Estamos fazendo muitas alterações e atualizações ao longo do caminho, tentando nos manter atualizados com o WordPress, mas é um ótimo recurso. Além disso, novamente, o tema de 2022 – um lugar fantástico para começar e aprender.

Em seguida, quero conectar o Learn WordPress. Isso é aprender.wordpress.org. A equipe de treinamento do wordpress.org está trabalhando muito para tentar educar e trazer muitos desses conceitos ao público. Portanto, se você estiver interessado e quiser aprender mais, é um lugar fantástico. Temos oficinas e todo tipo de conteúdo diferente por lá, inclusive espaços sociais de aprendizagem. Estes são realizados semanalmente, onde falamos sobre diferentes tópicos, mergulhos profundos em como codificar um bloco para como construir um tema de bloco - e assim por diante.

E então, é claro, se você estiver interessado em desenvolvimento, sempre comece com o manual do editor de blocos. Foi aí que comecei, e existem tantos recursos excelentes. E então, finalmente, Gutenberg. Se você não está familiarizado com o Gutenberg, eu o encorajo a se familiarizar com o Gutenberg, especialmente se você estiver interessado no desenvolvimento do WordPress. E é um ótimo lugar para mergulhar, explorar como a edição de site completo está sendo construída, como diferentes blocos estão sendo construídos e como você pode aplicar isso aos seus próprios fluxos de trabalho.

Então, muito obrigado por participar. Espero que você tenha aproveitado bastante desta apresentação e seja encorajado a continuar explorando a edição completa do site. Muito obrigado.