Em Desenvolvimento WordPress você vai encontrar milhares de artigos sobre desenvolvimento de temas, plugins e alguns truques e dicas para WordPress.

Veja como fazer o WordPress parar de fazer pingback em si mesmo adicionando um pequeno trecho de código no functions.php.

Para quem não sabe, pingback é uma espécie de comentário gerado automaticamente quando qualquer site da Internet linkar o seu site. Vem até parte do trecho do texto em que o link está para gerar algo um pouco mais real do que apenas uma URL.

Mas enfim, o fato é que o WordPress insiste em tentar “pingar” a si mesmo, o que não faz muito sentido ao meu ver, já que o dono do site irá linkar as palavras relevantes quando precisar.

Se você deseja desativar os pingbacks em si mesmo do seu WordPress, simplesmente adicione o seguinte no seu arquivo functions.php:

function teo_disable_self_trackback( &$links ) {
  foreach ( $links as $l => $link )
        if ( 0 === strpos( $link, get_option( 'home' ) ) )
            unset($links[$l]);
}
add_action( 'pre_ping', 'teo_disable_self_trackback' );

Espero ter ajudado e até o próximo.

Existe um conflito já antigo entre os plugins do WordPress Disqus e avaliações do Woocommerce. Neste tutorial vou mostrar uma maneira simples para resolver o problema para que ambos possam conviver em harmonia em seu site ou blog.

O problema é que o Disqus é um plugin de comentários e, como tal, remove o formulário e renderização de comentários padrão do WordPress. O Woocommerce, por sua vez, confia no sistema de comentários do WordPress para criar um sistema de avaliações para seus produtos, assim os usuários podem descrever o que acharam sobre o produto que compraram em seu site. Quando ambos os plugins estão ativados em um WordPress qualquer, o Disqus funciona perfeitamente para exibir o formulário e renderização dos comentários, porém, ele faz com que as avaliações do Woocommerce simplesmente desapareçam, ou seja, quando um usuário clicar na aba avaliações para visualizar avaliações ou criar sua própria avaliação, ele não verá nada além de um trecho em branco no seu site.

O processo que vou descrever envolve simplesmente adicionar algumas linhas de código no arquivo functions.php de qualquer tema que você estiver utilizando. Isso deverá resolver o problema do conflito entre os plugins mencionados.

 Disqus e avaliações do Woocommerce em harmonia

Para resolver este problema, simplesmente adicione o seguinte trecho de código ao final do arquivo functions.php do seu tema atual:

add_action('the_post', 'teo_remove_disqus_woocommerce');
remove_action('pre_comment_on_post', 'dsq_pre_comment_on_post');

function teo_remove_disqus_woocommerce() {
    global $post, $wp_query;
    
    if (get_post_type() == 'product') { 
        remove_filter('comments_template', 'dsq_comments_template');
    }
}

Salve o arquivo e verifique.

As avaliações do Woocommerce deverão ter voltado a funcionar com o formulário e sistema de comentários padrão do WordPress. Se você conferir também os comentários em posts, o Disqus também deverá estar funcionando perfeitamente.

A solução acima simplesmente remove o Disqus do tipo de post “product” que é o que o Woocommerce utiliza para mostrar seus novos produtos, resolvendo assim o conflito.

Espero ter ajudado e até o próximo!

Incluir itens no menu do WordPress pode ser algo bastante simples dependendo do que o desenvolvedor precisa. Ao invés de criar um “Walker” customizado e modificar todo o menu, é possível simplesmente utilizar o hook wp_nav_menu_items para incluir itens no começo ou no final do menu principal.

Por exemplo, suponhamos que eu queira adicionar um link manualmente no começo do menu do WordPress para algo relevante, por exemplo, ícones ou links de redes sociais, formulário de pesquisa ou coisas do tipo.

Ficaria mais ou menos assim:

add_filter( 'wp_nav_menu_items', 'teo_add_menu_item', 10, 2 );
function teo_add_menu_item ( $items, $args ) {

	// Antes
    $novos  = '<li><a href="#">Um item qualquer</a></li>';
    $novos .= '<li><a href="#">Outro item qualquer</a></li>';
    $novos .= '<li><a href="#">Outro item qualquer</a></li>';
    $novos .= '<li><a href="#">Outro item qualquer</a></li>';

    // Insere os novos itens
    $items = $novos . $items;

    // Retorna
    return $items;
}

Claro que você pode utilizar sua super criatividade de desenvolvedor para criar coisas incríveis com o trecho de código acima. Ele adiciona itens no início do menu.

Se você tem interesse em adicionar algo no final do menu, simplesmente utilize o seguinte:

// Adiciona um formulário de pesquisa no final do menu
add_filter( 'wp_nav_menu_items', 'teo_add_menu_item', 10, 2 );
function teo_add_menu_item ( $items, $args ) {
    $form_action = get_bloginfo('url');

    // Depois
    $items .= '<li>
	<a class="teo-search-form-icon" href="#"><i class="fa fa-search"></i></a>

	<div class="sub-menu teo-nav-form">
	<form action="' . $form_action . '">
	<input type="text" name="s" placeholder="Pesquisar">
	</form>
	</div>
	</li>';

    return $items;
}

Além disso, não se esqueça que você também pode combinar os trechos de código que mostrei com as conditional tags para criar algo ainda mais dinâmico.

Bom, acho que é isso. Se você tiver alguma dúvida qualquer, não hesite em perguntar aí nos comentários, você estará deixando este post mais completo.

Até o próximo!

Remover Sticky Posts da consulta principal do WordPress é algo bastante simples, e existem vários motivos pelos quais você poderia querer fazer isso se estiver criando um tema novo.

Primeiramente, um Sticky Post é aquele que é marcado pelo escritor para ser apresentado como “Destaque” no tema que estiver instalado no WordPress do mesmo. Eles também são chamados de “Posts fixos” (por aparecerem sempre primeiro) ou simplesmente “Destaques” (por serem apresentados em local de destaque no tema).

Para criar um post fixo, o escritor deve marcar a caixa “Fixar este post na página inicial” na “Visibilidade” do mesmo. Veja um exemplo:

Criando Sticky Posts

Criando Sticky Posts

Um dos motivos mais interessantes para o uso de Sticky Posts no WordPress, seria gerar uma nova consulta apenas com esse tipo de post e apresentá-lo em local diferenciado e com maior destaque no tema. Um exemplo disso seria nosso tema “Letícia“, que exibe posts fixos em um Carousel do Bootstrap 3 no topo da página.

Se você não remover os Sticky Posts da consulta principal do WordPress, terá duplicação de conteúdo, ou seja, o mesmo post aparecerá na consulta que criou para seus destaques e na consulta principal.

Para remover tal duplicidade de conteúdo, simplesmente adicione a seguinte função no seu arquivo “functions.php“.

/**
 * Remove posts fixos.
 *
 * Remove posts fixos da consulta principal apenas na front-page e na home
 */
function teo_remove_sticky( $query = false ) {

	// Verifica se a consulta está sendo realizada na front-page ou na home
	if ( @is_front_page() || @is_home() ) { 
		// Remove os sticky posts da consulta (posts fixos)
		$query->set(
			'post__not_in',
			get_option( 'sticky_posts' )
		);
	}

} // teo_remove_sticky

// Adiciona a ação
add_action('pre_get_posts','teo_remove_sticky');

Apenas lendo os comentários lhe dará grande ajuda para modificar a função caso precise.

No trecho acima, estou removendo os “Sticky posts” da consulta principal do WordPress apenas na “Front page” e na “Home”. Isso não afetará nenhuma outra parte do tema.

Caso tenha dúvidas, deixa-a nos comentários.

Até a próxima.

O Customizer API do WordPress permite criar opções no tema que você estiver desenvolvendo, ou em um tema que você já utiliza. Além disso, também permite a utilização do live preview para que o usuário possa visualizar alterações ao-vivo antes de salvar e colocar o novo conteúdo no ar.

