En este artículo voy a explicar como funcionan los Custom Post Type de WordPress a través de un ejemplo práctico, en este caso el desarrollo de un plugin sencillo para añadir un portfolio a nuestra web. Puedes ver el resultado en vivo en mi propia web, pues he usado este plugin para la sección de trabajos de mi web.
Por si no sabes que es un Custom Post Type, pues básicamente consiste en añadir un nuevo tipo de contenido para nuestra web, además de los básicos de «Entrada» y «Página». Hay muchos plugins que se basan en los CPT para su funcionamiento, los reconocerás porque añaden una nueva entrada al menú lateral con un tipo de contenido nuevo, del tipo «Slider», «Presentación», «Cursos», «Productos», etc.
En este caso, crearemos un CPT llamado «Trabajo» para crear un portfolio en nuestra web.
Es cierto que podría haber usado un plugin más avanzado entre los multiples plugins que existen por ahí para crear portfolios, pero quería escribir este pequeño tutorial sobre Custom Post Type, así que allá vamos.
Lo primero sería crear el esqueleto para nuestro plugin. Esto ya lo expliqué en un un artículo anterior sobre como crear un plugin básico en WordPress, así que a él me remito.
Creando un Custom Post Type
Parar crear nuestro propio tipo de contenido tenemos que usar la función de WordPress register_post_type
Esta función recibe una cadena de texto que será el «slug» de nuestro CPT, así como el identificador del mismo. Habría que intentar evitar usar un identificador que ya exista, o que se puede mezclar con otro plugin. En mi caso, usaré «work-portfolio»
Y después tenemos una serie de parámetros. Hay muchos, puedes consultar la documentación. En mi ejemplo, usaré los siguientes:
- public: Indica si el contenido será visible a usuarios finales, o solo tendremos acceso al mismo desde el administrador. Como estamos haciendo un portfolio para mostrar nuestros trabajos, usaremos el valor true.
- has_archive: Indica si queremos que nuestro CPT tenga una página de archivo, como existe para las entradas. En nuestro caso, tambien lo pondremos a true.
- labels: Los nombres y textos que se usarán para los menús y demás elementos del panel de control (los botones de añadir, buscar, etc). Aquí es recomendable usar siempre la función __() para permitir que estos textos sean traducibles a otros idiomas. Aún aunque inicialmente solo vayamos a usar un único idioma, pero ya dejamos esta opción abierta desde el inicio.
- supports: Aquí indicamos que elementos de contenido tendrá nuestro CPT. Por defecto son solo el título y el contenido. Yo además quiero que nuestros trabajos puedan tener una imagen y un resumen, así que usaré: title, editor, excerpt, thumbnail
- menu_icon: El icono para el menú de administración. Podemos elegirlo en: Dashicons
add_action( 'init', function(){
$labels = array(
'name' => __( 'Trabajos' ),
'singular_name' => __( 'Trabajo' ),
'add_new' => __( 'Nuevo trabajo' ),
'add_new_item' => __( 'Nuevo trabajo' ),
'edit_item' => __( 'Modificar trabajo' ),
'view_item' => __( 'Ver trabajo' ),
'search_items' => __( 'Buscar trabajos' ),
'not_found' => __( 'No se han encontrado resultados' ),
);
register_post_type('work-portfolio', array(
'public' => true,
'has_archive' => true,
'labels' => $labels,
'supports' => array('title', 'editor', 'excerpt', 'thumbnail'),
'menu_icon' => 'dashicons-admin-page',
));
}); Fíjate que todo el código para generar el Custom Post Type está dentro del action init (Más información: Hook init). Con esto nos aseguramos que nuestro código se cargue justo después de cargarse el propio WordPress
Si hemos hecho todo bien, ya deberíamos ver nuestro nuevo tipo de contenido en el menú, y podremos empezar añadir contenidos. Además, como hemos dicho que queremos tener una página de archivo para nuestro CPT, pues podemos acceder al mismo a través de /work-portfolio/ (Recordad que podemos cambiar esta dirección cambiando el primer parámetro de la llamada a la función register_post_type)
Por cierto, es posible que sigáis este ejemplo y no os funcionen los enlaces. Generalmente toca regenerar los enlaces permanentes. Tan simple como irse a «Ajustes => Enlaces Permantes» y, sin cambiar nada, darle al botón de «Guardar Cambios»
Añadiendo Taxonomías
Vale, ya tenemos nuestro contenido creado, ahora queremos añadir una taxonomía para poder categorizar los trabajos que vamos a subir a nuestro portfolio. Para ello usaremos la función register_taxonomy
Esta función tiene dos parámetros obligatorios y una lista de argumentos opcionales. Los parámetros obligatorios son:
- taxonomy: El identificador de la taxonomía. Se usará como slug para los enlaces en caso de que no especifiquemos uno.
- object_type: El tipo de contenido al que asociaremos la taxonomía. En nuestro caso work-portfolio.
Y de los argumentos opcionales, usaremos estos:
- hierarchical: Indica si una taxonomía puede tener una taxonomía padre de la que heredar o no. Como ejemplo, de las taxonomías para entradas que tiene WordPress definidas por defectos tenemos una que está definidad con hierarchical (las categorías) y otra sin hierarchical (las etiquetas)
- show_ui: Indica si queremos que WordPress nos genere todas las páginas para gestionar las taxonomías. Lo normal es que le digamos que si.
- query_var: Lo usaremos si queremos permitir búsquedas
- rewrite: Aquí indicaremos el slug, si queremos usar uno específico.
- labels: Los textos asociados a esta taxonomía. Mismas consideraciones que para register_post_type
Con esto en cuenta, el código nos quedaría así:
add_action( 'init', function(){
$labels = array(
'name' => __( 'Trabajos' ),
'singular_name' => __( 'Trabajo' ),
'add_new' => __( 'Nuevo trabajo' ),
'add_new_item' => __( 'Nuevo trabajo' ),
'edit_item' => __( 'Modificar trabajo' ),
'view_item' => __( 'Ver trabajo' ),
'search_items' => __( 'Buscar trabajos' ),
'not_found' => __( 'No se han encontrado resultados' ),
);
register_post_type('work-portfolio', array(
'public' => true,
'has_archive' => true,
'labels' => $labels,
'supports' => array('title', 'editor', 'excerpt', 'thumbnail'),
'menu_icon' => 'dashicons-admin-page',
));
register_taxonomy( 'categories-work-portfolio', 'work-portfolio', array(
'hierarchical' => false,
'show_ui' => true,
'query_var' => true,
'rewrite' => array( 'slug' => 'categories-work-portfolio' ),
'labels' => array(
'name' => _x( 'Categoría', 'taxonomy general name' ),
'singular_name' => _x( 'Categoría', 'taxonomy singular name' ),
'search_items' => __( 'Buscar por categoría' ),
'all_items' => __( 'Todas las categorías' ),
'parent_item' => null,
'parent_item_colon'=> null,
'edit_item' => __( 'Editar categoría' ),
'update_item' => __( 'Actualizar categoría' ),
'add_new_item' => __( 'Añadir nueva categoría' ),
'new_item_name' => __( 'Nueva categoría' ),
'most_used' => __( 'Más utilizadas'),
)
));
}); Y con todo esto, nuestro Custom Post Type quedaría así:
Con esto ya hemos creado un CPT básico con lo mínimo para funcionar con él. En posteriores artículos veremos como añadir campos adicionales así como gestionar el aspecto del contenido generado.
Puedes ver el código completo en Github
Puedes instalar el plugin desde el repositorio de WordPress