Fala minha gente!! Trago até vocês mais um artigo sobre desenvolvimento, dessa sobre WordPress! (Atendendo o pedido do Phelipp de Avila, que me segue no Twitter)

Segundo a documentação oficial sobre widgets do WordPress você deve criar Widgets utilizando um modelo de classe definido por eles, que é o que vou ensinar no artigo de hoje.

Nesse exemplo, iremos criar um widget de “Sobre o autor”, que pode ser inserido no sidebar geral do blog (ou num sidebar específico para posts)… Esse widget irá verificar se estamos em um post (que o WordPress chama de single), e caso estejamos, irá exibir o nome, o avatar e a descrição do autor do post, todos esses dados vindos diretamente do banco de dados do WordPress.

A preparação

Antes de tudo, você vai precisar separar seu widget em três métodos dentro de uma classe:

• Um método para gerar e exibir o HTML que aparecerá na lateral do seu blog/site
• Um método que será usado para gerar e exibir o HTML do formulário que aparecerá no painel de controle do blog/site
• Um método que será usado para salvar os dados vindos desse formulário

Sabendo disso.. vamos começar a nossa classe:

Lembrando que a sua classe DEVE estender a classe WP_Widget, do próprio WordPress.

Agora vamos inserir quatro métodos vazios para deixar a estrutura da classe pronta:

Método form()

Agora vamos começar pelo método form(), que exibe o formulário… Esse widget não precisaria de formulário e opções pois ele não tem nenhum tipo de configuração, mas vamos deixar uma coisa opcional como exibir o link do site do autor.

O nosso método form() ficará da seguinte forma:

Eu sei que parece complicado, mas estamos apenas criando um parágrafo com um checkbox e um label… Para definir o ID e o name do input utilizamos recursos do próprio WordPress, assim não caímos no problema de usar um name que já exista… O resultado é um checkbox onde você pode decidir se exibe ou não o link do autor no widget.

Logo no começo do método pegamos uma informação da instância atual do widget, assim caso estejamos editando um widget, saberemos a opção salva no banco de dados.

Método update()

Agora vamos partir para o método update(), que salva os dados e configurações do widget (nesse caso, apenas o checkbox) no banco de dados.

Esse método precisará retornar os dados a serem salvos no banco de dados, ficando assim:

Mais uma vez, não tem mistério: sobrescrevemos os valores de $instancia_antiga (o que estava salvo no banco de dados) com os valores de $nova_instancia e retornamos esses dados “mesclados” para serem salvos no banco de dados.

E pra finalizar, o método mais importante…

Método widget()

Esse método será responsável por mostrar os dados (HTML) do widget na lateral do seu blog… Vamos fazê-lo passo-a-passo:

Esse widget irá funcionar apenas nas páginas de post… então precisamos evitar que ele seja exibido nas outras páginas, dessa forma:

Agora vamos trazer alguns dados sobre o autor:

Feito isso é só começar a exibir o HTML do Widget:

E o nosso widget está pronto!

Agora você precisa de apenas uma linha para habilitá-lo no seu painel de controle:

Espero que tenham gostado! Agora é só você editar o CSS do seu blog para deixar o widget bem apresentável. ;)

Faça o download do código-fonte completo do widget: /arquivos/widget_sobre-autor.class.phps

Gostou do artigo? Criou um widget pro seu blog? Comente como foi! Diga o que você conseguiu fazer! :)

Um grande abraço e até a próxima!