Uma das partes mais interessantes do Customizer API do WordPress para o desenvolvedor, é que ele é um framework que facilita a criação de opções do tema, já que não é necessário se preocupar com design ou a criação de uma nova página para que o usuário possa alterar o tema em questão. Ele já vem pronto para adicionar controles de campos de texto, checkbox, radio, textareas, cores, upload de imagens, widgets, menus e mais. Na verdade, um desenvolvedor será capaz de adicionar alterações para total configuração do tema em live preview sem dores de cabeça ou dificuldades.

Caso você ainda não conheça esta opção, todo e qualquer tema WordPress apresenta opções que fazem uso do Customizer API, mesmo que um desenvolvedor não adicione nenhuma opção no tema ativo. Por falar em “tema ativo”, um tema não precisa necessariamente estar ativo para que o usuário possa alterar suas opções utilizando o Live Preview (Pré-visualização ao-vivo).

Para acessar o Live Preview, simplesmente acesse a opção “Aparência” – “Personalizar” no seu Painel do WordPress.

Acessando o Live Preview do WordPress

Acessando o Live Preview do WordPress

Dentro do Live Preview serão apresentadas as opções divididas por seções, exemplo: Identidade do site, Imagem do cabeçalho, Menus, Widgets, e qualquer outra que o desenvolvedor queira adicionar.

Dentro das sessões você poderá encontrar as opções do tema, que poderão alterar quaisquer partes do tema que o desenvolvedor preferir.

Vamos ver em mais detalhes como adicionar sessões, configurações e controles para fazer uso do Customizer API do WordPress.

Como funciona o Customizer API para o desenvolvedor

O Customizer API do WordPress requer pelo menos o seguinte para funcionar corretamente:

  • Uma seção – add_section()
  • Uma configuração – add_setting()
  • Uma controle – add_control()

Além disso, é necessário adicionar tudo isso dentro de uma função PHP para que você possa utilizar o gancho customize_register  do WordPress.

Veja um exemplo básico para adicionar uma seção que contém apenas um campo:

<?php
/**
 * Função para registrar as opções do customizer
 */
function funcao_do_customizer( $wp_customize ) {
    /**
     * Define a sessão
     * Para este exemplo nossa sessão terá o ID "campos_de_texto", título "Textos" e
     * descrição "Altere os textos do seu tema."
     */
    $wp_customize->add_section(
        'campos_de_texto',
        array(
            'title'       => 'Textos',
            'description' => 'Altere os textos do seu tema.',
            'priority'    => 30,
        )
    );

    /**
     * Adiciona uma nova setting
     * O interessante aqui é que você pode definir um valor padrão e o modo como 
     * o transport será realizado.
     */
    $wp_customize->add_setting(
        'campo1', // campo
        array(
            'default'   => '', // Valor padrão 
            'transport' => 'refresh', // Transport
        )
    );


    /**
     * Adiciona um control
     * Aqui você trata do campo que será exibido.
     */
    $wp_customize->add_control(new WP_Customize_Control(
        $wp_customize,
        "campo1", // campo
        array(
            "label"    => "Label do campo 1", // Rótulo do campo
            "section"  => "campos_de_texto", // Sessão que o campo será exibido
            "settings" => "campo1", // A settings do campo
            "type"     => "text", // Tipo do campo
        )
    ));
}

// Utiliza o gancho para adicionar nossa função
add_action( 'customize_register', 'funcao_do_customizer' );
?>

Os comentários no código acima poderão lhe ajudar a entender melhor o que estamos fazendo.

Observação: O trecho de código acima poderá ser adicionado diretamente no arquivo functions.php do seu WordPress.

O trecho de código anteriormente exibido criará uma seção de “Textos” no Live Preview do WordPress. Dentro dela, temos apenas um campo.

Veja uma imagem mostrando a sessão:

A seção "Textos" foi criada pelo código exibido

A seção “Textos” foi criada pelo código exibido

Veja como ficou dentro da seção com a configuração e campo que criamos:

Dentro da seção "Textos"

Dentro da seção “Textos”

Observação: Para este exemplo, estou utilizando o tema Twenty Fifteen que já vem por padrão na última versão do WordPress.

Agora que você já entendeu o básico, vamos adicionar alguns campos mais complexos.

Campos de texto

Vamos criar um formulário completo dentro da seção de textos que acabamos de criar, fique atento aos comentários do código, eles irão descrever o que precisamos.

<?php
/**
 * Função para registrar as opções do customizer
 */
function funcao_do_customizer( $wp_customize ) {
    // -------------------------------------------------------------------------
    // Seção
    // Ela será utilizada em todos os campos do formulário
    // -------------------------------------------------------------------------
    $wp_customize->add_section(
        'campos_de_texto',
        array(
            'title'       => 'Textos',
            'description' => 'Altere os textos do seu tema.',
            'priority'    => 30,
        )
    );

    // -------------------------------------------------------------------------
    // Input do tipo "text"
    // -------------------------------------------------------------------------

    // Setting do campo1
    $wp_customize->add_setting(
        'campo1', // campo1
        array(
            'default'   => '', // Valor padrão 
            'transport' => 'refresh', // Transport
        )
    );
    // Controle do campo1
    $wp_customize->add_control(new WP_Customize_Control(
        $wp_customize,
        "campo1", // campo1
        array(
            "label"    => "Label do campo 1", // Rótulo do campo
            "section"  => "campos_de_texto", // A seção
            "settings" => "campo1", // Settings do campo
            "type"     => "text", // Input do tipo "text"
        )
    ));

    // -------------------------------------------------------------------------
    // Input do tipo "checkbox"
    // -------------------------------------------------------------------------

    // Setting do campo2
    $wp_customize->add_setting(
        'campo2', // campo2
        array(
            'default'   => '', // Valor padrão 
            'transport' => 'refresh', // Transport
        )
    );
    // Controle do campo2
    $wp_customize->add_control(new WP_Customize_Control(
        $wp_customize,
        "campo2", // campo2
        array(
            "label"    => "Label do campo 2", // Rótulo do campo
            "section"  => "campos_de_texto", // A seção
            "settings" => "campo2", // Settings do campo
            "type"     => "checkbox", // Input do tipo "checkbox"
        )
    ));

    // -------------------------------------------------------------------------
    // Input do tipo "radio"
    // -------------------------------------------------------------------------

    // Setting do campo3
    $wp_customize->add_setting(
        'campo3', // campo3
        array(
            'default'   => '', // Valor padrão 
            'transport' => 'refresh', // Transport
        )
    );
    // Controle do campo3
    $wp_customize->add_control(new WP_Customize_Control(
        $wp_customize,
        "campo3", // campo3
        array(
            "label"    => "Label do campo 3", // Rótulo do campo
            "section"  => "campos_de_texto", // A seção
            "settings" => "campo3", // Settings do campo
            "type"     => "radio", // Input do tipo "radio",

            // Para "radio" é necessário adicionar um array de escolhas
            "choices"  => array(
                "escolha-1" => "Escolha 1",
                "escolha-2" => "Escolha 2",
                "escolha-3" => "Escolha 3",
            ),
        )
    ));

    // -------------------------------------------------------------------------
    // Área de texto do tipo "textarea"
    // -------------------------------------------------------------------------

    // Setting do campo4
    $wp_customize->add_setting(
        'campo4', // campo4
        array(
            'default'   => '', // Valor padrão 
            'transport' => 'refresh', // Transport
        )
    );
    // Controle do campo4
    $wp_customize->add_control(new WP_Customize_Control(
        $wp_customize,
        "campo4", // campo4
        array(
            "label"    => "Label do campo 4", // Rótulo do campo
            "section"  => "campos_de_texto", // A seção
            "settings" => "campo4", // Settings do campo
            "type"     => "textarea", // Área de texto do tipo textarea
        )
    ));

    // -------------------------------------------------------------------------
    // Escolhas do tipo "select"
    // -------------------------------------------------------------------------

    // Setting do campo5
    $wp_customize->add_setting(
        'campo5', // campo5
        array(
            'default'   => '', // Valor padrão 
            'transport' => 'refresh', // Transport
        )
    );
    // Controle do campo5
    $wp_customize->add_control(new WP_Customize_Control(
        $wp_customize,
        "campo5", // campo5
        array(
            "label"    => "Label do campo 5", // Rótulo do campo
            "section"  => "campos_de_texto", // A seção
            "settings" => "campo5", // Settings do campo
            "type"     => "select", // Escolhas do tipo "select"

            // Para "select" é necessário adicionar um array de escolhas
            "choices"  => array(
                "escolha-1" => "Escolha 1",
                "escolha-2" => "Escolha 2",
                "escolha-3" => "Escolha 3",
            ),            
        )
    ));

    // -------------------------------------------------------------------------
    // FIM
    // -------------------------------------------------------------------------
} // funcao_do_customizer

