Articles

O Guia Completo para Tipos de Postagem Personalizados do WordPress

Posted on
Daniel PatakiDaniel Pataki

Sobre o Autor

Hello, Eu sou Daniel e faço coisas para a web. Sou o CTO em Kinsta e escrevo para várias publicações espantosas como Smashing Magazine e …Mais aboutDaniel↬

  • 15 min read
  • WordPress,Techniques
  • Savado para leitura offline
  • Share no Twitter, LinkedIn

/div>

/div>>/div>>/div>>/div>

/div>/div>>/div>

WordPress tem vindo a ganhar uma posição de destaque no jogo CMS geral há já alguns anos, mas o verdadeiro avanço foi o mecanismo do tipo post personalizado que permite a criação de uma grande variedade de conteúdos. Vejamos como isto veio a ser e todas as opções que esta grande funcionalidade oferece.

WordPress tem vindo a ganhar uma posição no jogo do sistema de gestão geral de conteúdos (CMS) há já alguns anos, mas o verdadeiro avanço foi o mecanismo do tipo post personalizado que permite a criação de uma grande variedade de conteúdos. Vejamos como isto surgiu e todas as opções que esta grande funcionalidade oferece.

wordpress custom post type
alguns dos tipos de posts personalizados que pode criar no WordPress.

Como era costume

Na prática, os tipos de posts personalizados já existem há muito tempo, mais especificamente desde 17 de Fevereiro de 2005, quando o WordPress 1.5 adicionou suporte para páginas estáticas, criando o campo de base de dados post_type.

Leitura adicional sobre o SmashingMag:

  • Página de Arquivo Personalizada para WordPress
  • Um Guia Detalhado de Modelos de Página Personalizados para WordPress
  • Customizing WordPress Archives For Categories, Tags
  • Building A Custom Archive Page For WordPress

The function has been around since WordPress 1.0, por isso quando o campo post_type foi implementado em 1.5, poderia simplesmente definir o valor post_type ao inserir um post. Claro que a criação e gestão de tipos de posts personalizados exigia muito mais do que isso, mas a quantidade de codificação necessária tornou-se cada vez menos à medida que as funções do WordPress se tornaram cada vez mais flexíveis.

Pela versão 2.8, a função e algumas outras coisas úteis foram adicionadas às construções nocturnas, e quando 2.9 saiu, as funções tornaram-se disponíveis para todos. Nesta altura, não eram necessários códigos e hacks extensivos para fazer do WordPress um CMS completo; poderia usar muitas funções incorporadas para fazer o WordPress fazer o seu lance.

O que o WordPress pode fazer por si agora

Um tipo de post personalizado nada mais é do que um post regular com um valor diferente post_type na base de dados. O tipo de postagem regular é post, páginas utilizam page, anexos utilizam attachment e assim por diante. Pode agora criar o seu próprio para indicar o tipo de conteúdo criado. Pode criar tipos de posts personalizados para livros, filmes, resenhas, produtos e assim por diante.

Se criado correctamente, pode conseguir o seguinte com algumas linhas de código:

  • O tipo de post personalizado aparecerá no verso como um item de menu separado com a sua própria lista de posts e a página “adicionar novo”
  • Navigating to http://mysite.com/customposttype/ irá levá-lo à página de arquivo para o tipo de post. Isto é semelhante a visitar a página da frente para os últimos posts do tipo “post”.
  • Categorias e etiquetas podem ser disponibilizadas ao tipo de post personalizado, ou pode criar taxonomias personalizadas.

Parte destes, pode modificar inúmeras opções, tais como onde o tipo de post personalizado deve ser colocado no menu, se for pesquisável, que nível de utilizador pode aceder ao mesmo, se for hierárquico, regras de reescrita personalizadas, etc.

Diferentes tipos de conteúdo têm diferentes requisitos de dados. Para postagens regulares, será necessário especificar o autor, categoria, data e assim por diante. Para um tipo de publicação personalizada “livro”, o ideal seria ter a opção de especificar o autor do livro, a contagem de páginas, género, editora e outros dados específicos do livro. Usando meta-caixas personalizadas, isto é facilmente conseguido e gerido também.

Caixas personalizadas permitem adicionar caixas adicionais ao ecrã de edição de um post. Normalmente utilizam campos personalizados, pelo que também se podem utilizar campos personalizados, mas separando alguns campos personalizados como meta-caixas, é possível criar uma administração muito mais suave e utilizável.

