Creare un plugin WordPress per gestire i Custom Post Type

By Andrea Marchetti
@marchetti_design

Creare un plugin WordPress per gestire i Custom Post Type

I Custom Post Type sono uno potente strumento che WordPress mette a disposizione per creare e organizzare contenuti personalizzati.Per essere più chiari facciamo un esempio pratico, immaginiamo un:

Sito Portfolio

In questo sito i lavori non verranno inseriti in wordpress come articoli o pagine, ma come “Lavori” in una apposita sezione Portfolio.

Per creare questa sezione nel backend di wordpress creeremo un Custom Post Type Portfolio. Altri esempi di usi classici dei CPT sono i Servizi, i Prodotti e qualsiasi contenuto rilevante che non sia opportuno classificare come pagina o articolo.

Bene detto questo passiamo allo step successivo.

Custom Post Type definiti nel Tema

I Custom Post Type inzialmente venivano definiti nel file functions.php del tema di wordpress, questo può creare svantaggi e problemi vediamo perchè:

a) Non separiamo la Presentazione (il tema) dal contenuto (il Custom Post Type) questo perchè generiamo il Custom Post Type all’interno del tema.

b) Nel caso il tema venga cambiato perdiamo tutti i contentui del Custom Post definito nel tema precedente.

Per questo è molto meglio definire i Custom Post Type in un Plugin esterno.

1) Creazione del Plugin

Per creare un plugin in wordpress dobbiamo creare un cartella con il nome del nostro plugin in

wp-content –> plugins

nel nostro caso “portfolio-plugin”, al suo interno creiamo il file “portfolio-plugin.php”.

Come per i temi anche i plugin wordpress hanno bisogno di una intestazione dove passiamo tutte le informazioni necessarie a wordpress. Nel file portfolio-plugin.php quindi scriviamo le seguenti linee di codice.


<?php

/**
* Plugin Name: Portfolio Plugin
* Plugin URI: http://www.marchettidesign.net
* Description: This is a plugin to create <strong>Custom Post Type</strong>.
* Author: afmarchetti
* Author URI: http://www.marchettidesign.net/chi-sono
* Version: 1
*/
?>

Aggiungiamo il codice per la localizazzione (la possibilità di tradurre il plugin in più lingue) e creiamo una cartella lang all’interno della root del plugin.


//plugin translation
function portfolio_plugin_setup() {
load_plugin_textdomain(‘portfolio-plugin’, false, dirname(plugin_basename(__FILE__)) . ‘/lang/’);
} // end custom_theme_setup
add_action(‘after_setup_theme’, ‘portfolio_plugin_setup’);

(Vedremo nei prossimi articoli come tradurre il plugin).

Fatto questo ci apparirà il plugin nel backend di wordpress, ma non lo attiviamo ancora.

Schermata 2015-08-25 alle 12.32.49

2) Definzione del Custom Post Type

Passiamo alla parte cruciale la creazione del Custom Post Type. Sempre nel file portfolio-plugin.php inseriamo il codice che crea il Contenuto Tipo Personalizzato.


/* ————————————————————————- *
* CUSTOM POST TYPE Portfolio
/* ————————————————————————- */

add_action(‘init’, ‘create_portfolio’);

function create_portfolio() {

$labels = array(
‘name’ => __(‘Portfolio’ , ‘portfolio-plugin’),
‘singular_name’ => __(‘Portfolio’ , ‘portfolio-plugin’),
‘add_new’ => __(‘Add Work’, ‘portfolio-plugin’),
‘add_new_item’ => __(‘Add New Work’ , ‘portfolio-plugin’),
‘edit_item’ => __(‘Edit Work’, ‘portfolio-plugin’),
‘new_item’ => __(‘New Work’, ‘portfolio-plugin’),
‘all_items’ => __(‘All Works’, ‘portfolio-plugin’),
‘view_item’ => __(‘View Work’ , ‘portfolio-plugin’),
‘search_items’ => __(‘Search Work’ , ‘portfolio-plugin’),
‘not_found’ => __(‘Work Not found’, ‘portfolio-plugin’),
‘not_found_in_trash’ => __(‘Work Not found in the trash’, ‘portfolio-plugin’),
);

$args = array(
‘labels’ => $labels,
‘public’ => true,
‘rewrite’ => array(‘slug’ => ‘portfolio’),
‘has_archive’ => true,
‘hierarchical’ => true,
‘menu_position’ => 22,
‘menu_icon’ => ‘dashicons-welcome-write-blog’,
‘supports’ => array(
‘title’,
‘editor’,
‘thumbnail’,
‘excerpt’,
‘page-attributes’
),

);

register_post_type(‘portfolio’, $args);
}