// Utiliza o gancho para adicionar nossa função
add_action( 'customize_register', 'funcao_do_customizer' );
?>

Por parecer muito código, mas é bastante simples. Se você observar, são blocos de código que estão divididos em partes para gerar novos campos.

O trecho de código acima deverá gerar um formulário com a maioria dos tipos de campo que você possa precisar: text, checkbox, radio, textarea e select. Veja como o formulário é apresentado no Live Preview do WordPress.

Formulário gerado no Live Preview do WordPress

Formulário gerado no Live Preview do WordPress

Tudo feito de maneira simples e rápida. Agora vamos analisar outros tipos de campos, como cores e upload de imagens.

Campos de escolha de cores

Os campos de escolha de cores facilitam demais a vida do usuário, já que ele poderá escolher a cor que mais preferir sem ter que ficar buscando códigos de cores HTML pela Internet. Além disso, poderá visualizar alterações em tempo real.

Para gerar um campo de cores, vamos utilizar a mesma seção que estávamos utilizando anteriormente. Apesar de ser possível criar quantas seções você preferir, vamos gerar tudo no mesmo formulário.

Observação: Ao invés de postar o código completo, vou postar apenas o bloco de códigos necessários. Perceba que o trecho de código abaixo deverá ser adicionado dentro da nossa função funcao_do_customizer() .

Veja como adicionar opções de escolha de cores:

// -------------------------------------------------------------------------
// Escolhas de cores
// -------------------------------------------------------------------------

// Setting do campo6
$wp_customize->add_setting(
    'campo6', // campo6
    array(
        'default'   => '', // Valor padrão 
        'transport' => 'refresh', // Transport
    )
);
// Controle do campo6
$wp_customize->add_control( new WP_Customize_Color_Control( 
    $wp_customize, 
    'campo6', 
    array(
        'label' => 'Label do campo 6',
        'section' => 'campos_de_texto',
    ) 
));

O trecho de código acima deverá adicionar um campo para que o usuário escolha uma cor qualquer.

Escolha de cores

Escolha de cores

Outra parte muito interessante para o nosso formulário, seria permitir que o usuário faça upload de imagens utilizando o customizer API. E não é que isso também é bastante simples, veja na próxima seção.

Upload de imagens com o Customizer API do WordPress

Seguindo o mesmo exemplo do trecho de código anterior, veja como adicionar um campo de upload de imagens dentro do Live Preview do WordPress:

// Setting do campo7
$wp_customize->add_setting(
    'campo7', // campo7
    array(
        'default'   => '', // Valor padrão 
        'transport' => 'refresh', // Transport
    )
);
// Controle do campo7
$wp_customize->add_control( new WP_Customize_Media_Control( 
    $wp_customize, 
    'campo7', 
    array(
        'label' => 'Label do campo7',
        'section' => 'campos_de_texto',
        'mime_type' => 'image',
    ) 
));

O trecho de código acima permitirá que o usuário faça upload, remova ou altere imagens diretamente do Live Preview do WordPress.

Upload de imagens dentro do Live Preview

Upload de imagens dentro do Live Preview

Simples assim!

Mas e agora? Como vou utilizar isso dentro do meu tema? Mais simples do que você imagina, veja na próxima seção.

Utilizando opções do customizer API do WordPress dentro do tema

Para acessar qualquer opção salva dentro do Live Preview pelo customizer API do WordPress, simplesmente utilize a seguinte função:

<?php echo get_theme_mod(campo1); ?>

Nesse caso estou utilizando a função get_theme_mod para pegar o texto diretamente do “campo1” da nossa função. Se você é um desenvolvedor, poderá fazer coisas incríveis utilizando o “Customizer API do WordPress” juntamente com a função get_theme_mod.

Por exemplo, vamos pegar o campo de cor e gerar uma DIV com um background qualquer, veja:

<?php 
// Obtem a cor ou utiliza #000000
$cor = get_theme_mod(campo6, "#000000"); 
?>

<div style="width: 100%; height: 100px; background-color: <?php echo $cor; ?>">
</div>

O pequeno trecho de código acima deverá gerar algo parecido com:

Exemplo de utilização do Customizer API do WordPress

Exemplo de utilização do Customizer API do WordPress

Quer um exemplo real?

Se você precisa de um tema que utiliza o Customizer API do WordPress em seu código para realizar personalizações em tempo real do tema, adquira nosso Tema WordPress Premium Letícia no link abaixo:

Além de bonito e elegante, ele também faz uso da API que acabei de descrever no texto acima.

Até o próximo.

Permitir posts por usuários no WordPress (ou qualquer conteúdo) sem que seja necessário login, não é uma tarefa muito complicada. De fato, também existe uma função, chamada de wp_insert_post, que serve exatamente para isso, assim como existe uma função para praticamente tudo no CMS.

O problema da função wp_insert_post é que ela insere o conteúdo sem verificar nada, você só precisa dizer quais os valores que serão enviados e ela fará o resto para você. Com isso, não teremos verificações nem coisas do tipo.

Neste artigo você verá como criar um formulário e tratar os valores para que os usuários tenham a possibilidade de enviar conteúdo para seu blog. Como cada pessoa vai precisar de uma coisa específica, vou criar um plugin genérico como base para seu desenvolvimento. Tudo muito simples e direto. Você fará o restante conforme precisar.

Criando um plugin

Já explicamos como criar um plugin do WordPress aqui no Tutsup, portanto, se ainda não viu tal tutorial, segue o link:

Para nosso objetivo, crie uma pasta dentro de wp-content/plugins chamada de tutsup-posts-usuarios.

Pasta do nosso plugin

Pasta do nosso plugin

Dentro dessa pasta, crie um arquivo chamado de tutsup-posts-usuarios.php com o seguinte conteúdo:

<?php
/* 
Plugin Name: Tutsup Posts Usuários
Plugin URI: http://www.todoespacoonline.com/w/
Description: Permite envio de posts por usuários.
Version: 0.0.1
Author: Luiz Otávio Miranda
Author URI: http://www.todoespacoonline.com/w/
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

Esses são os dados do nosso plugin, você pode modificar conforme preferir.

Ative o plugin pelo painel administrativo do WordPress.

Classe do nosso plugin

Dentro do arquivo do nosso plugin, vamos trabalhar com classes PHP (PHP Orientado a Objetos). Se você ainda não tem experiência com OOP, segue um tutorial de introdução e o nosso curso básico:

Primeiramente vamos verificar se a classe existe, em seguida vamos criar a classe e carregar a mesma, veja:

/**
 * TpPostsUsuarios
 *
 * Essa é a classe geral do nosso plugin
 */