Trabalhar com tipos de correio personalizados

Para criar e usar eficazmente tipos de correio personalizados, terá de estar familiarizado com o seguinte:

  • Criar tipos de correio personalizados,
  • Criar taxonomias personalizadas,
  • Criar meta-caixas personalizadas.

Criar tipos de postagem personalizados,

P>Primeiro na nossa agenda é criar o próprio tipo de postagem. O ideal seria criar um plugin quando se trabalha com tipos de correio personalizados, mas se não souber como, ou apenas precisar de um teste rápido, pode usar o ficheiro functions.php no seu tema.

function my_custom_post_product() { $args = array(); register_post_type( 'product', $args ); }add_action( 'init', 'my_custom_post_product' );

Na sua forma mais simples, criará um tipo de correio que quase não tem personalização. Não será público, não aparecerá na administração, as mensagens de interacção serão as mesmas que os posts (“post guardado”, “post actualizado”, etc.) e assim por diante. Para adaptar o nosso novo tipo de mensagem às nossas necessidades, passarei por algumas das opções mais frequentemente utilizadas e adicioná-las-ei ao anterior vazio $args array.

function my_custom_post_product() { $labels = array( 'name' => _x( 'Products', 'post type general name' ), 'singular_name' => _x( 'Product', 'post type singular name' ), 'add_new' => _x( 'Add New', 'book' ), 'add_new_item' => __( 'Add New Product' ), 'edit_item' => __( 'Edit Product' ), 'new_item' => __( 'New Product' ), 'all_items' => __( 'All Products' ), 'view_item' => __( 'View Product' ), 'search_items' => __( 'Search Products' ), 'not_found' => __( 'No products found' ), 'not_found_in_trash' => __( 'No products found in the Trash' ), 'parent_item_colon' => ’, 'menu_name' => 'Products' ); $args = array( 'labels' => $labels, 'description' => 'Holds our products and product specific data', 'public' => true, 'menu_position' => 5, 'supports' => array( 'title', 'editor', 'thumbnail', 'excerpt', 'comments' ), 'has_archive' => true, ); register_post_type( 'product', $args ); }add_action( 'init', 'my_custom_post_product' );
  • labels A opção labels deve ser um array que defina as diferentes etiquetas que um tipo de postagem personalizada pode ter. Separei isto acima apenas para tornar mais claros os argumentos para registar um tipo de postagem.
  • description Uma breve explicação do nosso tipo de postagem personalizada; o que faz e porque o utilizamos.
  • public Esta opção controla um monte de coisas de uma só vez. A sua concretização irá colocar um monte de outras opções (todas relacionadas com a visibilidade) em realidade. Por exemplo, é possível ter o tipo de postagem personalizada visível mas não consultável. Mais sobre isto mais tarde.
  • menu_position Define a posição do menu do tipo de postagem personalizada na parte de trás. Definindo-o para “5” coloca-o abaixo do menu “posts”; quanto mais alto o definir, mais baixo o menu será colocado.
  • supports Esta opção define os controlos WordPress predefinidos que estão disponíveis no ecrã de edição para o tipo de post personalizado. Por defeito, apenas o campo de título e o editor são mostrados. Se desejar adicionar suporte para comentários, revisões, formatos de postagem e tais, terá de os especificar aqui. Para uma lista completa, consulte a secção de argumentos no Codex.
  • has_archive Se definido como verdadeiro, serão criadas regras de reescrita para si, permitindo um arquivo de tipo de post em http://mysite.com/posttype/ (por defeito)
Um tipo de post personalizado no menu.
Um tipo de postagem personalizada no menu.

Depois de configurar isto, deverá ver a entrada do menu para o tipo de postagem personalizada. Deverá ser possível adicionar mensagens, ver a lista de mensagens no administrador e também visitar as mensagens publicadas no website.

Como mencionei, há muitas coisas que pode modificar ao criar um tipo de mensagem. Sugiro que veja a lista de argumentos no Codex para uma descrição completa de cada opção e os possíveis valores.

Mensagens de Interacção Personalizadas

WordPress gera um número de mensagens desencadeadas por acções do utilizador. Actualização, publicação, pesquisa, etc., no back-end, tudo leva a mensagens que – por defeito – são adaptadas a mensagens regulares. Pode alterar facilmente o texto destas mensagens usando o post_updated_messages hook.

