O guia completo para códigos de acesso do WordPress

Antes do editor de blocos do WordPress, os códigos de acesso do WordPress eram uma das melhores coisas para atingir o editor do WordPress para tornar mais fácil adicionar funções de plug-in e tema a páginas, postagens e outras seções de um site WordPress.

Com a mudança para o editor de blocos, o que isso significa para a maioria dos plug-ins e sites mais antigos que ainda estão cheios de códigos de acesso? Os shortcodes do WordPress ainda funcionarão? Existe uma maneira de passar facilmente do uso de códigos de acesso do WordPress para blocos do WordPress?

Vamos descobrir. Neste guia, exploraremos os códigos de acesso do WordPress na era do editor de blocos do WordPress.

O que são códigos de acesso do WordPress?

Um shortcode WordPress é um pedaço de código reutilizável e dinâmico envolto em [colchetes] . Os códigos curtos permitem inserir facilmente funções específicas do próprio WordPress ou de um plugin ou tema em qualquer postagem, página, tipo de postagem personalizada ou widget. Pense nos atalhos do WordPress como “atalhos” ou macros em seu site.

Você pode usar códigos de acesso do WordPress para exibir conteúdo estático que é entediante demais para continuar codificando e repetindo. E você também pode usar códigos de acesso para exibir conteúdo dinâmico, como galerias de imagens, reprodutores de áudio para podcasts, calendários de eventos ou estatísticas de alteração de determinados dados.

Formato de Shortcode

Quando se trata de inserir códigos de acesso, o formato básico [colchetes] pode ser “estendido” de várias maneiras, permitindo que você personalize ou adicione informações de configurações adicionais chamadas atributos . Além disso, os atalhos podem quebrar o texto (ou HTML) ou até mesmo ser aninhados em outro código de atalho.

Por exemplo, um shortcode pode ter os seguintes formatos:

[shortcode]

[shortcode]Some text[/shortcode]

[shortcode]<a href="http://mysite.com/">HTML content</a>[/shortcode]

[shortcode]Some text [another-shotcode] more text [/shortcode]

[shortcode icon="icon: star" background="#eeeeee" color="#F73F43" text_color="#F73F43" size="32" shape_size="16" radius="256" text_size="16" url="#" target="self" margin="0"] This is a custom icon [/shortcode]

Atributos de Shortcode

Os códigos curtos também são flexíveis porque podem ser estendidos com atributos . Com atributos, os códigos de acesso oferecem personalização adicional simplesmente adicionando trechos de código extras dentro do código de acesso.

Plug-ins e temas oferecem guias e rubricas extras para ajudar os usuários a usar os trechos de código de acesso corretos para adicionar ou remover certos elementos na saída.

Aqui estão alguns exemplos de códigos de acesso com atributos.

[[gallery id="123" size="medium"]]

[recent-posts posts="5"]

[recent-posts posts="5"]Posts Heading[/recent-posts]

Códigos de acesso embutidos do WordPress

O WordPress vem com vários códigos de acesso integrados para renderizar certos tipos de conteúdo.

[[audio]]

O código de acesso de áudio permite incorporar arquivos de áudio e reproduzi-los.

[[caption]]

Usado principalmente com imagens individuais, o shortcode da legenda permite que você envolva as legendas em torno do conteúdo.

[[gallery]]

O shortcode da galeria permite que você adicione uma ou mais galerias de imagens aos seus posts e páginas.

[[embed]]

O shortcode de incorporação permite que você envolva itens incorporados com largura e altura máximas (mas não fixas).

[[playlist]]

O shortcode da lista de reprodução implementa a funcionalidade de exibir uma coleção de arquivos de áudio ou vídeo do WordPress em uma postagem.

[[video]]

O shortcode de vídeo permite incorporar arquivos de vídeo e reproduzi-los.

Códigos de acesso de plug-ins e temas

Temas e plug-ins específicos do WordPress têm códigos de acesso prontos para uso que você pode inserir no editor de postagem ou página e renderizará o resultado no front end. Até hoje, muitos temas e plug-ins ainda usam códigos de acesso.

Por exemplo, códigos de acesso são freqüentemente usados ​​em plug-ins comuns para calendários, formulários, tabelas, associações, cronômetros de contagem regressiva ou cotações de puxar. Existem até plug-ins de shortcode que permitem criar códigos de acesso para qualquer coisa.

Os temas do WordPress também podem utilizar códigos de acesso para renderizar determinado conteúdo dinâmico predefinido ou fornecido por eles.

Códigos de acesso personalizados

A maioria dos desenvolvedores especialistas opta por criar seus próprios códigos de acesso, essencialmente reduzindo o tempo que leva para codificar algo que é repetitivo. Tudo o que é necessário é um arquivo adicional simples em seu diretório de arquivos para criar o arquivo custom-shortcodes.php . Se você quiser aprender como criar códigos de acesso personalizados, aqui está um guia sobre como criar códigos de acesso personalizados.

