{"id":659,"date":"2016-11-03T11:15:08","date_gmt":"2016-11-03T14:15:08","guid":{"rendered":"https:\/\/felipeelia.com.br\/?p=659"},"modified":"2019-02-15T18:43:44","modified_gmt":"2019-02-15T21:43:44","slug":"wordpress-tudo-sobre-widgets","status":"publish","type":"post","link":"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/","title":{"rendered":"WordPress: tudo sobre Widgets"},"content":{"rendered":"<blockquote class=\"wp-block-quote\">Este post faz parte de um conjunto de artigos organizados em um <a href=\"https:\/\/felipeelia.com.br\/curso-de-wordpress\/\">Curso de WordPress<\/a>. Acesse o link para outros conte\u00fados.<\/blockquote>\n<p>Este artigo ficou t\u00e3o grande que tem at\u00e9 \u00edndice:<\/p>\n<ul>\n<li><a href=\"#o-que-sao-widgets\">O que s\u00e3o widgets<\/a><\/li>\n<li><a href=\"#sidebar-ou-area-para-widgets\">Sidebar ou \u00e1rea para widgets<\/a><\/li>\n<li><a href=\"#como-utilizar-widgets\">Como utilizar widgets<\/a><\/li>\n<li><a href=\"#como-criar-e-exibir-suas-proprias-areas\">Como criar e exibir suas pr\u00f3prias \u00e1reas<\/a><\/li>\n<li><a href=\"#como-criar-um-widget-no-wordpress\">Como criar um widget no WordPress<\/a><\/li>\n<li><a href=\"#como-desabilitar-um-widget\">Como desabilitar um widget<\/a><\/li>\n<li><a href=\"#como-alterar-um-widget-ja-existente\">Como alterar um widget j\u00e1 existente<\/a><\/li>\n<li><a href=\"#conclusao\">Conclus\u00e3o<\/a><\/li>\n<\/ul>\n<h2 id=\"o-que-sao-widgets\">O que s\u00e3o widgets<\/h2>\n<p>O resumo do resumo seria dizer que <strong>widgets s\u00e3o os bloquinhos usados nas sidebars<\/strong> ou, em uma tradu\u00e7\u00e3o livre, barras laterais. S\u00e3o mais do que isso porque podem tamb\u00e9m adicionar funcionalidades complexas a essas barras e tamb\u00e9m porque nem toda sidebar \u00e9, apesar do nome, uma barra \u201clateral\u201d. A verdade \u00e9 que com widgets podemos apresentar um formul\u00e1rio de busca, a lista de categorias, um cadastro de newsletter em todas as p\u00e1ginas, seja na lateral, no topo ou no rodap\u00e9 do site.<\/p>\n\n<h2 id=\"sidebar-ou-area-para-widgets\">Sidebar ou \u00e1rea para widgets<\/h2>\n<p>Para que seu tema exiba widgets \u00e9 necess\u00e1rio que ele tenha, pelo menos, <strong>uma \u00e1rea definida para isso<\/strong>. Embora seja usada a fun\u00e7\u00e3o <a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/register_sidebar\" target=\"_blank\" rel=\"noopener\">register_sidebar()<\/a> para esta defini\u00e7\u00e3o (note o \u201csidebar\u201d ali), voc\u00ea n\u00e3o est\u00e1 limitado a criar \u00e1reas somente nas laterais do site. Para generalizar vamos usar ent\u00e3o o termo <em>\u00e1rea para widgets<\/em>, como consta no <a href=\"https:\/\/codex.wordpress.org\/Glossary#Widget_Area\" target=\"_blank\" rel=\"noopener\">gloss\u00e1rio do WordPress<\/a>.<\/p>\n<h2 id=\"como-utilizar-widgets\">Como utilizar widgets<\/h2>\n<p>Se seu tema tem pelo menos uma \u00e1rea para widgets voc\u00ea pode utiliz\u00e1-la indo no painel em Apar\u00eancia \u2192 Widgets e arrastando o widget desejado para a \u00e1rea correta. Outra forma \u00e9 indo em Apar\u00eancia \u2192 Personalizar \u2192 Widgets, selecionando a \u00e1rea desejada e incluindo o widget. <strong>N\u00e3o se esque\u00e7a de salvar.<\/strong><\/p>\n<h2 id=\"como-criar-e-exibir-suas-proprias-areas\">Como criar e exibir suas pr\u00f3prias \u00e1reas<\/h2>\n<h3>Como criar uma \u00e1rea para widgets<\/h3>\n<p>Definir uma \u00e1rea no seu tema \u00e9 relativamente simples, basta chamar uma vez a fun\u00e7\u00e3o <code>register_sidebar<\/code> para cada \u00e1rea que se deseja criar. Para uma \u00e1rea lateral localizada \u00e0 esquerda do seu conte\u00fado voc\u00ea poderia usar:<\/p>\n<pre class=\"php\"><code>register_sidebar( array(\n\t'name'          =&gt; 'Barra Lateral Esquerda', \/\/ Nome exibido na \u00e1rea administrativa.\n\t'id'            =&gt; 'barra_esquerda', \/\/ ID que ser\u00e1 utilizado para chamar a fun\u00e7\u00e3o dynamic_sidebar().\n\t'description'   =&gt; 'Esta \u00e9 a barra lateral esquerda do seu site', \/\/ Descri\u00e7\u00e3o exibida na \u00e1rea administrativa.\n\t'before_widget' =&gt; '&lt;div id=\"%1$s\" class=\"widget %2$s\"&gt;', \/\/ Abertura de uma tag que envolver\u00e1 cada widget. %1$s ser\u00e1 um id \u00fanico para cada widget, $2$s uma classe para cada tipo de widget.\n\t'after_widget'  =&gt; '&lt;\/div&gt;', \/\/ Fechamento da tag de cima.\n\t'before_title'  =&gt; '&lt;h4&gt;', \/\/ Tag exibida antes do t\u00edtulo do widget.\n\t'after_title'   =&gt; '&lt;\/h4&gt;', \/\/ Fechamento da tag de cima.\n) );<\/code><\/pre>\n<figure id=\"attachment_661\" aria-describedby=\"caption-attachment-661\" style=\"width: 1000px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-661\" src=\"https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/tela-de-widgets-wordpress.png\" alt=\"Tela de widgets do WordPress com a \u00e1rea que acabamos de definir\" width=\"1000\" height=\"440\" srcset=\"https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/tela-de-widgets-wordpress.png 1000w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/tela-de-widgets-wordpress-300x132.png 300w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/tela-de-widgets-wordpress-768x338.png 768w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/tela-de-widgets-wordpress-148x65.png 148w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/tela-de-widgets-wordpress-31x14.png 31w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/tela-de-widgets-wordpress-38x17.png 38w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/tela-de-widgets-wordpress-425x187.png 425w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><figcaption id=\"caption-attachment-661\" class=\"wp-caption-text\">Tela de widgets do WordPress com a \u00e1rea que acabamos de definir<\/figcaption><\/figure>\n<p>O par\u00e2metro <code>before_widget<\/code> \u00e9 o \u00fanico que merece um esclarecimento: quando arrastamos o widget para sua \u00e1rea, um n\u00famero \u00fanico \u00e9 gerado para ele e, com esse n\u00famero e um prefixo que se altera com o tipo de widget, \u00e9 gerado o valor que ser\u00e1 utilizado unicamente naquele widget, substitu\u00eddo por <code>%1$s<\/code>. Por exemplo: ao arrastarmos um widget de busca (o \u201cPesquisar\u201d) para uma \u00e1rea, este widget vira o <code>search-1<\/code>, ao arrastarmos outro ele ser\u00e1 o <code>search-2<\/code>. Os dois widgets receber\u00e3o <code>widget_search<\/code> como valor em <code>%2$s<\/code>, ou seja, \u00e9 uma classe comum a todos os widgets daquele tipo.<\/p>\n<figure id=\"attachment_664\" aria-describedby=\"caption-attachment-664\" style=\"width: 406px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-664\" src=\"https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/exemplo-de-ids-e-classes-de-widgets.png\" alt=\"Exemplo de IDs e classes de widgets\" width=\"406\" height=\"69\" srcset=\"https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/exemplo-de-ids-e-classes-de-widgets.png 406w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/exemplo-de-ids-e-classes-de-widgets-300x51.png 300w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/exemplo-de-ids-e-classes-de-widgets-148x25.png 148w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/exemplo-de-ids-e-classes-de-widgets-31x5.png 31w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/exemplo-de-ids-e-classes-de-widgets-38x6.png 38w\" sizes=\"(max-width: 406px) 100vw, 406px\" \/><figcaption id=\"caption-attachment-664\" class=\"wp-caption-text\">Exemplo de IDs e classes de widgets<\/figcaption><\/figure>\n<p><strong>Nota:<\/strong> \u00e9 poss\u00edvel criar v\u00e1rias \u00e1reas ao mesmo tempo com a fun\u00e7\u00e3o <a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/register_sidebars\" target=\"_blank\" rel=\"noopener\">register_sidebars()<\/a>, mas desta forma n\u00e3o \u00e9 poss\u00edvel aplicar um id diferente a cada \u00e1rea.<\/p>\n<h3>Como exibir sua \u00e1rea de widgets<\/h3>\n<p>Para exibir sua \u00e1rea de widgets voc\u00ea precisar\u00e1 da fun\u00e7\u00e3o <a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/dynamic_sidebar\/\" target=\"_blank\" rel=\"noopener\">dynamic_sidebar()<\/a>, passando como par\u00e2metro o identificador da \u00e1rea que voc\u00ea criou. Uma fun\u00e7\u00e3o auxiliar \u00e9 a <a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/is_active_sidebar\/\" target=\"_blank\" rel=\"noopener\">is_active_sidebar()<\/a>, que tamb\u00e9m recebe o identificador da \u00e1rea, e serve para testar se a \u00e1rea est\u00e1 ativa ou n\u00e3o. Juntando as duas ficaria assim:<\/p>\n<pre class=\"php\"><code>&lt;?php if ( is_active_sidebar( 'barra_esquerda' ) ) : ?&gt;\n\t&lt;div id=\"widget-area\" class=\"widget-area\"&gt;\n\t\t&lt;?php dynamic_sidebar( 'barra_esquerda' ); ?&gt;\n\t&lt;\/div&gt;\n&lt;?php endif; ?&gt;<\/code><\/pre>\n<h3>Como exibir widgets no meio do conte\u00fado<\/h3>\n<p>Com o plugin <a href=\"https:\/\/wordpress.org\/plugins\/amr-shortcode-any-widget\/\" target=\"_blank\" rel=\"noopener\">amr shortcode any widget<\/a> \u00e9 poss\u00edvel exibir qualquer widget no meio do conte\u00fado do seu post ou p\u00e1gina. \u00c9 s\u00f3 seguir os seguintes passos:<\/p>\n<ol>\n<li>Instale e ative o plugin;<\/li>\n<li>Adicione o widget necess\u00e1rio na \u00e1rea \u201cWidgets for Shortcodes\u201d;<\/li>\n<li>Salve o widget e copie o shortcode que \u00e9 exibido logo depois de \u201cTo use as shortcode with id:\u201d<\/li>\n<li>Cole o shortcode no conte\u00fado e salve.<\/li>\n<\/ol>\n<figure id=\"attachment_665\" aria-describedby=\"caption-attachment-665\" style=\"width: 343px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-665\" src=\"https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/amr-shortcode-any-widget-area-para-widgets.png\" alt=\"\u00c1rea para widgets gerada pelo \" width=\"343\" height=\"458\" srcset=\"https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/amr-shortcode-any-widget-area-para-widgets.png 343w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/amr-shortcode-any-widget-area-para-widgets-225x300.png 225w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/amr-shortcode-any-widget-area-para-widgets-111x148.png 111w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/amr-shortcode-any-widget-area-para-widgets-23x31.png 23w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/amr-shortcode-any-widget-area-para-widgets-28x38.png 28w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/amr-shortcode-any-widget-area-para-widgets-161x215.png 161w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/amr-shortcode-any-widget-area-para-widgets-300x401.png 300w\" sizes=\"(max-width: 343px) 100vw, 343px\" \/><figcaption id=\"caption-attachment-665\" class=\"wp-caption-text\">\u00c1rea para widgets gerada pelo &#8220;amr shortcode any widget&#8221;<\/figcaption><\/figure>\n<figure id=\"attachment_666\" aria-describedby=\"caption-attachment-666\" style=\"width: 862px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-666\" src=\"https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/amr-shortcode-any-widget-exemplo-de-shortcode.png\" alt=\"Exemplo de inser\u00e7\u00e3o de shortcode no conte\u00fado\" width=\"862\" height=\"257\" srcset=\"https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/amr-shortcode-any-widget-exemplo-de-shortcode.png 862w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/amr-shortcode-any-widget-exemplo-de-shortcode-300x89.png 300w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/amr-shortcode-any-widget-exemplo-de-shortcode-768x229.png 768w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/amr-shortcode-any-widget-exemplo-de-shortcode-148x44.png 148w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/amr-shortcode-any-widget-exemplo-de-shortcode-31x9.png 31w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/amr-shortcode-any-widget-exemplo-de-shortcode-38x11.png 38w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/amr-shortcode-any-widget-exemplo-de-shortcode-425x127.png 425w\" sizes=\"(max-width: 862px) 100vw, 862px\" \/><figcaption id=\"caption-attachment-666\" class=\"wp-caption-text\">Exemplo de inser\u00e7\u00e3o de shortcode no conte\u00fado<\/figcaption><\/figure>\n<h3>Como exibir widgets s\u00f3 com c\u00f3digo<\/h3>\n<p>\u00c9 poss\u00edvel exibir plugins programaticamente utilizando a fun\u00e7\u00e3o <a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/the_widget\" target=\"_blank\" rel=\"noopener\">the_widget()<\/a>. A fun\u00e7\u00e3o recebe tr\u00eas par\u00e2metros:<\/p>\n<ol>\n<li>O nome da classe PHP do widget<\/li>\n<li>Os dados da inst\u00e2ncia do widget<\/li>\n<li>Os dados para simular a \u00e1rea de widgets<\/li>\n<\/ol>\n<p>No link da documenta\u00e7\u00e3o existem exemplos mais completos, mas para exibir o mesmo widget do exemplo anterior n\u00f3s s\u00f3 precisar\u00edamos usar<\/p>\n<pre class=\"php\"><code>the_widget(\n\t'WP_Widget_Categories',\n\tarray(\n\t\t'title' =&gt; 'Categorias',\n\t\t'count' =&gt; 1\n\t),\n\tarray(\n\t\t'before_title' =&gt; '&lt;h2 class=\"titulo-categorias\"&gt;'\n\t)\n);<\/code><\/pre>\n<h2 id=\"como-criar-um-widget-no-wordpress\">Como criar um widget no WordPress<\/h2>\n<p>Widgets s\u00e3o classes PHP que estendem WP_Widget, definida em <code>wp-includes\\class-wp-widget.php<\/code>. Embora a classe WP_Widget n\u00e3o seja das mais complicadas, a classe que voc\u00ea ir\u00e1 criar ser\u00e1 mais simples ainda, tendo apenas 4 m\u00e9todos.<\/p>\n<ol>\n<li><strong>__construct<\/strong>: o construtor, serve para registrar o id e a classe do seu widget;<\/li>\n<li><strong>widget<\/strong>: exibe o conte\u00fado;<\/li>\n<li><strong>form<\/strong>: exibe o formul\u00e1rio no painel do WordPress (t\u00edtulo, exibir quantos itens, etc.) e<\/li>\n<li><strong>update<\/strong>: processa as op\u00e7\u00f5es inseridas pelo usu\u00e1rio no formul\u00e1rio.<\/li>\n<\/ol>\n<h3>Um widget de T\u00f3picos recentes de uma categoria espec\u00edfica<\/h3>\n<p>Vamos criar um widget simplificado parecido com o \u201cT\u00f3picos recentes\u201d, que j\u00e1 vem com o WordPress, mas com a op\u00e7\u00e3o de escolher uma categoria espec\u00edfica:<\/p>\n<pre class=\"php\"><code>&lt;?php\n\/**\n * Classe de um widget para T\u00f3picos Recentes com sele\u00e7\u00e3o de categoria.\n *\/\nclass Custom_Recent_Posts extends WP_Widget {\n\t\/**\n\t * Construtor da classe.\n\t *\/\n\tpublic function __construct() {\n\t\tparent::__construct(\n\t\t\t'recent-posts-cat',\n\t\t\t'T\u00f3picos Recentes por Categoria',\n\t\t\tarray(\n\t\t\t\t'classname'   =&gt; 'widget_recent_entries widget_recent_entries_cat',\n\t\t\t\t'description' =&gt; 'T\u00f3picos recentes por categoria',\n\t\t\t)\n\t\t);\n\t}\n\n\t\/**\n\t * Renderiza o widget.\n\t *\n\t * @param array $args     Argumentos da \u00e1rea de widgets.\n\t * @param array $instance Dados da inst\u00e2ncia do widget.\n\t *\/\n\tpublic function widget( $args, $instance ) {\n\t\techo $args['before_widget'];\n\n\t\tif ( $instance['title'] ) {\n\t\t\techo $args['before_title'] . $instance['title'] . $args['after_title'];\n\t\t}\n\t\t$posts = get_posts( array( 'category' =&gt; $instance['cat'] ) );\n\t\tif ( count( $posts ) ) {\n\t\t\t?&gt;\n\t\t\t&lt;ul&gt;\n\t\t\t\t&lt;?php\n\t\t\t\tforeach ( $posts as $post ) {\n\t\t\t\t\tsetup_postdata( $post );\n\t\t\t\t\t?&gt;\n\t\t\t\t\t&lt;li&gt;&lt;a href=\"&lt;?php the_permalink(); ?&gt;\"&gt;&lt;?php the_title(); ?&gt;&lt;\/a&gt;&lt;\/li&gt;\n\t\t\t\t\t&lt;?php\n\t\t\t\t}\n\t\t\t\t?&gt;\n\t\t\t&lt;\/ul&gt;\n\t\t\t&lt;?php\n\t\t\twp_reset_postdata();\n\t\t}\n\n\t\techo $args['after_widget'];\n\t}\n\n\t\/**\n\t * Formul\u00e1rio exibido no painel de administra\u00e7\u00e3o de widgets.\n\t *\n\t * @param array $instance Dados anteriores da inst\u00e2ncia.\n\t *\/\n\tpublic function form( $instance ) {\n\t\t$title = isset( $instance['title'] ) ? esc_attr( $instance['title'] ) : '';\n\t\t$cat   = isset( $instance['cat'] ) ? absint( $instance['cat'] ) : 0;\n\t\t?&gt;\n\t\t&lt;p&gt;\n\t\t\t&lt;label for=\"&lt;?php echo $this-&gt;get_field_id( 'title' ); ?&gt;\"&gt;T\u00edtulo:&lt;\/label&gt;\n\t\t\t&lt;input\n\t\t\t\ttype=\"text\"\n\t\t\t\tclass=\"widefat\"\n\t\t\t\tid=\"&lt;?php echo $this-&gt;get_field_id( 'title' ); ?&gt;\"\n\t\t\t\tname=\"&lt;?php echo $this-&gt;get_field_name( 'title' ); ?&gt;\"\n\t\t\t\tvalue=\"&lt;?php echo $title; ?&gt;\"&gt;\n\t\t&lt;\/p&gt;\n\n\t\t&lt;p&gt;\n\t\t\t&lt;label for=\"&lt;?php echo $this-&gt;get_field_id( 'cat' ); ?&gt;\"&gt;Categoria:&lt;\/label&gt;\n\t\t\t&lt;?php\n\t\t\twp_dropdown_categories( array(\n\t\t\t\t'hide_empty' =&gt; false,\n\t\t\t\t'id'         =&gt; $this-&gt;get_field_id( 'cat' ),\n\t\t\t\t'name'       =&gt; $this-&gt;get_field_name( 'cat' ),\n\t\t\t\t'selected'   =&gt; $cat,\n\t\t\t) );\n\t\t\t?&gt;\n\t\t&lt;\/p&gt;\n\t\t&lt;?php\n\t}\n\n\t\/**\n\t * Atualiza a inst\u00e2ncia do widget (com os dados informados em `form()`)\n\t *\n\t * @param array $new_instance Dados informados.\n\t * @param array $old_instance Dados guardados anteriormente.\n\t * @return array              Dados que devem ser guardados\n\t *\/\n\tpublic function update( $new_instance, $old_instance ) {\n\t\t$instance = $old_instance;\n\t\t$instance['title'] = sanitize_text_field( $new_instance['title'] );\n\t\t$instance['cat']   = absint( $new_instance['cat'] );\n\t\treturn $instance;\n\t}\n}<\/code><\/pre>\n<h3>Entendendo o c\u00f3digo<\/h3>\n<p>A fun\u00e7\u00e3o construtora aceita at\u00e9 4 argumentos:<\/p>\n<ol>\n<li>Base do ID: no nosso caso <code>recent-posts-cat<\/code>, ser\u00e1 usado para montar os IDs html para cada widget instanciado, ou seja, este \u00e9 o valor usado para <code>%1$s<\/code> com algumas (poucas) modifica\u00e7\u00f5es feitas pelo WordPress;<\/li>\n<li>Nome: ser\u00e1 usado para listar o widget no painel;<\/li>\n<li>Op\u00e7\u00f5es do Widget: array onde \u00e9 poss\u00edvel definir o que ser\u00e1 usado como classe (<code>%2$s<\/code> l\u00e1 de cima) e a descri\u00e7\u00e3o exibida no painel e<\/li>\n<li>Um array opcional que quase nunca \u00e9 usado, documentado <a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/wp_register_widget_control\" target=\"_blank\" rel=\"noopener\">aqui<\/a>.<\/li>\n<\/ol>\n<p>A fun\u00e7\u00e3o <code>widget<\/code>, respons\u00e1vel por exibi-lo, recebe dois arrays como argumentos: o dados definidos na cria\u00e7\u00e3o da \u00e1rea de widgets onde ele ser\u00e1 exibido e os dados do pr\u00f3prio widget, definidos no formul\u00e1rio pelo usu\u00e1rio. O que fazemos ent\u00e3o \u00e9 abrir o widget com o que foi definido pelo usu\u00e1rio, exibir seu t\u00edtulo caso ele tenha sido informado, exibir os posts da categoria determinada e fechar o widget. <strong>Lembre-se sempre de abrir o widget, fech\u00e1-lo, abrir o t\u00edtulo e fech\u00e1-lo com o que foi definido pelo usu\u00e1rio<\/strong>, assim voc\u00ea evita inconsist\u00eancias dif\u00edceis de detectar depois.<\/p>\n<p>A fun\u00e7\u00e3o <code>form<\/code>, como dito anteriormente, exibe o formul\u00e1rio. Ela recebe os dados j\u00e1 salvos do widget, possibilitando exibir o formul\u00e1rio j\u00e1 preenchido. Aten\u00e7\u00e3o especial para usar <code>get_field_id<\/code> e <code>get_field_name<\/code> para gerar os par\u00e2metros. Destaque para a fun\u00e7\u00e3o <a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/wp_dropdown_categories\" target=\"_blank\" rel=\"noopener\">wp_dropdown_categories<\/a>, que facilita demais a nossa vida na montagem do select.<\/p>\n<p>A fun\u00e7\u00e3o <code>update<\/code> recebe dois argumentos: os dados que acabaram de ser salvos e os dados anteriores. Na maioria das vezes o que precisamos \u00e9 somente validar os dados novos e sobrescrever os antigos.<\/p>\n<h3>Como registrar o widget<\/h3>\n<p>Para que o widget seja listado no painel \u00e9 preciso registr\u00e1-lo, atrav\u00e9s da fun\u00e7\u00e3o <a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/register_widget\" target=\"_blank\" rel=\"noopener\">register_widget()<\/a> na action <code>widgets_init<\/code>. J\u00e1 falei sobre <a href=\"https:\/\/felipeelia.com.br\/hooks-no-wordpress-actions-e-filters\/\">filtros, actions e hooks<\/a> aqui no blog, se voc\u00ea tem d\u00favidas vale a pena dar uma olhada. Ficaria assim:<\/p>\n<pre class=\"php\"><code>function register_custom_recent_posts() {\n\treturn register_widget( 'Custom_Recent_Posts' );\n}\nadd_action( 'widgets_init', 'register_custom_recent_posts' );<\/code><\/pre>\n<p>Como a fun\u00e7\u00e3o de registro de widget normalmente \u00e9 pequena voc\u00ea pode eliminar esse intermedi\u00e1rio. Em vers\u00f5es de PHP acima ou iguais a 5.3 voc\u00ea pode usar:<\/p>\n<pre class=\"php\"><code>add_action( 'widgets_init', function() { register_widget( 'Custom_Recent_Posts' ); } );<\/code><\/pre>\n<p>Para vers\u00f5es anteriores:&gt;<\/p>\n<pre class=\"php\"><code>add_action( 'widgets_init', create_function( '', 'return register_widget(\"Custom_Recent_Posts\");' ) );<\/code><\/pre>\n<h2 id=\"como-desabilitar-um-widget\">Como desabilitar um widget<\/h2>\n<p>No t\u00f3pico anterior vimos a fun\u00e7\u00e3o <code>register_widget<\/code>. Para desabilitar widgets \u00e9 preciso usar a <a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/unregister_widget\" target=\"_blank\" rel=\"noopener\">unregister_widget<\/a>. Para evitar que o widget de Agenda, por exemplo, seja exibido no painel poder\u00edamos usar:<\/p>\n<pre class=\"php\"><code>function remove_calendar_widget() {\n\tunregister_widget( 'WP_Widget_Calendar' );\n}\nadd_action( 'widgets_init', 'remove_calendar_widget' );<\/code><\/pre>\n<p>A fun\u00e7\u00e3o recebe como par\u00e2metro o nome da classe que gera o widget. Os nomes das classes que j\u00e1 vem com o WordPress s\u00e3o:<\/p>\n<ul>\n<li>WP_Widget_Pages: P\u00e1ginas<\/li>\n<li>WP_Widget_Calendar: Agenda<\/li>\n<li>WP_Widget_Archives: Arquivos<\/li>\n<li>WP_Widget_Meta: Meta<\/li>\n<li>WP_Widget_Search: Pesquisar<\/li>\n<li>WP_Widget_Text: Texto<\/li>\n<li>WP_Widget_Categories: Categorias<\/li>\n<li>WP_Widget_Recent_Posts: T\u00f3picos recentes<\/li>\n<li>WP_Widget_Recent_Comments: Coment\u00e1rios<\/li>\n<li>WP_Widget_RSS: RSS<\/li>\n<li>WP_Widget_Tag_Cloud: Nuvem de tags<\/li>\n<li>WP_Nav_Menu_Widget: Menu personalizado<\/li>\n<\/ul>\n<h2 id=\"como-alterar-um-widget-ja-existente\">Como alterar um widget j\u00e1 existente<\/h2>\n<p>Mais comum que a necessidade de criar um widget \u00e9 alterar alguma pequena parte de um j\u00e1 existente. Como n\u00e3o \u00e9 poss\u00edvel alterar os arquivos do WordPress &#8211; voc\u00ea pode perder tudo na pr\u00f3xima atualiza\u00e7\u00e3o -, \u00e9 preciso analisar cada caso e utilizar um filtro se for poss\u00edvel. Como widgets s\u00e3o classes, \u00e9 poss\u00edvel ainda usar o conceito de extens\u00e3o ou heran\u00e7a, criando uma nova classe que estende a do widget que desejamos alterar e modificando somente o funcionamento das fun\u00e7\u00f5es corretas.<\/p>\n<h3>Como alterar o widget com filtros<\/h3>\n<p>Vamos supor que precisemos excluir uma categoria dos posts exibidos pelo widget de \u201cT\u00f3picos recentes\u201d. Este widget \u00e9 definido no arquivo <code>wp-includes\/widgets\/class-wp-widget-recent-posts.php<\/code> e os posts s\u00e3o escolhidos com o seguinte c\u00f3digo, na linha 69 (vers\u00e3o 4.6.1):<\/p>\n<pre class=\"php\"><code>$r = new WP_Query( apply_filters( 'widget_posts_args', array(\n\t\t\t'posts_per_page'      =&gt; $number,\n\t\t\t'no_found_rows'       =&gt; true,\n\t\t\t'post_status'         =&gt; 'publish',\n\t\t\t'ignore_sticky_posts' =&gt; true\n\t\t) ) );<\/code><\/pre>\n<p>Este c\u00f3digo significa que podemos alterar os par\u00e2metros de escolha dos posts usando o filtro <a href=\"https:\/\/codex.wordpress.org\/Plugin_API\/Filter_Reference\/widget_posts_args\" target=\"_blank\" rel=\"noopener\">widget_posts_args<\/a>. Vamos usar o <a href=\"https:\/\/codex.wordpress.org\/Class_Reference\/WP_Query#Category_Parameters\" target=\"_blank\" rel=\"noopener\">par\u00e2metro category__not_in<\/a> para excluir a categoria \u201cSem categoria\u201d:<\/p>\n<pre class=\"php\"><code>function exclude_recent_posts_cat( $args ) {\n\t$args['category__not_in'] = array( get_cat_ID( 'Sem categoria' ) );\n\treturn $args;\n}\nadd_filter( 'widget_posts_args', 'exclude_recent_posts_cat' );<\/code><\/pre>\n<p>Infelizmente, usando este m\u00e9todo, voc\u00ea n\u00e3o permite que o usu\u00e1rio escolha qual categoria excluir, mas pode ser um bom come\u00e7o se voc\u00ea est\u00e1 com dificuldades para alterar um pequeno comportamento de algum widget.<\/p>\n<p><strong>A dica aqui \u00e9: veja o c\u00f3digo-fonte e procure por um filtro ou action que possa ser usado.<\/strong><\/p>\n<h3>Como alterar um widget usando orienta\u00e7\u00e3o a objetos<\/h3>\n<p>Voc\u00ea pode criar uma classe que, ao inv\u00e9s de estender WP_Widget, estenda a do pr\u00f3prio widget a ser alterado.<\/p>\n<p>Para alterar o html da lista que exibe os t\u00f3picos recentes, por exemplo, vamos usar:<\/p>\n<pre class=\"php\"><code>class Custom_HTML_Recent_Posts extends WP_Widget_Recent_Posts {\n\tpublic function __construct() {\n\t\t$widget_ops = array(\n\t\t\t'classname'                   =&gt; 'widget_recent_entries',\n\t\t\t'description'                 =&gt; __( 'Your site&amp;#8217;s most recent Posts.' ),\n\t\t\t'customize_selective_refresh' =&gt; true,\n\t\t);\n\t\tWP_Widget::__construct( 'recent-posts', __( 'Recent Posts' ), $widget_ops );\n\t\t$this-&gt;alt_option_name = 'widget_recent_entries';\n\t}\n\n\tpublic function widget( $args, $instance ) {\n\t\tif ( ! isset( $args['widget_id'] ) ) {\n\t\t\t$args['widget_id'] = $this-&gt;id;\n\t\t}\n\n\n\t\t$title = ( ! empty( $instance['title'] ) ) ? $instance['title'] : __( 'Recent Posts' );\n\n\n\t\t\/** This filter is documented in wp-includes\/widgets\/class-wp-widget-pages.php *\/\n\t\t$title = apply_filters( 'widget_title', $title, $instance, $this-&gt;id_base );\n\n\n\t\t$number = ( ! empty( $instance['number'] ) ) ? absint( $instance['number'] ) : 5;\n\t\tif ( ! $number )\n\t\t\t$number = 5;\n\t\t$show_date = isset( $instance['show_date'] ) ? $instance['show_date'] : false;\n\n\n\t\t\/**\n\t\t * Filters the arguments for the Recent Posts widget.\n\t\t *\n\t\t * @since 3.4.0\n\t\t *\n\t\t * @see WP_Query::get_posts()\n\t\t *\n\t\t * @param array $args An array of arguments used to retrieve the recent posts.\n\t\t *\/\n\t\t$r = new WP_Query( apply_filters( 'widget_posts_args', array(\n\t\t\t'posts_per_page'      =&gt; $number,\n\t\t\t'no_found_rows'       =&gt; true,\n\t\t\t'post_status'         =&gt; 'publish',\n\t\t\t'ignore_sticky_posts' =&gt; true\n\t\t) ) );\n\n\n\t\tif ($r-&gt;have_posts()) :\n\t\t?&gt;\n\t\t&lt;?php echo $args['before_widget']; ?&gt;\n\t\t&lt;?php if ( $title ) {\n\t\t\techo $args['before_title'] . $title . $args['after_title'];\n\t\t} ?&gt;\n\t\t&lt;ul class=\"lista-de-posts\"&gt;\n\t\t&lt;?php while ( $r-&gt;have_posts() ) : $r-&gt;the_post(); ?&gt;\n\t\t\t&lt;li&gt;\n\t\t\t\t&lt;a href=\"&lt;?php the_permalink(); ?&gt;\"&gt;&lt;?php get_the_title() ? the_title() : the_ID(); ?&gt;&lt;\/a&gt;\n\t\t\t&lt;?php if ( $show_date ) : ?&gt;\n\t\t\t\t&lt;span class=\"post-date\"&gt;&lt;?php echo get_the_date(); ?&gt;&lt;\/span&gt;\n\t\t\t&lt;?php endif; ?&gt;\n\t\t\t&lt;\/li&gt;\n\t\t&lt;?php endwhile; ?&gt;\n\t\t&lt;\/ul&gt;\n\t\t&lt;?php echo $args['after_widget']; ?&gt;\n\t\t&lt;?php\n\t\t\/\/ Reset the global $the_post as this query will have stomped on it\n\t\twp_reset_postdata();\n\n\n\t\tendif;\n\t}\n}\n\n\nfunction register_custom_html_recent_posts() {\n\tunregister_widget( 'WP_Widget_Recent_Posts' );\n\tregister_widget( 'Custom_HTML_Recent_Posts' );\n}\nadd_action( 'widgets_init', 'register_custom_html_recent_posts' );<\/code><\/pre>\n<h3>Entendendo o c\u00f3digo<\/h3>\n<p>Primeira coisa a ser notada \u00e9 que a nossa classe estende <code>WP_Widget_Recent_Posts<\/code>. Logo em seguida, no m\u00e9todo construtor existem alguns detalhes importantes:<\/p>\n<ol>\n<li>Foi copiado o c\u00f3digo de constru\u00e7\u00e3o da classe WP_Widget_Recent_Posts;<\/li>\n<li>Onde se lia <code>parent::__construct<\/code> foi necess\u00e1rio trocar para <code>WP_Widget::__construct<\/code>. Isto acontece porque a parent, no nosso caso, chamaria <code>WP_Widget_Recent_Posts::__construct<\/code> que n\u00e3o recebe nenhum argumento e, portanto, n\u00e3o repassaria nada do que n\u00f3s configur\u00e1ssemos. O c\u00f3digo no exemplo \u00e9 apenas para alertar deste fato, porque na verdade n\u00e3o seria necess\u00e1rio chamar o construtor com nada diferente j\u00e1 que vamos desabilitar o widget original mais pra baixo. Resumindo: se voc\u00ea for manter o widget original ou quiser fazer qualquer altera\u00e7\u00e3o no que for configurado nesse m\u00e9todo <strong>n\u00e3o esque\u00e7a de alterar <em>parent::<\/em> para <em>WP_Widget::<\/em><\/strong>.<\/li>\n<li>O m\u00e9todo widget \u00e9 exatamente o mesmo, apenas coloquei uma classe na ul.<\/li>\n<li>Em <code>register_custom_html_recent_posts<\/code> desabilitamos o widget original e registramos o nosso, assim o usu\u00e1rio s\u00f3 ter\u00e1 uma op\u00e7\u00e3o para utilizar.<\/li>\n<\/ol>\n<h2 id=\"conclusao\">Conclus\u00e3o<\/h2>\n<p>Widgets s\u00e3o \u00f3timas maneiras de repetir por\u00e7\u00f5es de conte\u00fado ou funcionalidades pelas p\u00e1ginas, centralizando a administra\u00e7\u00e3o. Se voc\u00ea viu esse c\u00f3digo todo, n\u00e3o se sente a vontade de mexer, e prefere que um programdor mexa para voc\u00ea, fala com a gente l\u00e1 na <a href=\"http:\/\/duo-me.com\" target=\"_blank\" rel=\"noopener\">duo.me<\/a>. Se voc\u00ea leu tudo isso parab\u00e9ns, fique com uma foto do wappu a\u00ed embaixo, voc\u00ea merece. N\u00e3o se esque\u00e7a de compartilhar, comentar e etc.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-669\" src=\"https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/wapuu.png\" alt=\"wapuu\" width=\"150\" height=\"152\" srcset=\"https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/wapuu.png 150w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/wapuu-146x148.png 146w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/wapuu-31x31.png 31w, https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/wapuu-38x38.png 38w\" sizes=\"(max-width: 150px) 100vw, 150px\" \/><\/p>\n<p><strong>Atualiza\u00e7\u00e3o (15\/06\/2018):\u00a0<\/strong>Precisei pegar um c\u00f3digo aqui e vi que a formata\u00e7\u00e3o estava uma bagun\u00e7a, aproveitei pra ajeitar um pouquinho.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Saiba tudo sobre widgets no WordPress: o que s\u00e3o, como us\u00e1-los, como criar seu pr\u00f3prio widget e tamb\u00e9m como alterar e desabilitar os j\u00e1 existentes.<\/p>\n","protected":false},"author":1,"featured_media":660,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_uag_custom_page_level_css":"","footnotes":""},"categories":[30],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v21.9.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>WordPress: tudo sobre Widgets | Felipe Elia<\/title>\n<meta name=\"description\" content=\"Saiba tudo sobre widgets no WordPress: o que s\u00e3o, como us\u00e1-los, como criar seu pr\u00f3prio widget e tamb\u00e9m como alterar e desabilitar os j\u00e1 existentes.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/\" \/>\n<meta property=\"og:locale\" content=\"pt_BR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"WordPress: tudo sobre Widgets | Felipe Elia\" \/>\n<meta property=\"og:description\" content=\"Saiba tudo sobre widgets no WordPress: o que s\u00e3o, como us\u00e1-los, como criar seu pr\u00f3prio widget e tamb\u00e9m como alterar e desabilitar os j\u00e1 existentes.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/\" \/>\n<meta property=\"og:site_name\" content=\"Felipe Elia\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/felipe.elia\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/felipe.elia\" \/>\n<meta property=\"article:published_time\" content=\"2016-11-03T14:15:08+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2019-02-15T21:43:44+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/felipeelia.dev\/wp-content\/uploads\/2016\/11\/wordpress-widgets.png\" \/>\n\t<meta property=\"og:image:width\" content=\"720\" \/>\n\t<meta property=\"og:image:height\" content=\"514\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Felipe Elia\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@https:\/\/twitter.com\/felipe_elia\" \/>\n<meta name=\"twitter:site\" content=\"@felipe_elia\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Felipe Elia\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. tempo de leitura\" \/>\n\t<meta name=\"twitter:data2\" content=\"15 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/\"},\"author\":{\"name\":\"Felipe Elia\",\"@id\":\"https:\/\/felipeelia.com.br\/#\/schema\/person\/927a99b6e1cde7fcf9f4f79a1638b292\"},\"headline\":\"WordPress: tudo sobre Widgets\",\"datePublished\":\"2016-11-03T14:15:08+00:00\",\"dateModified\":\"2019-02-15T21:43:44+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/\"},\"wordCount\":1884,\"commentCount\":2,\"publisher\":{\"@id\":\"https:\/\/felipeelia.com.br\/#\/schema\/person\/927a99b6e1cde7fcf9f4f79a1638b292\"},\"articleSection\":[\"WordPress\"],\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/\",\"url\":\"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/\",\"name\":\"WordPress: tudo sobre Widgets | Felipe Elia\",\"isPartOf\":{\"@id\":\"https:\/\/felipeelia.com.br\/#website\"},\"datePublished\":\"2016-11-03T14:15:08+00:00\",\"dateModified\":\"2019-02-15T21:43:44+00:00\",\"description\":\"Saiba tudo sobre widgets no WordPress: o que s\u00e3o, como us\u00e1-los, como criar seu pr\u00f3prio widget e tamb\u00e9m como alterar e desabilitar os j\u00e1 existentes.\",\"breadcrumb\":{\"@id\":\"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/#breadcrumb\"},\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"In\u00edcio\",\"item\":\"https:\/\/felipeelia.dev\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"WordPress: tudo sobre Widgets\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/felipeelia.com.br\/#website\",\"url\":\"https:\/\/felipeelia.com.br\/\",\"name\":\"Felipe Elia\",\"description\":\"Programa\u00e7\u00e3o com WordPress de um jeito f\u00e1cil, do b\u00e1sico ao avan\u00e7ado\",\"publisher\":{\"@id\":\"https:\/\/felipeelia.com.br\/#\/schema\/person\/927a99b6e1cde7fcf9f4f79a1638b292\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/felipeelia.com.br\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"pt-BR\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/felipeelia.com.br\/#\/schema\/person\/927a99b6e1cde7fcf9f4f79a1638b292\",\"name\":\"Felipe Elia\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\/\/felipeelia.com.br\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/felipeelia.dev\/wp-content\/uploads\/2023\/06\/avatar-400x400-1.jpg\",\"contentUrl\":\"https:\/\/felipeelia.dev\/wp-content\/uploads\/2023\/06\/avatar-400x400-1.jpg\",\"width\":400,\"height\":400,\"caption\":\"Felipe Elia\"},\"logo\":{\"@id\":\"https:\/\/felipeelia.com.br\/#\/schema\/person\/image\/\"},\"description\":\"Associate Director of Platform Engineering na 10up, WordPress Core Contributor, Global Polyglots Mentor na comunidade internacional do WordPress e Locale Manager na comunidade WordPress Brasil.\",\"sameAs\":[\"https:\/\/www.facebook.com\/felipe.elia\",\"https:\/\/www.instagram.com\/felipe.elia\/\",\"https:\/\/www.linkedin.com\/in\/felipeelia\/\",\"https:\/\/twitter.com\/https:\/\/twitter.com\/felipe_elia\",\"https:\/\/www.youtube.com\/channel\/UCD_26rOE3ClALcZreTkyIoQ\"],\"url\":\"https:\/\/felipeelia.com.br\/author\/admin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"WordPress: tudo sobre Widgets | Felipe Elia","description":"Saiba tudo sobre widgets no WordPress: o que s\u00e3o, como us\u00e1-los, como criar seu pr\u00f3prio widget e tamb\u00e9m como alterar e desabilitar os j\u00e1 existentes.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/","og_locale":"pt_BR","og_type":"article","og_title":"WordPress: tudo sobre Widgets | Felipe Elia","og_description":"Saiba tudo sobre widgets no WordPress: o que s\u00e3o, como us\u00e1-los, como criar seu pr\u00f3prio widget e tamb\u00e9m como alterar e desabilitar os j\u00e1 existentes.","og_url":"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/","og_site_name":"Felipe Elia","article_publisher":"https:\/\/www.facebook.com\/felipe.elia","article_author":"https:\/\/www.facebook.com\/felipe.elia","article_published_time":"2016-11-03T14:15:08+00:00","article_modified_time":"2019-02-15T21:43:44+00:00","og_image":[{"width":720,"height":514,"url":"https:\/\/felipeelia.dev\/wp-content\/uploads\/2016\/11\/wordpress-widgets.png","type":"image\/png"}],"author":"Felipe Elia","twitter_card":"summary_large_image","twitter_creator":"@https:\/\/twitter.com\/felipe_elia","twitter_site":"@felipe_elia","twitter_misc":{"Escrito por":"Felipe Elia","Est. tempo de leitura":"15 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/#article","isPartOf":{"@id":"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/"},"author":{"name":"Felipe Elia","@id":"https:\/\/felipeelia.com.br\/#\/schema\/person\/927a99b6e1cde7fcf9f4f79a1638b292"},"headline":"WordPress: tudo sobre Widgets","datePublished":"2016-11-03T14:15:08+00:00","dateModified":"2019-02-15T21:43:44+00:00","mainEntityOfPage":{"@id":"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/"},"wordCount":1884,"commentCount":2,"publisher":{"@id":"https:\/\/felipeelia.com.br\/#\/schema\/person\/927a99b6e1cde7fcf9f4f79a1638b292"},"articleSection":["WordPress"],"inLanguage":"pt-BR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/","url":"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/","name":"WordPress: tudo sobre Widgets | Felipe Elia","isPartOf":{"@id":"https:\/\/felipeelia.com.br\/#website"},"datePublished":"2016-11-03T14:15:08+00:00","dateModified":"2019-02-15T21:43:44+00:00","description":"Saiba tudo sobre widgets no WordPress: o que s\u00e3o, como us\u00e1-los, como criar seu pr\u00f3prio widget e tamb\u00e9m como alterar e desabilitar os j\u00e1 existentes.","breadcrumb":{"@id":"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/#breadcrumb"},"inLanguage":"pt-BR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/felipeelia.com.br\/wordpress-tudo-sobre-widgets\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"In\u00edcio","item":"https:\/\/felipeelia.dev\/"},{"@type":"ListItem","position":2,"name":"WordPress: tudo sobre Widgets"}]},{"@type":"WebSite","@id":"https:\/\/felipeelia.com.br\/#website","url":"https:\/\/felipeelia.com.br\/","name":"Felipe Elia","description":"Programa\u00e7\u00e3o com WordPress de um jeito f\u00e1cil, do b\u00e1sico ao avan\u00e7ado","publisher":{"@id":"https:\/\/felipeelia.com.br\/#\/schema\/person\/927a99b6e1cde7fcf9f4f79a1638b292"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/felipeelia.com.br\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"pt-BR"},{"@type":["Person","Organization"],"@id":"https:\/\/felipeelia.com.br\/#\/schema\/person\/927a99b6e1cde7fcf9f4f79a1638b292","name":"Felipe Elia","image":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/felipeelia.com.br\/#\/schema\/person\/image\/","url":"https:\/\/felipeelia.dev\/wp-content\/uploads\/2023\/06\/avatar-400x400-1.jpg","contentUrl":"https:\/\/felipeelia.dev\/wp-content\/uploads\/2023\/06\/avatar-400x400-1.jpg","width":400,"height":400,"caption":"Felipe Elia"},"logo":{"@id":"https:\/\/felipeelia.com.br\/#\/schema\/person\/image\/"},"description":"Associate Director of Platform Engineering na 10up, WordPress Core Contributor, Global Polyglots Mentor na comunidade internacional do WordPress e Locale Manager na comunidade WordPress Brasil.","sameAs":["https:\/\/www.facebook.com\/felipe.elia","https:\/\/www.instagram.com\/felipe.elia\/","https:\/\/www.linkedin.com\/in\/felipeelia\/","https:\/\/twitter.com\/https:\/\/twitter.com\/felipe_elia","https:\/\/www.youtube.com\/channel\/UCD_26rOE3ClALcZreTkyIoQ"],"url":"https:\/\/felipeelia.com.br\/author\/admin\/"}]}},"uagb_featured_image_src":{"full":["https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/wordpress-widgets.png",720,514,false],"thumbnail":["https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/wordpress-widgets-150x150.png",150,150,true],"medium":["https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/wordpress-widgets-300x214.png",300,214,true],"medium_large":["https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/wordpress-widgets.png",720,514,false],"large":["https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/wordpress-widgets.png",720,514,false],"1536x1536":["https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/wordpress-widgets.png",720,514,false],"2048x2048":["https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/wordpress-widgets.png",720,514,false],"ocean-thumb-m":["https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/wordpress-widgets.png",600,428,false],"ocean-thumb-ml":["https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/wordpress-widgets.png",630,450,false],"ocean-thumb-l":["https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/wordpress-widgets.png",720,514,false],"yarpp-thumbnail":["https:\/\/felipeelia.com.br\/wp-content\/uploads\/2016\/11\/wordpress-widgets.png",120,86,false]},"uagb_author_info":{"display_name":"Felipe Elia","author_link":"https:\/\/felipeelia.com.br\/author\/admin\/"},"uagb_comment_info":2,"uagb_excerpt":"Saiba tudo sobre widgets no WordPress: o que s\u00e3o, como us\u00e1-los, como criar seu pr\u00f3prio widget e tamb\u00e9m como alterar e desabilitar os j\u00e1 existentes.","_links":{"self":[{"href":"https:\/\/felipeelia.com.br\/wp-json\/wp\/v2\/posts\/659"}],"collection":[{"href":"https:\/\/felipeelia.com.br\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/felipeelia.com.br\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/felipeelia.com.br\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/felipeelia.com.br\/wp-json\/wp\/v2\/comments?post=659"}],"version-history":[{"count":0,"href":"https:\/\/felipeelia.com.br\/wp-json\/wp\/v2\/posts\/659\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/felipeelia.com.br\/wp-json\/wp\/v2\/media\/660"}],"wp:attachment":[{"href":"https:\/\/felipeelia.com.br\/wp-json\/wp\/v2\/media?parent=659"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/felipeelia.com.br\/wp-json\/wp\/v2\/categories?post=659"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/felipeelia.com.br\/wp-json\/wp\/v2\/tags?post=659"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}