function my_updated_messages( $messages ) { global $post, $post_ID; $messages = array( 0 => ’, 1 => sprintf( __('Product updated. <a href="%s">View product</a>'), esc_url( get_permalink($post_ID) ) ), 2 => __('Custom field updated.'), 3 => __('Custom field deleted.'), 4 => __('Product updated.'), 5 => isset($_GET) ? sprintf( __('Product restored to revision from %s'), wp_post_revision_title( (int) $_GET, false ) ) : false, 6 => sprintf( __('Product published. <a href="%s">View product</a>'), esc_url( get_permalink($post_ID) ) ), 7 => __('Product saved.'), 8 => sprintf( __('Product submitted. <a target="_blank" href="%s">Preview product</a>'), esc_url( add_query_arg( 'preview', 'true', get_permalink($post_ID) ) ) ), 9 => sprintf( __('Product scheduled for: <strong>%1$s</strong>. <a target="_blank" href="%2$s">Preview product</a>'), date_i18n( __( 'M j, Y @ G:i' ), strtotime( $post->post_date ) ), esc_url( get_permalink($post_ID) ) ), 10 => sprintf( __('Product draft updated. <a target="_blank" href="%s">Preview product</a>'), esc_url( add_query_arg( 'preview', 'true', get_permalink($post_ID) ) ) ), ); return $messages;}add_filter( 'post_updated_messages', 'my_updated_messages' );
Uma mensagem personalizada após guardar um produto.
Uma mensagem personalizada depois de guardar um produto.

Como se pode ver, este não é o método de gestão de mensagens mais fácil de utilizar. Uma matriz associativa seria muito melhor; poderíamos ver para que serve cada mensagem sem ter de ler a mensagem real.

Notificação de que pode alterar as mensagens para todos os tipos de correio personalizados usando esta função única. A matriz $messages contém as mensagens para todos os tipos de mensagens, pelo que pode modificá-las todas aqui. Eu pessoalmente crio uma função para cada tipo de mensagem apenas para poder agrupar facilmente a criação do tipo de mensagem e as mensagens personalizadas.

Ajuda Contextual

Uma característica que raramente vejo implementada é a ajuda contextual personalizada. Como utilizador, eu próprio nunca utilizei esta funcionalidade, mas tenho a certeza de que muitas pessoas o fazem; de qualquer modo, é bom dar alguma ajuda aos utilizadores menos experientes.

A funcionalidade de ajuda contextual é uma aba descendente que pode ser vista no canto superior direito das páginas, quando disponível. Vamos ver como o conteúdo pode ser alterado.

function my_contextual_help( $contextual_help, $screen_id, $screen ) { if ( 'product' == $screen->id ) { $contextual_help = '<h2>Products</h2> <p>Products show the details of the items that we sell on the website. You can see a list of them on this page in reverse chronological order - the latest one we added is first.</p> <p>You can view/edit the details of each product by clicking on its name, or you can perform bulk actions using the dropdown menu and selecting multiple items.</p>'; } elseif ( 'edit-product' == $screen->id ) { $contextual_help = '<h2>Editing products</h2> <p>This page allows you to view/modify product details. Please make sure to fill out the available boxes with the appropriate details (product image, price, brand) and <strong>not</strong> add these details to the product description.</p>'; } return $contextual_help;}add_action( 'contextual_help', 'my_contextual_help', 10, 3 );

Isto também é um pouco difícil porque tem de saber a identificação do ecrã em que se encontra. Se imprimir o conteúdo da variável $screen, deverá ser capaz de determinar facilmente o ID. Esta é também uma função que pode utilizar para modificar de uma só vez a ajuda contextual de todos os tipos de correio personalizados, mas eu pessoalmente recomendo agrupar isto juntamente com os dois blocos anteriores e utilizá-lo apenas para um tipo de correio personalizado de cada vez.

Overview

Para recapitular rapidamente, utilizámos três funções para criar um tipo de correio personalizado “completo”. Utilizámos register_post_type() para criar o próprio tipo de mensagem e dois ganchos – contextual_help e post_updated_messages – para criar orientações úteis e mensagens relevantes respectivamente.

Taxonomias Personalizadas