Nel blocco labels, impostiamo i nomi dei vari elementi del backend, nel nostro caso Portfolio, Work e Works.

Nel blocco args definiamo le caratteristiche del Custom Post Type come,
la possibilità di visualizzare la pagina di archivio tramite:

 ‘has_archive’ => true 

la posizione nel menu con:

 ‘menu_position’ => 22 

l’icona da mostrare tramite

‘menu_icon’ => ‘dashicons-welcome-write-blog’ 

(qui l’elenco delle icone disponibili)

e le funzionalità supportate, nel nostro caso titolo, contenuto, immagine in evidenza, estratto e attributi pagina:

‘supports’           => array(
‘title’,
‘editor’,
‘thumbnail’,
‘excerpt’,
‘page-attributes’
),

Ora possiamo attivare il plugin e aggiungere un lavoro di prova.

Schermata 2015-08-25 alle 12.38.01

Porebbe essere necessario resettare i permalink di wordpress nella sezione: Impostazioni –> Permalink nel backend di wordpress. Io solitamente lo faccio per essere sicuro che tutto funzioni.

3) Presentazione dei contenuti nel tema

Ora che nel backend vediamo il lavoro pubblicato, dobbiamo visualizzarlo nel tema. Per fare questo possiamo o visualizzare la pagina archivio o utilizzare un loop personalizzato.

3.1) Pagina di archivio

Per visualizzare la pagina di archivio (è necessario avere permalink testuali) digitiamo l’url:

http://NOMESITO/portfolio

I lavori ci appariranno con il layout archive.php del tema corrente.

Schermata 2015-08-25 alle 12.39.49

3.2) Loop personalizzato

Se vogliamo avere più controllo sulla presentazione dei lavori possiamo creare un Custom Template, con all’interno un loop personalizzato che mostri i nostri lavori, ecco il codice necessario:


<?php

/*

Template Name: Portfolio

*/

?>
<?php get_header(); ?>

<?php

// Loop Works

$custom_query_args = array(
‘post_type’ => ‘portfolio’,
‘posts_per_page’ => 1,
‘orderby’ => ‘menu_order’,
‘order’ => ‘ASC’,
);

$custom_query = new WP_Query( $custom_query_args );

?>

<?php if ( $custom_query->have_posts() ) : while ( $custom_query->have_posts() ) : $custom_query->the_post(); ?>

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>

<?php the_post_thumbnail(); ?>

<?php the_excerpt();?>
</article>

<?php endwhile; endif; wp_reset_postdata(); ?>

<?php get_sidebar(); ?>

<?php get_footer(); ?>

Nel codice ho ridotto al minimo il codice html in modo che ognuno possa adattarlo facilmente alla suo tema.
Salviamo il file come portfolio.php e lo inseriamo nella cartella del nostro tema.

Sucessivamente creiamo una pagina Works e impostiamo il tema appena creato.

Schermata 2015-08-25 alle 12.44.46

Fatto questo visualizzaimo la pagina e dovremmo vedere il nostro lavoro di prova in una pagina senza stile.

Schermata 2015-08-25 alle 12.45.53

Cosi facendo abbiamo i nostri lavori gestiti dal plugin Portfolio esterno al tema impostato.

Se in futuro si cambierà tema basterà aggiornare il codice del Custom Template e inserirlo nel tema, senza rischiare di perdere tutti i nostri contenuti.

Il link per il download del plugin è disponibile qui di seguito. Nel prossimo articolo vedremo come suddivdere i nostri Lavori in categorie con le tassonomie di wordpress.

SECONDO ARTICOLO –>
http://www.marchettidesign.net/2015/08/creare-un-plugin-wordpress-per-gestire-le-tassonomie/

Stay Tuned!

,

Commenti

  1. Avatar Casper ha detto:

    Bell’articolo, grazie!

    ho provato a replicarlo ma c’è un problema con il loop personalizzato, non viene visualizzato nessun lavoro, forse manca qualcosa?

    grazie!

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Share