if ( ! class_exists('TpPostsUsuarios') ) {

	class TpPostsUsuarios
	{
    
            // MÉTODOS VIRÃO AQUI
     
	} // TpPostsUsuarios
	
	/* Loads the class */
	$TutsupContato = new TpPostsUsuarios();
    
} // class_exists('TpPostsUsuarios')

Vamos trabalhar na parte “MÉTODOS VIRÃO AQUI” da classe, onde criaremos todas as propriedades e métodos necessários para o nosso plugin.

Propriedade de erro

Vamos criar uma propriedade estática dentro da nossa classe para manter os erros. Por erros, quero dizer algo que o usuário tenha feito de maneira incorreta, como não preencher todos os campos e coisas do tipo.

Para criar uma propriedade estática, faça o seguinte:

/*
 * Caso ocorra um erro, utilizaremos esta propriedade para exibi-lo
 */
public static $erro;

Ao decorrer da classe, vamos preenchendo essa propriedade de acordo com o tempo que os erros vão ocorrendo.

Caso ocorra algum erro, não enviaremos os dados para o WordPress, apenas exibiremos o erro dentro do formulário para o usuário.

Método construtor

O método construtor de uma classe PHP é carregado assim que ela for instanciada, isso quer dizer que ele carregará o que precisarmos assim que o plugin for ativado no WordPress.

Para nosso método construtor, vamos carregar dois outros métodos:

  • registra_posts_usuarios – Vamos registrar um Custom Post Type específico para posts dos usuários;
  • envia_dados – Vamos registrar este método para receber os dados enviados pelo usuário para que possamos validar os campos.

Veja como ficou nosso método construtor:

/**
 * Construtor da classe
 * 
 * Carrega todos os métodos que precisamos ao instanciar a classe.
 */
public function __construct() {
    add_action( 'init', array( $this, 'registra_posts_usuarios' ) );
    add_action( 'parse_request', array( $this, 'envia_dados' ) );
}

Agora precisamos criar os métodos que estamos carregando dentro do construtor.

Método registra_posts_usuarios

Este método será responsável por criar o Custom Post Type específico para os posts enviados pelos usuários, veja:

/**
 * Registra um custom post type exclusivo para os usuários
 */
public function registra_posts_usuarios() {
    $labels = array(
        'name'               => 'Posts externos',
        'singular_name'      => 'Post externo',
        'menu_name'          => 'Posts externos',
        'name_admin_bar'     => 'Posts externos',
        'add_new'            => 'Novo',
        'add_new_item'       => 'Novo',
        'new_item'           => 'Novo',
        'edit_item'          => 'Editar',
        'view_item'          => 'Visualizar',
        'all_items'          => 'Posts externos',
        'search_items'       => 'Encontrar',
        'parent_item_colon'  => 'Pais:',
        'not_found'          => 'Nada encontrado.',
        'not_found_in_trash' => 'Nada encontrado.',
    );
     
    $args = array(
        'labels'             => $labels,
        'public'             => true,
        'publicly_queryable' => true,
        'show_ui'            => true,
        'show_in_menu'       => true,
        'query_var'          => true,
        'capability_type'    => 'post',
        'has_archive'        => true,
        'hierarchical'       => false,
        'menu_position'      => null,
        'rewrite'            => array('slug' => '_tp_posts_externos'),
        'can_export'         => true,
        /*'taxonomies'         => array('post_tag'),*/
        'supports'           => array(
            'title',
            'editor',
            'author',
            /*'thumbnail',*/  
            /*'excerpt',*/
            /*'trackbacks',*/
            /*'custom-fields',*/
            /*'comments',*/
            /*'revisions',*/
            /*'page-attributes',*/
            /*'post-formats'*/
        ),
    );
     
    // Registra o custom post
    register_post_type( '_tp_posts_externos', $args );        
}

Veja que existem várias coisas comentadas no Custom Post Type acima, são coisas que não vou precisar, mas você pode remover os comentários se preferir.

Isso deverá criar o seguinte no painel administrativo do WordPress.

Nosso Custom Post Type

Nosso Custom Post Type

Os dados enviados por usuários estarão dentro desse Custom Post.

Método envia_dados

Este método é responsável por receber os dados enviados pelo formulário que vamos criar. Como você vai perceber, toda a validação dos campos será adicionada nele.

/**
 * Este método irá receber os dados enviados pelo formulário
 */
public function envia_dados () {
    
    /* Verifica se os dados do formulário foram enviados */
    if ( 
        'POST' != $_SERVER['REQUEST_METHOD'] 
        || ! isset( $_POST['_tp_titulo'] )
        || ! isset( $_POST['_tp_conteudo'] )
    ) {
        return;
    }

    // Configura o post para uma variável
    $dados = $_POST;
    
    // Título
    $titulo = !empty($dados['_tp_titulo']) ? $dados['_tp_titulo'] : null;
    $titulo = sanitize_text_field($titulo);
    
    // Conteúdo
    $conteudo = !empty($dados['_tp_conteudo']) ? $dados['_tp_conteudo'] : null; 
    
    // Verifica se os campos tem algum valor
    if ( ! $titulo || ! $conteudo ) {
        self::$erro = 'Você deve preencher todos os campos!';
        return;
    }
    
    // Verifica o campo nonce
    if ( 
        ! isset( $_POST['tutsup_posts_nonce'] ) 
        || ! wp_verify_nonce( $_POST['tutsup_posts_nonce'], 'tutsup_posts_usuarios' ) 
    ) {
        self::$erro = 'Erro ao enviar formulário!';
        return;
    }
    
    // Cria os dados do post
    $dados_post = array(
      'post_title'    => $titulo, // Título do post
      'post_content'  => $conteudo, // Conteúdo do post
      'post_status'   => 'pending', // Status do post
      'post_type'     => '_tp_posts_externos', // Tipo do post
      'post_author'   => 2 // Autor do post
    );

    // Tenta inserir o post
    $post_id = wp_insert_post( $dados_post );

    // Se o post for inserido com sucesso, teremos o ID do mesmo
    if ( ! $post_id ) {
        self::$erro = 'Erro ao enviar post!';
        return;
    }
}

O método acima deverá estar ligado diretamente ao formulário que iremos criar posteriormente, pois, campos validados acima serão enviados por tal formulário.

Se você precisar de mais valores no Custom Post, analise a função wp_insert_post. Caso precise de meta dados para os posts, utilize o ID retornado após o post ser criado.

Método formulário

Este método é simplesmente um formulário HTML que podemos inserir em qualquer parte do nosso tema.

/**
 * Este é um formulário HTML muito básico
 */
public function formulario() {
    
    // Variável temporária para nosso erro
    $erro = null;
    
    // Verifica se existe algum erro e exibe
    if ( self::$erro ) {
        $erro = '<p>' . self::$erro . '</p>';
    } 
    // Se não houver erros e o formulário foi enviado, o post foi
    // Inserido com sucesso
    elseif (
        ! self::$erro 
        && isset( $_POST['_tp_titulo'] ) 
        && isset( $_POST['_tp_conteudo'] ) 
    ) {
        $erro = '<p>Dados enviados com sucesso!</p>';
    }
    ?>
    
    <form action="" method="post">
    
    <p>
        Título:<br>
        <input type="text" value="<?php 
        echo esc_attr(stripslashes(@$_POST['_tp_titulo']));
        ?>" name="_tp_titulo">
    </p>
    
    <p>
        Conteúdo:<br>
        <textarea name="_tp_conteudo"><?php 
        echo esc_attr(stripslashes(@$_POST['_tp_conteudo']));
        ?></textarea>
    </p>
    
    <p>
        <?php
        // Mostra o erro (se não houver um erro, mostra nada)
        echo $erro;
        
        // Adiciona nosso campo nonce
        wp_nonce_field('tutsup_posts_usuarios', 'tutsup_posts_nonce');
        ?>
        <input type="submit" value="Enviar">
    </p>
    
    </form>
    
    <?php
}