As suas mensagens regulares no blog utilizam categorias e etiquetas para criar uma estrutura organizacional. No entanto, a mesma organização não faz necessariamente sentido para tipos de posts personalizados. Os seus posts no blog podem ser sobre a sua “Vida”, os seus “Pensamentos” ou os seus “Sonhos”. Estes não são obviamente apropriados para produtos.

Este é o problema que levou os programadores a criar taxonomias personalizadas. Pode criar uma taxonomia separada chamada “Categorias de Produtos” para alojar categorias que utiliza apenas para produtos. Kevin Leary escreveu um grande artigo sobre taxonomias personalizadas no WordPress que recomendo vivamente, por isso só entrarei em pequenos detalhes aqui.

function my_taxonomies_product() { $args = array(); register_taxonomy( 'product_category', 'product' $args );}add_action( 'init', 'my_taxonomies_product', 0 );

Simplesmente aos tipos de posts personalizados, pode criar uma taxonomia muito facilmente, mas precisa de trabalhar um pouco para a adaptar às suas necessidades. As taxonomias personalizadas comportam-se um pouco melhor fora da caixa, uma vez que são públicas por defeito, pelo que o acima exposto é de facto suficiente para ligar esta taxonomia aos postes do produto. Vejamos um exemplo personalizado.

function my_taxonomies_product() { $labels = array( 'name' => _x( 'Product Categories', 'taxonomy general name' ), 'singular_name' => _x( 'Product Category', 'taxonomy singular name' ), 'search_items' => __( 'Search Product Categories' ), 'all_items' => __( 'All Product Categories' ), 'parent_item' => __( 'Parent Product Category' ), 'parent_item_colon' => __( 'Parent Product Category:' ), 'edit_item' => __( 'Edit Product Category' ), 'update_item' => __( 'Update Product Category' ), 'add_new_item' => __( 'Add New Product Category' ), 'new_item_name' => __( 'New Product Category' ), 'menu_name' => __( 'Product Categories' ), ); $args = array( 'labels' => $labels, 'hierarchical' => true, ); register_taxonomy( 'product_category', 'product', $args );}add_action( 'init', 'my_taxonomies_product', 0 );

Como pode ver, não mudou muito. Adicionámos algumas etiquetas e definimos a opção hierárquica como verdadeira. Isto permite taxonomias de “estilo de categoria”. Quando definida como falsa (este é o padrão), a sua taxonomia será como as etiquetas padrão.

Existem algumas outras opções de potência disponíveis que pode ler no artigo de Leary, ou pode ir para a entrada Codex em register_taxonomy().

As Categorias de Produtos taxonomia personalizada.
As Categorias de Produtos taxonomia personalizada.

Post Meta Boxes

Meta boxes são as caixas arrastáveis que se vêem no ecrã de edição do WordPress para um post. Existem numerosas meta-caixas embutidas como os controlos de publicação, as taxonomias, a caixa do autor, etc., mas pode criar algumas para si.

Caixas Meta tendem a ser usadas para gerir dados de campos personalizados de uma forma muito mais fácil de utilizar do que a caixa de campos personalizados embutida. Uma vez que coloca os controlos no local, pode adicionar a verificação de erros do lado do cliente e muitas outras coisas chiques.

Justin Tadlock escreveu aqui o artigo personalizado da meta-caixa no Smashing Magazine, que é um artigo muito aprofundado sobre o assunto. Recomendo a sua leitura para o quadro completo, mas vou começar aqui.

p>Criar uma meta-caixa requer três passos:

  • Definir a própria caixa,
  • li>Definir o conteúdo da meta-caixa,li>Definir como os dados da meta-caixa são tratados.

Definir a meta-caixa

add_action( 'add_meta_boxes', 'product_price_box' );function product_price_box() { add_meta_box( 'product_price_box', __( 'Product Price', 'myplugin_textdomain' ), 'product_price_box_content', 'product', 'side', 'high' );}

O código acima cria a meta-caixa com os seguintes parâmetros (na ordem dada):

  • O identificador único da meta-caixa (não tem de corresponder ao nome da função),
  • O título da meta-caixa (visível para os utilizadores),
  • A função que exibirá o conteúdo da meta-caixa,
  • O tipo de poste a que a meta-caixa pertence,
  • A colocação da meta-caixa,
  • A prioridade da meta-caixa (determina “a que altura” é colocada).

Definindo o conteúdo da meta-caixa

