Marcelo Mesquita

Apenas mais um desenvolvedor WordPress

Criando Widgets

No WordPress o sistema de widgets permite que usuários comuns ativem funcionalidades no site sem precisar, necessáriamente, entender HTML, CSS, PHP, etc. Mas para isso, esses usuários precisam que desenvolvedores se dediquem um pouco mais para tornar seus produtos (plugins, temas, etc) aptos a trabalhar dessa forma.

Para adicionar um widget, basta criar uma uma função e informar para o WP que aquela função deve ser tratada como um widget. Isso é feito da seguinte forma:

register_sidebar_widget('Nome do Widget', 'sua_funcao', 'sua_classe');

É tão simples quanto parece, o ‘Nome do Widget’ é o identificador do widget, ‘sua_funcao’ é a função que deve ser chamada quando esse widget estiver ativo e ‘sua_classe’ é opcional e se refere ao nome da classe css que deve ser inserida nesse widget.

Para que o seu widget se adeque ao tema é importante lembrar sempre de usar o modelo de widget definido no próprio tema para conter o conteúdo de sua função. Esse modelo é sempre embutido em forma de argumento na sua função, você só precisa usá-lo. Um exemplo vale mais do que mil palavras, então vejamos como ficaria:

sua_funcao(<span style="color: #880000;">$args</span>)
{
  print <span style="color: #880000;">$args['before_widget']</span>;
  print <span style="color: #880000;">$args['before_title']</span> . "Nome do Widget" . <span style="color: #880000;">$args['after_title']</span>;
  print "conteúdo de seu widget";
  print <span style="color: #880000;">$args['after_widget']</span>;
}

Agora que você sabe que é fácil, não tem desculpa para não utiliza-lá em seus plugins. Assim, os usuário não precisarão fazer edições no template, para usufruir dos benefícios de seus plugins, além de tornar mais simples o seu controle.

Juntando o que você aprendeu até agora sobre criar um plugin mas o que você acabou de aprender sobre criação de widget e um pouco de criatividade, já é possível fazer algumas coisas interessantes. Que tal um plugin que mostre no sidebar os posts mais quentes:

&lt;?php
/*
Plugin Name: Posts mais quentes
Description: Lista posts mais comentados
Version: 0.1
Author: Marcelo Mesquita
Author URI: http://www.marcelomesquita.com/
*/

// Posts Mais Quentes
function posts_mais_quentes($args)
{
  global $wpdb;

  // Recuperando os posts
  $hot_posts = $wpdb-&gt;get_results("SELECT ID, post_title, comment_count FROM {$wpdb-&gt;posts} ORDER BY comment_count DESC LIMIT 5");

  // Usando o modelo de widgets do tema
  print $args['before_widget'];
  print $args['before_title'] . "Mais Quentes" . $args['after_title'];

  print "&lt;ul&gt;";

  // Listando os posts mais quentes
  foreach($hot_posts as $hot_post)
    print "&lt;li&gt;&lt;a href='" . get_permalink($hot_post-&gt;ID) . "'&gt;{$hot_post-&gt;post_title} ({$hot_post-&gt;comment_count})&lt;/a&gt;&lt;/li&gt;";

  print "&lt;/ul&gt;";

  print $args['after_widget'];
}

// Ativa o sidebar
function posts_mais_quentes_widgets() {
  register_sidebar_widget('Posts Mais Quentes', 'posts_mais_quentes');
}

// Carregar o widget
add_action('widgets_init', 'posts_mais_quentes_widgets');

?&gt;

Agora é só ativar o plugin e adicionar o widget ao sidebar para ve-lo funcionando. Colher de chá!

Agradecimentos

Obrigado ao Rômulo por corrigir o código do plugin acima.

15 Comments

  • responder

    Romulo

    6 years atrás

    Muito bom Marcelo =)
    ja to comecando a me animar pra fazer um plugin

  • responder

    Kaleb Martins

    6 years atrás

    Muito legal..Agora já da para criar produtos e oferecer serviços para os clientes de uma forma melhor.

    Abraços e parabens pelo grande trabalho 😉

  • responder

    romulo

    6 years atrás

    Tudo bom marcelo?
    Eu tava seguindo o seu tutorial, mas na hora de ativar o plugin sempre tava dando erro.
    eu consegui faze-lo funcionar da seguite forma:
    criei um funcao

    function posts_mais_quentes_widgets() {
    register_sidebar_widget(‘Posts Mais Quentes’, ‘posts_mais_quentes’);
    }

    e depois coloquei uma action

    add_action(‘plugins_loaded’, ‘posts_mais_quentes_widgets’);

    ai ele funcionou tranquilo, mas queria saber se essa forma que eu utilizei e certa (ou uma gambiarra)

    de qualquer forma seus tutoriais estao me ajudando muito.
    abracos

    • responder

      Marcelo Mesquita

      6 years atrás

      Tem razão Rômulo, falha minha… isso que dá publicar um código sem testar. =P

      Obrigado por compartilhar essa informação.

  • responder

    Opções de Widgets » Marcelo Mesquita

    6 years atrás

    […] Criando Widgets […]

  • responder

    Tiago Marques

    6 years atrás

    Eu criei uma radio no site Cotonete e queria criar um widget da minha radio, mas não sei se é possivel fazer nem sei como fazer, porque queria esse widget para postar num forum. Sera que pode ajudar?

    • responder

      Marcelo Mesquita

      6 years atrás

      Oi Tiago,
      esse post é sobre como criar widgets para wordpress, acho que deixei o título um pouco vago. Mas acredito que o Cotonete deva fornecer um embed da sua rádio, assim você pode adicioná-la em qualquer site.

      Mas se ainda pretende criar um widget para a sua rádio, a primeira coisa que deve avaliar é como recuperar os dados do site do Cotonete. Normalmente isso pode ser feito com XML ou uma API fornecida pelo próprio site, mas o Cotonete parece não fornecer estes.

  • responder

    BRaNaTi

    6 years atrás

    Mto bom!!

  • responder

    Rômulo

    6 years atrás

    Tudo bom marcelo ?
    continuando com as minhas esperiencias com plugins pra WordPress, resolvi colocar o tinymce e funcionou legal, mas depois fiquei pensando…
    Como e que eu utilizaria o tinymce que vem com o WordPress?
    Vc tem alguma dica pra isso ?

    • responder

      Marcelo Mesquita

      6 years atrás

      Oi Rômulo,
      eu já vi um plugin que fazia isso, vou procurar aqui para tentar descobrir.

      Abraço.

  • responder

    Leonardo

    6 years atrás

    post legal, valeu mesmo cara!!!!

  • responder

    athynir

    6 years atrás

    Muito importante o artigo que me orientou a criar um widget

    Athynir (sites de divulgação)

  • responder

    Denis Forigo

    5 years atrás

    Oi Marcelo, tudo bem? Obrigado pelo tutorial. Estou crindo um plugin e caiu como uma luva. Agora uma questão: e se eu quiser que o widget seja multi-instâncias? Tem alguma maneira fácil?

    []s

  • responder

    Denis Forigo

    5 years atrás

    Ops, não tinha visto,desculpe-me. Valeu! :)

Leave a Reply

Your email address will not be published. Required fields are marked *