A API de Shortcode do WordPress

Para desenvolvedores que criam seus próprios códigos de acesso personalizados, a API do código de atalho do WordPress fornece um conjunto simples de funções para a criação de códigos de acesso do WordPress para uso em postagens e páginas.

A API Shortcode ajuda os desenvolvedores de plug-ins a criar conteúdo dinâmico que os usuários podem adicionar a páginas ou postagens adicionando o shortcode correspondente na área de conteúdo. Felizmente, a API lida com todas as análises complicadas, eliminando a necessidade de escrever uma expressão regular personalizada para cada shortcode. Além disso, funções auxiliares são incluídas para definir e buscar atributos de shortcode padrão.

Os desenvolvedores podem acessar a documentação da API do WordPress Shortcode para saber mais sobre:

• Atributos de manuseio
• Saída
• Códigos de acesso de fechamento vs fechamento automático
• Referência de função
• Limitações
• Sintaxe formal

Shortcodes no Editor Clássico

No passado, códigos de acesso eram inseridos no editor clássico de qualquer postagem ou página, como este:

O que são blocos do WordPress?

Os shortcodes foram primeiro ... mas depois vieram a edição baseada em blocos. Com a introdução do WordPress 5.0, veio a implementação do planejado editor Gutenberg ou WordPress Block Editor como página principal e editor de postagem do WordPress, substituindo o editor clássico baseado em texto do WordPress que existe há anos.

Aqui está uma olhada no editor de conteúdo anterior ao WordPress 5.5 (ah, aqueles eram os dias!)

O editor Gutenberg foi anunciado pela primeira vez em versões anteriores do WordPress, mas permaneceu opcional até o WordPress 5.0, quando se tornou o editor padrão.

Não há nada inerentemente errado com o novo editor bloqueado. Na verdade, a maioria dos usuários gosta da aparência aprimorada, mais limpa e menos intimidante do back-end do WordPress.

Mas com o editor de blocos do WordPress vieram os blocos do WordPress. As opções de formatação na parte superior se foram, uma reminiscência de aplicativos de processamento de texto como o Microsoft Word. Em vez disso, as opções de formatação foram substituídas pelas opções da barra lateral direita com guias para cada bloco.

Os blocos do WordPress são essencialmente contêineres de conteúdo. Existem muitos blocos diferentes para diferentes tipos de conteúdo - imagens, vídeos, textos, títulos, galerias - você escolhe.

Há até um bloco WordPress para formatação, espaçador e divisor, e eles são organizados casualmente em categorias para fácil acesso.

Todas as opções e controles que estavam no topo agora residem no lado direito do editor de página / postagem, com guias na parte superior indicando se você deseja ver as opções apenas para o bloco atual ou para todo o documento.

O editor de blocos é mais fácil, rápido e amigável. Além disso, os desenvolvedores de tema e plug-in também estão fazendo seus próprios blocos que adicionam mais opções de bloco aos blocos padrão do WordPress.

Blocos reutilizáveis ​​vs. códigos de acesso

A maneira antiga de salvar um conjunto de saídas predefinidas no editor clássico do WordPress era criando seus próprios códigos de acesso. Agora, esse método foi substituído por blocos reutilizáveis .

A capacidade de salvar blocos predefinidos e pré-personalizados também tornou mais fácil salvar o layout e o design de um determinado bloco e usá-lo em outro. Muito parecido com um modelo de página.

Por exemplo, se você adicionar um bloco de botão e estilizá-lo com uma determinada cor, efeitos de foco, etc., você não gostaria de continuar fazendo isso em cada página à qual adicionar esse botão. Se você alterá-lo para um bloco reutilizável, o botão será salvo em seu site WordPress e se tornará seu próprio bloco, que poderá ser usado em outras páginas ou postagens.

Você também pode atualizar ainda mais esses blocos convertendo-os em blocos regulares, salvando-os como um novo (com um novo nome) ou atualizando o design existente do bloco.

Blocos de Grupo

No WordPress 5.3 também veio a introdução de blocos de grupo e modelos.

Essencialmente, você tem a capacidade de agrupar certos blocos e movê-los ou atualizá-los todos juntos. Isso eventualmente deu origem a padrões de bloqueio. Os padrões de bloco tornaram a edição de conteúdo mais fácil, pois os usuários preferem escolher um padrão e atualizar o conteúdo em vez de começar a partir de uma tela em branco.

Opções de estilo de bloco

Cada tema traz diferentes opções de estilo. E normalmente o estilo do conteúdo que você adiciona em cada site é predeterminado pelo seu tema.