Este método é responsável pelo nosso formulário, ou seja, o que será exibido para o usuário. O campo “nonce” é responsável pela segurança dos dados enviados pelo nosso formulário, isso significa que nossa classe apenas validará os campos, se o campo nonce vier do nosso formulário, nenhum outro.

Nosso plugin completo

Veja como ficou os dados do nosso plugin:

<?php
/* 
Plugin Name: Tutsup Posts Usuários
Plugin URI: http://www.todoespacoonline.com/w/
Description: Permite envio de posts por usuários.
Version: 0.0.1
Author: Luiz Otávio Miranda
Author URI: http://www.todoespacoonline.com/w/
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/**
 * TpPostsUsuarios
 *
 * Essa é a classe geral do nosso plugin
 */
if ( ! class_exists('TpPostsUsuarios') ) {

	class TpPostsUsuarios
	{
        
        /*
         * Caso ocorra um erro, utilizaremos esta propriedade para exibi-lo
         */
        public static $erro;
		
        /**
         * Construtor da classe
         * 
         * Carrega todos os métodos que precisamos ao instanciar a classe.
         */
		public function __construct() {
            // Registra um custom post exclusivo para os usuários
            add_action( 'init', array( $this, 'registra_posts_usuarios' ) );
            add_action( 'parse_request', array( $this, 'envia_dados' ) );
		}
        
        /**
         * Registra um custom post type exclusivo para os usuários
         */
        public function registra_posts_usuarios() {
            $labels = array(
                'name'               => 'Posts externos',
                'singular_name'      => 'Post externo',
                'menu_name'          => 'Posts externos',
                'name_admin_bar'     => 'Posts externos',
                'add_new'            => 'Novo',
                'add_new_item'       => 'Novo',
                'new_item'           => 'Novo',
                'edit_item'          => 'Editar',
                'view_item'          => 'Visualizar',
                'all_items'          => 'Posts externos',
                'search_items'       => 'Encontrar',
                'parent_item_colon'  => 'Pais:',
                'not_found'          => 'Nada encontrado.',
                'not_found_in_trash' => 'Nada encontrado.',
            );
             
            $args = array(
                'labels'             => $labels,
                'public'             => true,
                'publicly_queryable' => true,
                'show_ui'            => true,
                'show_in_menu'       => true,
                'query_var'          => true,
                'capability_type'    => 'post',
                'has_archive'        => true,
                'hierarchical'       => false,
                'menu_position'      => null,
                'rewrite'            => array('slug' => '_tp_posts_externos'),
                'can_export'         => true,
                /*'taxonomies'         => array('post_tag'),*/
                'supports'           => array(
                    'title',
                    'editor',
                    'author',
                    /*'thumbnail',*/  
                    /*'excerpt',*/
                    /*'trackbacks',*/
                    /*'custom-fields',*/
                    /*'comments',*/
                    /*'revisions',*/
                    /*'page-attributes',*/
                    /*'post-formats'*/
                ),
            );
             
            // Registra o custom post
            register_post_type( '_tp_posts_externos', $args );        
        }
        
        /**
         * Este método irá receber os dados enviados pelo formulário
         */
        public function envia_dados () {
            
            /* Verifica se os dados do formulário foram enviados */
            if ( 
                'POST' != $_SERVER['REQUEST_METHOD'] 
                || ! isset( $_POST['_tp_titulo'] )
                || ! isset( $_POST['_tp_conteudo'] )
            ) {
                return;
            }
        
            // Configura o post para uma variável
            $dados = $_POST;
            
            // Título
            $titulo = !empty($dados['_tp_titulo']) ? $dados['_tp_titulo'] : null;
            $titulo = sanitize_text_field($titulo);
            
            // Conteúdo
            $conteudo = !empty($dados['_tp_conteudo']) ? $dados['_tp_conteudo'] : null; 
            
            // Verifica se os campos tem algum valor
            if ( ! $titulo || ! $conteudo ) {
                self::$erro = 'Você deve preencher todos os campos!';
                return;
            }
            
            // Verifica o campo nonce
            if ( 
                ! isset( $_POST['tutsup_posts_nonce'] ) 
                || ! wp_verify_nonce( $_POST['tutsup_posts_nonce'], 'tutsup_posts_usuarios' ) 
            ) {
                self::$erro = 'Erro ao enviar formulário!';
                return;
            }
            
            // Cria os dados do post
            $dados_post = array(
              'post_title'    => $titulo, // Título do post
              'post_content'  => $conteudo, // Conteúdo do post
              'post_status'   => 'pending', // Status do post
              'post_type'     => '_tp_posts_externos', // Tipo do post
              'post_author'   => 2 // Autor do post
            );

            // Tenta inserir o post
            $post_id = wp_insert_post( $dados_post );

            // Se o post for inserido com sucesso, teremos o ID do mesmo
            if ( ! $post_id ) {
                self::$erro = 'Erro ao enviar post!';
                return;
            }
        }
        
        /**
         * Este é um formulário HTML muito básico
         */
        public function formulario() {
            
            // Variável temporária para nosso erro
            $erro = null;
            
            // Verifica se existe algum erro e exibe
            if ( self::$erro ) {
                $erro = '<p>' . self::$erro . '</p>';
            } 
            // Se não houver erros e o formulário foi enviado, o post foi
            // Inserido com sucesso
            elseif (
                ! self::$erro 
                && isset( $_POST['_tp_titulo'] ) 
                && isset( $_POST['_tp_conteudo'] ) 
            ) {
                $erro = '<p>Dados enviados com sucesso!</p>';
            }
            ?>
            
            <form action="" method="post">
            
            <p>
                Título:<br>
                <input type="text" value="<?php 
                echo esc_attr(stripslashes(@$_POST['_tp_titulo']));
                ?>" name="_tp_titulo">
            </p>
            
            <p>
                Conteúdo:<br>
                <textarea name="_tp_conteudo"><?php 
                echo esc_attr(stripslashes(@$_POST['_tp_conteudo']));
                ?></textarea>
            </p>
            
            <p>
                <?php
                // Mostra o erro (se não houver um erro, mostra nada)
                echo $erro;
                
                // Adiciona nosso campo nonce
                wp_nonce_field('tutsup_posts_usuarios', 'tutsup_posts_nonce');
                ?>
                <input type="submit" value="Enviar">
            </p>
            
            </form>
            
            <?php
        }
        
	} // TpPostsUsuarios
	
	/* Loads the class */
	$TutsupContato = new TpPostsUsuarios();
    
} // class_exists('TpPostsUsuarios')

Isso ainda não permite recebermos posts por usuários no WordPress, ainda precisamos chamar o nosso formulário dentro do tema.

Editando seu tema

Em qualquer parte do seu tema (fora do loop), adicione o seguinte:

<?php
if ( class_exists('TpPostsUsuarios') ) {
    $posts_usuarios = new TpPostsUsuarios();
    
    echo $posts_usuarios->formulario();
}
?>

Isso deverá exibir o formulário para o usuário enviar os posts.

Nosso formulário simples

Nosso formulário simples

Basta preencher e visualizar os dados na sua área administrativa.

Download do código

Caso queira baixar o plugin que criamos acima, utilize o link abaixo:

Instale, ative o plugin e adicione o seguinte no seu tema:

<?php
if ( class_exists('TpPostsUsuarios') ) {
    $posts_usuarios = new TpPostsUsuarios();
    
    echo $posts_usuarios->formulario();
}
?>

Edite conforme precisar!

Concluindo

Conforme descrevi no início do artigo, este plugin é uma base para que você conclua conforme suas necessidades. Não há nenhuma verificação de permissões de usuários ou coisas do tipo, portanto, você deve concluir essa operação.