function product_price_box_content( $post ) { wp_nonce_field( plugin_basename( __FILE__ ), 'product_price_box_content_nonce' ); echo '<label for="product_price"></label>'; echo '<input type="text" name="product_price" placeholder="enter a price" />';}

Esta é uma caixa simples que contém apenas o preço, por isso criámos uma etiqueta e um input para a gerir. Um campo nãoce também está presente, o que acrescenta segurança à submissão de dados.

Tratamento dos Dados Submetidos

Na maioria dos casos, desejará guardar os dados como um campo personalizado, mas não está de modo algum restrito a este método. Poderá utilizar a entrada para fazer uma chamada API de terceiros, para gerar um ficheiro XML ou o que lhe apetecer. O uso mais comum é guardar dados personalizados de correio, por isso vamos dar uma olhada em como isso é feito.

add_action( 'save_post', 'product_price_box_save' );function product_price_box_save( $post_id ) { if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) return; if ( !wp_verify_nonce( $_POST, plugin_basename( __FILE__ ) ) ) return; if ( 'page' == $_POST ) { if ( !current_user_can( 'edit_page', $post_id ) ) return; } else { if ( !current_user_can( 'edit_post', $post_id ) ) return; } $product_price = $_POST; update_post_meta( $post_id, 'product_price', $product_price );}

A maior parte desta função é tudo sobre segurança. Em primeiro lugar, se uma auto-salva está a ser realizada, nada acontece porque o utilizador não enviou o formulário. Depois o nonce é verificado, seguido de verificação de permissão. Se todos estes forem passados, pegamos nos nossos dados e adicionamo-los ao post usando o update_post_meta() function.

Um exemplo de uma meta caixa para um tipo de post de apartamento.
Um exemplo de meta-caixa para um tipo de poste de apartamento.

Displaying Your Content

Embora haja muitas nuances a todas as anteriores, deverá estar familiarizado com as noções básicas. Tudo o que resta é utilizar realmente os dados que agora temos e mostrar as coisas ao utilizador. Isto envolve mostrar mensagens – talvez de vários tipos de mensagens personalizadas e taxonomias – e usar os nossos metadados de mensagens.

Displaying Posts

Se criou um tipo de mensagem com o parâmetro has_archive definido como “verdadeiro”, o WordPress listará as suas mensagens na página de arquivo do tipo de mensagem. Se o seu tipo de mensagem for chamado “livros”, pode simplesmente ir a http://mysite.com/books/ e verá a sua lista de mensagens.

Esta página usa archive-.php para a exibição se existir (archive-books.php no nosso caso). Se não existir, utilizará archive.php e se não existir, utilizará index.php.

p> Outra forma de exibir conteúdos personalizados do tipo post é utilizar uma consulta personalizada com a classe WP_Query. Para exibir posts de um determinado tipo de post e taxonomia personalizada, poderia fazer algo como isto:

<?php $args = array( 'post_type' => 'product', 'tax_query' => array( array( 'taxonomy' => 'product_category', 'field' => 'slug', 'terms' => 'boardgames' ) ) ); $products = new WP_Query( $args ); if( $products->have_posts() ) { while( $products->have_posts() ) { $products->the_post(); ?> <h1><?php the_title() ?></h1> <div class='content'> <?php the_content() ?> </div> <?php } } else { echo 'Oh ohm no products!'; } ?>

Displaying Metadata

Metadata pode ser recuperado facilmente usando a função get_post_meta(). No nosso exemplo acima, guardámos um meta campo postado chamado product_price. Podemos recuperar o valor deste campo para um determinado post usando o seguinte código:

<?php // If we are in a loop we can get the post ID easily $price = get_post_meta( get_the_ID(), 'product_price', true ); // To get the price of a random product we will need to know the ID $price = get_post_meta( $product_id, 'product_price', true );?>

Palavras Finais

Como pode ver, criar um CMS é bastante fácil devido à natureza modular dos controlos e funções do WordPress. Os métodos aqui delineados podem ser usados extremamente bem para criar administradores personalizados para quase tudo o que se possa pensar.

Desde que a definição do conteúdo das meta-caixas depende completamente de si, tem o poder de criar características adicionais para os seus controlos, fazendo-o a si ou aos seus clientes muito felizes.

Pode levar este passo mais longe com páginas de administração personalizadas e conteúdo completamente personalizado, mas isso é uma história para outro dia.

Deixe uma resposta

O seu endereço de email não será publicado. Campos obrigatórios marcados com *