Com o editor de blocos, você tem a opção de atualizar o estilo de cada bloco individualmente, seja para se destacar ou para torná-los mais visíveis.

Blocos e edição de site completo

Com todos esses avanços e mudanças na forma como criamos e construímos páginas no WordPress, surge a ideia e a eventual transição para o que é chamado Full Site Editing .

Na colagem, a maioria dos usuários só pode atualizar o corpo real de uma postagem ou página. Certos aspectos do site, como cabeçalho, rodapé, barras laterais e widgets, ainda dependem amplamente do tema. Isso, é claro, tornou a busca pelo tema perfeito com a quantidade certa de opções a luta final para desenvolvedores e usuários do WordPress.

Com o Full Site Editing e a introdução do Block Builder, a tendência é tornar todas as seções de uma página ou postagem editáveis, de certa forma, usando blocos.

Por exemplo, o tema Twenty-Twenty WordPress mais recente segue esse padrão, dando aos criadores e proprietários de sites maior controle sobre seu site e como eles gostariam que ele se parecesse.

Olhando para o futuro, os desenvolvedores de plugins e temas precisarão adotar uma abordagem diferente ao desenvolver seu software para se adaptar à nova experiência completa de edição de site e criação de páginas do editor de blocos do WordPress. Embora a aplicação total disso ainda esteja no horizonte, é uma mudança positiva que provavelmente veremos mais cedo ou mais tarde.

O Novo Bloco de Shortcode

Antes do editor de bloco, os códigos de acesso eram inseridos diretamente na página ou no editor de página. Agora, o editor de blocos do WordPress inclui um novo bloco de shortcode .

O bloco de shortcode torna mais fácil continuar a usar códigos de acesso legados em uma postagem ou página e mantém a integridade da saída do shortcode.

O bloco de shortcode pode ser adicionado a uma página ou postagem clicando no botão Adicionar bloco. Alternativamente, você pode digitar / shortcode e pressionar enter.

Você notará que, ao contrário de outros blocos comuns, o bloco de shortcode não inclui nenhuma configuração específica na barra de ferramentas do bloco ou na barra lateral do editor, provavelmente devido ao fato de que os shortcodes podem ser personalizados usando seus atributos.

O que o Editor de blocos significa para códigos de acesso do WordPress?

O editor de blocos do WordPress tem implicações importantes para códigos de acesso. Vamos cobrir algumas das coisas mais importantes a serem observadas sobre os códigos de acesso do WordPress na era do editor de blocos.

1. O editor de blocos do WordPress muda fundamentalmente a necessidade e a finalidade dos códigos de acesso para a maioria dos plug-ins e temas. Com um sistema de edição baseado em bloco, cada “elemento” na página tem seu próprio bloco, ao invés de estar contido em um editor WYSIWYG editável.

Como o editor de blocos é uma abordagem totalmente diferente para compor uma postagem ou página, as partes mais dinâmicas de uma página que são geradas por códigos de acesso podem existir como blocos que podem ser adicionados individualmente.

2. Os blocos agora podem ocupar o lugar da maioria dos códigos de acesso, eliminando a necessidade de os usuários aprenderem a usá-los. O conceito e o formato dos códigos curtos podem ter uma curva de aprendizado íngreme para alguns usuários, portanto, a abordagem de bloqueio pode ser mais fácil.

Por exemplo, pegue o plugin Gravity Forms. Antes do editor de bloco, o processo para inserir um formulário em uma postagem ou página era diferente. No editor clássico, você tinha que usar um botão para inserir um formulário em seu conteúdo.

Depois de selecionar seu formulário, o código de acesso do formulário foi adicionado ao seu conteúdo. Dependendo das opções selecionadas, o shortcode continha os atributos de título e descrição.

Agora, o plugin Gravity Forms oferece um bloco de incorporação de blocos de formulários . No editor de bloco, selecione o bloco Formulários.

Depois de selecionar o formulário, você terá uma visualização melhor de como o formulário ficará em sua página. As configurações do formulário podem ser encontradas nas configurações de bloco.

3. Os desenvolvedores de tema e plug-in precisarão decidir sobre o futuro de suas implementações de shortcode e converter seus shortcodes em blocos. Conforme mencionado acima, centenas de temas, plug-ins e desenvolvedores ainda usam códigos de acesso em seus sites e aplicativos. A adoção de blocos pode ser lenta, mas à medida que os usuários se familiarizam com o novo editor de blocos, é provável que os usuários solicitem uma opção de bloqueio.

Para aqueles desenvolvedores que ainda estão longe de adotar o sistema de edição de blocos WordPress, o conceito Full Site Editing pode ir de mãos dadas com seus códigos de acesso. Plug-ins como plug-ins de avaliação e classificação, reprodutores de áudio, marcadores de datas, galerias, formulários de contato e quase tudo que ainda usa códigos de acesso ainda estão "no jogo".