Se você deseja tirar alguma dúvida, basta comentar aí abaixo.

Utilizar ajax no WordPress é ainda mais simples do que se você tivesse que utilizar Ajax puro. Isso pela inclusão do jQuery e algumas funcionalidades já prontas do CMS.

Você só vai precisar de um arquivo JavaScript e uma função no seu arquivo functions.php para executar o que você desejar.

Então vamos aos códigos.

Criando o script JavaScript

A primeira coisa que vamos fazer é criar um arquivo JavaScript. Este arquivo vai conter apenas nosso Ajax.

Para este tutorial, estou utilizando o tema Tutsup Two. Nele já existe uma pasta chamada “js”, que é onde colocamos todos os scripts necessários para fazer o tema e as opções do tema funcionarem corretamente. Vou criar um arquivo chamado “nosso-ajax.js“.

Veja seu conteúdo:

jQuery(document).ready(function($) { 
    var buscar = 'termo que vamos buscar';
    
    $.ajax({
        url: ajaxurl, // Isso será definido no functions.php
        type: 'POST',
        data: {
            'action': 'acao_do_ajax', // Ação do Ajax
            's': buscar // O que vamos postar para $_POST
        },
        success: function( response ){
            $('.tp-sidebar-content').prepend(response);
        }
    });
});

Acima você pode perceber que temos uma função ajax comum. Se você não sabe muito sobre JavaScript, veja nosso tutorial:

Um fato curioso no código acima é que a variável ajaxurl não estará definida fora do painel administrativo do WordPress. Vamos contornar essa situação utilizando nosso arquivo functions.php posteriormente.

Importante: Preste atenção no nome da ação “action”, você vai precisar desse nome para o callback do Ajax (a função que o Ajax vai executar para obter valores).

Adicionando o JavaScript ao tema

Para adicionar o JavaScript que contém o Ajax em nosso tema, vamos incrementar o seguinte em nosso functions.php:

// Função para adicionar nosso script
function javascript_do_ajax() {
    
    // Define a variável ajaxurl
    $script  = '<script>';
    $script .= 'var ajaxurl = "' . admin_url('admin-ajax.php') . '";';
    $script .= '</script>';
    echo $script;
		    
    // Nosso ajax (js/nosso-ajax.js)
    wp_enqueue_script(
        'nosso-ajax', 
        get_template_directory_uri() . '/js/nosso-ajax.js', 
        array('jquery'), 
        '0.0.1',
        true
    );
    
}
// Adiciona no rodapé
add_action( 'wp_footer', 'javascript_do_ajax' );

Veja que acima estamos definindo a variável “ajaxurl“. Isso só será necessário quando estivermos tentando executar o Ajax fora da área administrativa.

Outro fato importante é que a função está sendo executada no hook wp_footer, se você estiver criando algo dentro da área administrativa, o hook será admin_footer.

Isso é simplesmente para adicionar nosso script às nossas páginas, nada mais.

Função do Ajax

Agora vamos criar a função que o Ajax vai executar dentro do nosso arquivo functions.php. Essa função, é como se fosse o arquivo que o Ajax carrega para retornar valores.

Vou fazer um loop de pesquisa só para você entender:

// Ação de callback do Ajax
function acao_do_ajax() {

    /* 
    Abaixo vou fazer um loop de pesquisa para buscar pelo termo que colocamos
    no javascript
    */
    $loop = new WP_Query(
        array(
            's'              => $_POST['s'], // Este é o termo que virá do JS
            'posts_per_page' => 5,
        )
    );
    ?>

    <?php if ( $loop->have_posts() ): ?>
        <?php while ( $loop->have_posts() ): ?>

            <?php $loop->the_post(); ?>
            
            <ul>
                <li>
                    <a href="<?php the_permalink();?>">
                        <?php the_title();?>
                    </a>
                </li>
            </ul>
            
        <?php endwhile; ?>
    <?php else: ?>    
        <p>Nada encontrado para "<?php echo $_POST['s'];?>".</p>
    <?php endif; ?>

    <?php wp_reset_postdata(); 

    die();
}
/* 
 * wp_ajax_ + ação que colocamos no JavaScript, função de callback
 * Em: 
 * data: {
 *     'action': 'acao_do_ajax', // Ação do Ajax
 *     's': buscar // O que vamos postar para $_POST
 * },
 */
add_action( 'wp_ajax_acao_do_ajax', 'acao_do_ajax' );

Tudo o que estiver dentro da função, será retornado para o Ajax. Por exemplo, se eu exibir apenas um “OI”, tipo:

echo "OI";

Isso será retornado para a variável “response” que criamos no JavaScript. A partir disso você pode fazer o que preferir com os valores.

Importante: O die() ao final realmente é necessário para que o Ajax não tenha que ler o restante das funções do seu arquivo functions.php.

Depurando

Para depurar se tudo está correto, você pode utilizar o console dos navegadores mais modernos. Por exemplo, no Firefox basta pressionar CTRL + SHIFT + Q.

Depurando o que foi enviado para o Ajax

Depurando o que foi enviado para o Ajax

Veja na imagem acima, que podemos visualizar praticamente tudo. Dados que foram enviados, qual foi a resposta, podemos analisar o “Console” para visualizar erros e coisas do tipo.

Concluindo

Caso tenha algum dúvida, basta comentar aí abaixo.

Fonte: http://codex.wordpress.org/AJAX_in_Plugins

Criar um plugin do WordPress requer menos trabalho do que criar um tema, dependendo do que ele fará (é claro). Muitos desenvolvedores enchem o arquivo functions.php de um tema em busca de atingir um objetivo que, algumas vezes, seria melhor utilizar um plugin, onde o usuário final pode ativar e desativar tal funcionalidade quando preferir.

Usuários não querem trabalhar com coisas complicadas, ou reaprender coisas que já sabem. Por este motivo, é muito importante que você utilize os recursos que já existem no WordPress, ao invés de tentar reinventar a roda.

Por exemplo, ao invés de criar uma página de opções totalmente diferente do que o usuário já conhece do painel administrativo do WordPress no seu tema, você pode criar vários plugins sem opção nenhuma que podem ser ativados e desativados conforme a necessidade.

Por outro lado, você também pode criar uma página de opções dentro de qualquer plugin do WordPress, dando a opção para o usuário configurar o que ele achar necessário. Fica a seu critério.

Tudo depende do que você precisa adicionar somado à facilidade de uso para seu cliente. As possibilidades são infinitas, somente limitadas pela sua imaginação e conhecimento sobre o WordPress.

Vamos aprender como criar um plugin simples do WordPress com classes PHP abaixo.

WordPress local

Antes que você inicie, nunca trabalha em nenhum servidor que esteja em produção. Instale o WordPress localmente em seu computador para não correr riscos.

Se você não tem intimidade com servidores WAMP, siga nossos tutoriais abaixo:

E se tiver quaisquer dúvidas, comente no artigo que a encontrar.

Criando a pasta do seu plugin

Depois que você já tiver o WordPress instalado e funcional no seu computador, abra a pasta wp-content/plugins/ e crie uma nova pasta com o nome do seu plugin.

Não utilize acentos ou espaços no nome da pasta.

Para nosso exemplo, vou criar uma pasta chamada tutsup-plugin.

Pasta do nosso plugin

Pasta do nosso plugin

Conforme a imagem acima.

Agora vamos trabalhar somente dentro dessa pasta. Todos os arquivos descritos daqui em diante estarão nela.

Arquivo principal do seu plugin

Agora vamos criar o arquivo principal do seu plugin. Também nomeado com o mesmo nome da pasta, mais a extensão .php.

Para nosso exemplo: tutsup-plugin.php

Arquivo principal do nosso plugin

Arquivo principal do nosso plugin

Não se preocupe com os outros arquivos presentes na pasta acima, vou detalhar o que eles fazem posteriormente nesse artigo.

Detalhes do plugin

Na primeira linha do arquivo principal, você precisará detalhar seu plugin da seguinte maneira.

<?php
/* 
Plugin Name: Tutsup Plugin
Plugin URI: http://www.todoespacoonline.com/w/
Description: Essa é a descrição do meu plugin.
Version: 0.0.1
Author: Luiz Otávio Miranda
Author URI: http://www.todoespacoonline.com/w/
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

Preencha os dados de cada linha com os valores que achar necessário. O restante do código do seu plugin virá abaixo do trecho de código acima.

Classe do plugin

A primeira coisa que você deve saber é o que o seu plugin fará. Para o nosso plugin, vamos criar apenas um shortcode do WordPress que irá executar um método da classe assim que ele for executado. Em outras palavras, vamos exibir uma frase simples, apenas para você entender como o desenvolvimento de plugins WordPress funciona.

Vamos verificar se não existe nenhuma classe com o mesmo nome da classe que vamos criar, e em seguida, criaremos a mesma. Veja:

/**
 * Classe tutsup plugin
 * 
 * Carrega um shortcode para exibir um texto simples
 */
 
// Verifica se não existe nenhum classe com o mesmo nome
if ( ! class_exists('TutsupPlugin') ) {

	class TutsupPlugin
	{
    
        /**
         * Este é o construtor da classe. Tudo aqui será executado quando o 
         * plugin for ativado.
         */
        public function __construct() {
            /* Adiciona o shortcode */
            add_shortcode( 'tutsup-plugin', array( $this, 'MetodoSimples' ) );
        }
        
        /**
         * Este é um método simples que irá exibir o texto do nosso shortcode
         */
        public function MetodoSimples () {
            return '<p>Parabéns, você acabou de criar um plugin do WordPress.</p>';
        }
        
	} // TutsupPlugin

	/* Carrega a classe */
	$tutsup_settings = new TutsupPlugin();
    
} // class_exists

Como você pode perceber acima, você precisa de um pouco de conhecimento sobre PHP para criar plugins. Felizmente, fiz um pequeno curso que pode o ajudar nessa jornada. Seguem os links:

A classe do nosso plugin contém dois métodos; um construtor e o método que será executado pelo nosso shortcode.

O construtor, na minha opinião, é o mais importante deles. Nele você pode chamar qualquer ação que você executaria no seu arquivo functions.php. A única diferença é que, como estamos tratando de classes PHP, temos que chamar os métodos no seguinte formato:

add_shortcode( 'tutsup-plugin', array( 'NomeDaClasse', 'NomeDoMetodo' ) );

Apenas substituindo “NomeDaClasse” por “$this”, caso esteja tratando de um método não estático.

O segundo método (MetodoSimples ) é como se fosse uma função PHP comum, porém, é um método dentro de uma classe.

Ativando o plugin

Agora podemos acessar o painel administrativo do WordPress e, em plugin, ativar nosso danado.

Ativando nosso plugin

Ativando nosso plugin

E pronto, seu plugin já estará pronto para ser utilizado.

Testando o plugin

Para testar o plugin que acabamos de criar, basta criar um novo post com o shortcode [tutsup-plugin]. Veja:

Novo artigo com o shortcode

Novo artigo com o shortcode

Isso deverá gerar o seguinte:

Saída do shortcode

Saída do shortcode

Claro que este é apenas um exemplo mostrando como as coisas são simples. Elas podem ficar bem mais complexas conforme você preferir.

Em um plugin do WordPress, você pode utilizar tudo o que você utiliza no arquivo functions.php do seu tema e mais um pouco.

Arquivo readme.txt

Se você tem a intenção de enviar o seu plugin para o diretório de plugins do WordPress, provavelmente vai querer uma descrição detalhada sobre tudo do seu plugin, certo? Isso pode ser feito através do arquivo readme.txt, basta seguir o formato abaixo:

=== Tutsup Plugin ===
Contributors: todoespacoonline
Donate link: http://www.todoespacoonline.com/w/
Tags: tags
Requires at least: 3.0.1
Tested up to: 4.0
Stable tag: 0.0.1
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

Breve descrição do plugin.

== Description ==

Descrição longa do seu plugin.

== Installation ==

1. Envie o plugin para a pasta `/wp-content/plugins/`
1. Ative pela área administrativa do WordPress.

== Frequently Asked Questions ==

= Esse plugin faz isso mesmo? =

Sim, faz!

== Screenshots ==

1. Descrição do screenshot.

== Changelog ==

= 0.0.1 =
* Desenvolvimento do plugin.

Você poderá testar este arquivo no Readme Validator.

Arquivo uninstall.php

Para o nosso plugin, o arquivo uninstall.php não tem utilidade. Ele é executado na desinstalação do plugin para remover quaisquer vestígios que você tenha deixado no WordPress do seu cliente, como opções salvas na base de dados e coisas do tipo.

Veja um exemplo:

<?php
//if uninstall not called from WordPress exit
if ( !defined( 'WP_UNINSTALL_PLUGIN' ) ) 
    exit();

// Deleta as opções
delete_option( 'tutsup_plugin' );
delete_site_option( 'tutsup_plugin' );

E pronto! Agora o usuário nem vai saber que um dia teve seu plugin instalado em seu CMS.

Concluindo

Este foi um tutorial básico para você entender a criação de plugins do WordPress, claro que você pode e deve incrementar seu próprio plugin da maneira que for conveniente para sua aplicação ou tema.

Em caso de dúvidas, não deixe de comentar.

Provavelmente você já deve ter visto milhares de sites WordPress com Perfil do autor abaixo do post, onde aparece uma pequena biografia, seus links para redes sociais, sua foto e o link de sua página.

Nesse artigo você vai aprender a fazer exatamente isso.

Adicionando os campos extras no perfil

Antes de qualquer coisa, vamos adicionar campos de perfil para as redes sociais do autor, mais especificamente, Twitter, Facebook e Google+.

Eu já expliquei como fazer isso no último tutorial sobre “Campos extras no perfil do usuário WordPress“, todavia, adicione o seguinte no seu functions.php.

/*-----------------------------------------------------------------------------*
  Novos campos de contato
*-----------------------------------------------------------------------------*/

if ( ! function_exists('tutsup_new_contact_fields') ) {

    function tutsup_new_contact_fields( $contact_fields ) {
        // Twitter
        $contact_fields['twitter'] = 'Twitter';
        
        // Facebbok
        $contact_fields['facebook'] = 'Facebook';
        
        // Google+
        $contact_fields['googleplus'] = 'Google+';

        return $contact_fields;
    } // tutsup_new_contact_fields
    
    add_filter('user_contactmethods', 'tutsup_new_contact_fields', 10, 1);
    
} // function_exists

Agora acesse seu painel administrativo (seu perfil) e preencha os campos com os valores que preferir.

Criando a função

Ao invés de termos que escrever todo o código diretamente nos arquivos de template toda vez que for necessário, vamos criar uma função dentro do arquivo functions.php e depois executaremos essa função.

Adicione o seguinte:

<?php
/*-----------------------------------------------------------------------------*
  Área do autor
*-----------------------------------------------------------------------------*/