4. Os códigos curtos não vão desaparecer tão cedo. É provavelmente por isso que o editor de bloco do WordPress oferece o bloco de shortcode para ajudar a manter o uso de shortcode. Como os códigos de acesso eram amplamente usados ​​e implementados antes do WordPress 5.0 e do editor de bloco, é importante que as versões futuras do WordPress ainda suportem códigos de acesso.

5. Os códigos de acesso podem ser convertidos em um bloco . Tem um tema ou plugin favorito que usa códigos de acesso? É provável que esses códigos de acesso sejam convertidos em um bloco em algum momento. Se você é desenvolvedor de um plugin ou tema, ou constrói sites WordPress e usa shortcodes em um tema customizado, é possível repensar shortcodes como blocos.

Na próxima seção, vamos cobrir brevemente como converter códigos de acesso do WordPress em blocos do WordPress.

Como converter shortcodes do WordPress em blocos do WordPress

Assim como você pode adicionar códigos de acesso personalizados e blocos reutilizáveis, você também pode converter códigos de acesso personalizados do WordPress em blocos do WordPress.

Siga as primeiras etapas deste guia de código de acesso personalizado.

Veja este exemplo básico do Caldera Forms:

 <?php /** * Handler for [cl_post_title] shortcode * * @param $atts * * @return string */ function caldera_learn_basic_blocks_post_title_shortcode_handler($atts) { $atts = shortcode_atts([ 'id' => 0, 'heading' => 'h3', ], $atts, 'cl_post_title'); return caldera_learn_basic_blocks_post_title($atts[ 'id' ], $atts[ 'heading' ]); } /** * Output the post title wrapped in a heading * * @param int $post_id The post ID * @param string $heading Allows : h2,h3,h4 only * * @return string */ function caldera_learn_basic_blocks_post_title($post_id, $heading) { if (!in_array($heading, ['h2', 'h3', 'h4'])) { $heading = 'h2'; } $title = get_the_title(absint($post_id)); return "<$heading>$title</$heading>"; } /** * Register Shortcode */ add_shortcode('cl_post_title', 'caldera_learn_basic_blocks_post_title_shortcode_handler');

Este código pega o ID do post e um nível de título (h2, h3, he) e produz o título do post embrulhado no HTML para o título.

Depois de fazer isso e testar se o código está funcionando, você deve registrar o shortcode como um bloco. Este é o guia passo a passo para converter um atalho do WordPress para um bloco de Gutenberg como exemplo.

Mais recursos sobre a criação de blocos WordPress

Existem vários plug-ins e recursos disponíveis online que podem ajudá-lo a chegar nessa etapa, incluindo a documentação oficial do WordPress sobre como escrever seu primeiro tipo de bloco. Você pode verificar a postagem de Igor Benic e também como criar um bloco para exibição de postagens.

Depois de ler esses guias, você será capaz de descobrir como criar seus próprios blocos de WordPress usando seus códigos de acesso personalizados.

O veredito para códigos curtos do WordPress

Os códigos de acesso do WordPress são e ainda serão uma das partes mais importantes do WordPress. Os códigos curtos têm ajudado muitos desenvolvedores de plug-ins a torná-los mais amigáveis ​​ao usuário e muitos desenvolvedores de temas estendem as funcionalidades de seus temas. Os códigos curtos também reduziram o número de dores de cabeça que muitos criadores de conteúdo e proprietários de sites têm depois de criar seus códigos de acesso personalizados quando se trata de adicionar e atualizar repetidamente o que desejam.

Com isso dito, não há dúvida de que o editor de blocos é o futuro da experiência de edição do WordPress, então espere ver mais desenvolvedores contribuindo para torná-lo melhor e ainda mais cheio de recursos, incluindo aqueles que ainda usam códigos de acesso. Olhando para o futuro, esperamos que mais desenvolvedores façam a transição para usar e adicionar blocos do WordPress em vez de códigos de acesso do WordPress.

Esperamos que você tenha aprendido muito sobre a importância dos códigos de acesso do WordPress, para que servem e quando usá-los. Com sorte, você pode começar a criar seus próprios códigos de acesso personalizados e, eventualmente, seus próprios blocos, os quais certamente não irão desaparecer tão cedo.

Kristen Wright

Kristen tem escrito tutoriais para ajudar os usuários do WordPress desde 2011. Normalmente, você pode encontrá-la trabalhando em novos artigos para o blog do iThemes ou desenvolvendo recursos para o #WPprosper. Fora do trabalho, Kristen gosta de fazer um diário (ela escreveu dois livros!), Fazer caminhadas e acampar, cozinhar e aventuras diárias com sua família, na esperança de viver uma vida mais presente.