if ( ! function_exists('tutsup_author_area') ) {

    function tutsup_author_area() {
        
        // Apenas apresentaremos a área do autor em posts na íntegra
        if ( is_single() ):
            $author_id = get_the_author_meta( 'ID' );
?>
            
            <!-- Área do autor -->
            <div class="tp-author-area clearfix">
            
                <!-- Conteúdo interno da área do autor -->
                <div class="tp-inner-author-area">
                    
                    <!-- Gravatar -->
                    <div class="tp-author-gravatar">
                    
                        <a class="tp-author-link" href="<?php echo esc_url( get_author_posts_url( $author_id ) ); ?>">
                            <?php echo get_avatar( get_the_author_meta( 'user_email' ), 150 ); ?>
                        </a>
                    
                    </div> <!-- tp-author-gravatar -->
                    
                    <!-- Texto sobre o autor -->
                    <p class="tp-about-autor-text">
                        <?php _e('Sobre o autor', 'tutsup'); ?>
                    </p>
                    
                    <!-- Nome e link do autor -->
                    <h3 class="tp-about-autor-heading">
                        <a href="<?php echo get_author_posts_url( $author_id );?>">
                            <?php echo get_the_author(); ?>
                        </a>
                    </h3>
                    
                    <!-- Descrição do autor -->
                    <div class="tp-author-info">
                    
                        <?php the_author_meta( 'description' ); ?>
                        
                        <!-- Links sociais -->
                        <p class="tp-social-links clearfix">	
                        
                        <?php if ( get_the_author_meta( 'facebook', $author_id ) ): ?>
                            <a class="tp-author-social-link" href="<?php 
                                echo get_the_author_meta( 'facebook', $author_id ); 
                            ?>">Facebook</a>  
                        <?php endif;?>
                        
                        <?php if ( get_the_author_meta( 'googleplus', $author_id ) ): ?>
                            <a class="tp-author-social-link" href="<?php 
                                echo get_the_author_meta( 'googleplus', $author_id ); 
                            ?>?rel=author" rel="author">Google+</a> 
                        <?php endif;?>
                        
                        <?php if ( get_the_author_meta( 'twitter', $author_id ) ): ?>
                            <a class="tp-author-social-link" href="<?php 
                                echo get_the_author_meta( 'twitter', $author_id  ); 
                            ?>">Twitter</a>
                        <?php endif;?>
                    
                        </p>
                        
                    </div> <!-- tp-author-info -->
                    
                </div> <!-- tp-inner-author-area -->
            </div> <!-- tp-author-area -->
        
        <?php endif; // is_single() ?>
<?php
    } // tutsup_author_area
} // function_exists
?>

Pronto, agora podemos chamar a função dentro dos nossos arquivos de modelo.

Executando a função

Abra um arquivo de template que contenha o loop do WordPress e adicione o seguinte:

<?php tutsup_author_area();?>

Só isso é suficiente para os dados serem apresentados na tela (sem nenhum estilo configurado).

Por exemplo, estou utilizando o tema TwentyFourteen (padrão do WordPress). Nele, basta adicionar o código acima ao final do arquivo “content.php“.

Adicionando o estilo CSS (style.css)

Agora adicione o seguinte no arquivo “style.css”:

.clearfix:after {
    content: '.';
    width: 100%;
    display: block;
    clear: both;
    height: 0;
    line-height: 0;
    visibility: hidden;
    overflow: hidden;
}
.tp-author-area{
    padding: 15px 0;
    margin: 0;
}
.tp-inner-author-area{
    /* Para ajustar ao twentyfourteen - edite conforme seu tema*/
    max-width: 478px;
    border-top: 1px solid #eee;
    padding: 15px 0;
    margin: 0 auto;
    padding: 10px;
}

.tp-author-area .tp-author-gravatar {
    float: left;
    margin: 0 15px 15px 0;
    width: 100px;
    height: 100px;
}
.tp-author-area .tp-author-gravatar img {
    border-radius: 50%;
    max-width: 100%;
    height: auto;
}
.tp-author-link{}
.tp-author-area .tp-about-autor-text, .tp-author-area .tp-about-autor-heading{
    margin: 0;
    padding: 0;
    text-transform: uppercase;
}
.tp-author-area .tp-about-autor-text {
    margin-bottom: 5px;
}
.tp-author-area .tp-about-autor-heading {
    margin: 10px 0 20px 0;
    clear: none;
    font-size: 30px;
}
.tp-author-info{
    clear: both;
}
.tp-author-area .tp-social-links{
    margin: 10px 0;
}
.tp-author-area .tp-author-social-link{
    color: #fff;
    padding: 2px 5px;
    background: #24890d;
}
.tp-author-area .tp-author-social-link:hover{
    color: #fff;
}

Isso é suficiente para gerar o seguinte:

Perfil do autor abaixo do post no WordPress

Perfil do autor abaixo do post no WordPress

Você pode estilizar com CSS conforme preferir.

Concluindo

Você pode utilizar a função tutsup_author_area() no local onde achar melhor dentro dos seus loops, você pode até mesmo executar essa função fora do loop com o ID do autor se preferir.

Em caso de dúvidas, basta comentar.

Campos extras no perfil do usuário WordPress podem ser bastante úteis se usados com sabedoria, você pode incluir telefones, e-mails, links para as redes sociais e coisas do tipo.

No WordPress é bastante simples incluir novos campos para qualquer contato que desejar, basta incluir um pequeno trecho de código no seu functions.php e depois exibir o campos conforme preferir.

Veja o código a ser inserido no functions.php:

/*-----------------------------------------------------------------------------*
  Novos campos de contato
*-----------------------------------------------------------------------------*/

if ( ! function_exists('tutsup_new_contact_fields') ) {

    function tutsup_new_contact_fields( $contact_fields ) {
        // Twitter
        $contact_fields['twitter'] = 'Twitter';

        return $contact_fields;
    } // tutsup_new_contact_fields
    
    add_filter('user_contactmethods', 'tutsup_new_contact_fields', 10, 1);
    
} // function_exists

No trecho acima, inseri apenas o Twitter como novo campo de contato. Isso vai aparecer na configuração do Usuário dentro do seu perfil.

Se quiser incluir mais campos, siga o modelo abaixo:

/*-----------------------------------------------------------------------------*
  Novos campos de contato
*-----------------------------------------------------------------------------*/

if ( ! function_exists('tutsup_new_contact_fields') ) {

    function tutsup_new_contact_fields( $contact_fields ) {
        // Twitter
        $contact_fields['twitter'] = 'Twitter';
        
        // Facebbok
        $contact_fields['facebook'] = 'Facebook';
        
        // Google+
        $contact_fields['googleplus'] = 'Google+';

        return $contact_fields;
    } // tutsup_new_contact_fields
    
    add_filter('user_contactmethods', 'tutsup_new_contact_fields', 10, 1);
    
} // function_exists

Agora, além do Twitter, temos Facebook e Google+.

Adicione quantos campos forem necessários para seu tema ou plugin.

Veja como fica na área administrativa:

Campos extras no perfil do usuário WordPress

Campos extras no perfil do usuário WordPress

Veja como obter o valor em qualquer um dos campos acima em qualquer local do seu tema ou plugin:

<?php 
// O ID do autor
$author_id = get_the_author_meta( 'ID' ); 
?>

<!-- Facebook -->
<?php if ( get_the_author_meta( 'facebook', $author_id ) ): ?>
    <a class="tp-author-social-link" href="<?php 
        echo get_the_author_meta( 'facebook', $author_id ); 
    ?>">Facebook</a>  
<?php endif;?>

<!-- Google+ -->
<?php if ( get_the_author_meta( 'googleplus', $author_id ) ): ?>
    <a class="tp-author-social-link" href="<?php 
        echo get_the_author_meta( 'googleplus', $author_id ); 
    ?>?rel=author" rel="author">Google+</a> 
<?php endif;?>

<!-- Twitter -->
<?php if ( get_the_author_meta( 'twitter', $author_id ) ): ?>
    <a class="tp-author-social-link" href="<?php 
        echo get_the_author_meta( 'twitter', $author_id  ); 
    ?>">Twitter</a>
<?php endif;?>

No trecho acima, capturamos todos os novos campos que criamos. Você deverá adaptar o código conforme os novos campos que criou no seu arquivo functions.php.

Observação: Todo o código acima é o mesmo que existe em nosso tema Tutsup Two.

Caso tenha alguma dúvida, não hesite em deixar um comentário.