Cómo crear Custom Post Types en WordPress

¿Quieres crear un Custom Post Type en WordPress? Es una forma excelente y útil de organizar tu sitio web si estás manejando varios tipos de contenido a la vez.

En este tutorial, aprenderás cómo hacer un custom post type de WordPress construyendo un plugin específico para el sitio.

Descarga la hoja de trucos de WordPress definitiva

¿Qué son los Custom Post Types de WordPress?

WordPress proporciona unos cuantos tipos de entradas por defecto, como Entrada, Página, Revisión y Adjuntos. A pequeña escala, estos servirán perfectamente para tu blog. Sin embargo, podrían no ser suficientes cuando tu contenido se vuelva más diverso.

Ahí es donde entra en juego el tipo de post personalizado de WordPress. En pocas palabras, es un tipo de post adicional que creas en base a tus necesidades. Con él, podrás agrupar tus posts de forma más específica.

Crear un custom post type en WordPress es más eficiente que asignar categorías a tus artículos. Eso es porque, al categorizar los artículos, éstos se ubican en la misma lista, comúnmente en la sección de Entradas. El problema es que, si tienes varios temas amplios, te resultará difícil hacer un seguimiento de ellos.

Por otro lado, te permite elegir una sección más adecuada para tus artículos desde el principio. Esto debería ayudarte a clasificar mejor y más fácilmente tu contenido.

El tipo de post personalizado de WordPress tiene su propio menú en el panel de administración de WordPress, que dirige a una lista de entradas de ese tipo en particular.

Por ejemplo, si creas una sección de Artículos Personalizados para tu sitio, las publicaciones de Entrada o Páginas no estarán incluidas. Eso es porque pertenecen a sus propios tipos.

No sólo eso, también puedes ayudar a los lectores a acotar más sus búsquedas agrupando las entradas de tus Artículos Personalizados en diferentes categorías, como Reseña, Tutorial, etc. Muy conveniente para tus visitantes, ¿verdad?

¿Qué puedes cambiar en un Custom Post Type de WordPress?

Al crear un nuevo tipo de post, tienes varias opciones de personalización. Puedes elegir dónde aparece el menú en el área de administración, si ese tipo de post se incluye en los resultados de búsqueda, si admite fragmentos, si se permiten los comentarios, etc.

También puedes cambiar varios elementos de texto, como Añadir nueva entrada por Añadir nuevo artículo o la Imagen destacada por Añadir póster.

Además, los tipos de post personalizados te permiten habilitar la función de campos personalizados en el editor de entradas. Gracias a esto, es posible dar más detalles sobre tu contenido.

Siguiendo el ejemplo de tipo de post Artículos personalizados, además de tener el artículo como contenido principal, tienes la opción de añadir campos personalizados para información como Autor, Tiempo de lectura, etc.

Sin embargo, cualquier campo personalizado que crees se podrá seleccionar en todos los tipos de publicaciones. Por eso, se necesita un plugin para que cada campo aparezca sólo para un tipo de post específico. Explicaremos cómo hacer esto más adelante, así que sigue leyendo.

Elementos de un Custom Post Type de WordPress

Para empezar, veamos cómo escribir una nueva función que llame a la función register_post_type(). Debe tener dos parámetros:

• El nombre del tipo de post que no debe tener más de 20 caracteres y no debe contener espacios ni mayúsculas. Nuestro nombre de tipo de post personalizado es artículo.
• Un array asociativo llamado $args que contiene información sobre el tipo de post en pares ‘key’ => ‘value’.

¡Importante! Tu función debe estar enganchada al hook de acción init. De lo contrario, tu tipo de post personalizado no se registrará correctamente.

Por último, todas las funciones personalizadas deben tener un prefijo para evitar conflictos con otras funciones de plugins o temas. Para distinguirlos, utilizaremos las iniciales de Hostinger Tutoriales para este ejemplo: ht.

El código inicial para añadir un nuevo tipo de post personalizado debería verse así:

// La función personalizada DEBE estar enganchada al hook de acción init
add_action( 'init', 'ht_register_movie_post_type' );

// Una función personalizada que llama a register_post_type
function ht_register_movie_post_type() {

  // Establece varias piezas de texto, $labels se utiliza dentro del array $args
  $labels = array(
     'name' => _x( 'Artículos personalizados', 'post type general name' ),
     'singular_name' => _x( 'Artículo personalizado', 'post type singular name' ),
     ...
  );

  // Establece varios datos sobre el tipo de post
  $args = array(
    'labels' => $labels,
    'description' => 'Mi tipo de post personalizado',
    'public' => true,
    ...
  );

  // Registra el tipo de post con toda la información contenida en el array $arguments
  register_post_type( 'articulo', $args );
}

Dado que tanto $args como $labels son arrays, es mejor escribir primero la variable $labels y luego la variable $args. Una vez hecho esto, puedes registrar el código.

Ahora, vamos a discutir los arrays $args y $labels que usaremos para personalizar el custom post type de WordPress.

¿Qué es el array $args?

$args es la abreviatura de arguments y esta variable se utiliza para contener arrays. Array, por otro lado, es una estructura de datos que almacena elementos (pares de clave y valor) de un objeto (tipo de post personalizado de WordPress).

Hay muchos arrays en $args, pero vamos a enumerar sólo los más utilizados. Sin embargo, ten en cuenta que todos son opcionales.

• labels: un array que define varios fragmentos de texto, como el nombre del menu y el nombre del tipo de post personalizado. Hablaremos más sobre este array más adelante en la sección del array $label.
• description: un resumen breve y descriptivo del tipo de post. Este puede mostrarse en la plantilla del tipo de post, pero no se usa en ningún otro lado.
• public: para cambiar la visibilidad del tipo de post personalizado de WordPress para autores y visitantes. Vamos a establecer el valor a TRUE para que aparezca en el panel de control de WordPress.
• menu_position: la posición del nuevo enlace en el menú de navegación del Panel de control. El valor 5 lo coloca debajo de Entradas y 100 lo coloca debajo de Ajustes. Puedes ver la lista completa de las posiciones en la página de Código de WordPress.
• supports: habilita de forma selectiva varias funciones de post, como imágenes destacadas, extractos, campos personalizados, etc. Si se establece en FALSO en lugar de contener un array, deshabilita el editor para este tipo de post. Esto es útil si quieres bloquear todas las publicaciones de este tipo mientras las mantienes visibles.
• has_archive: si se establece como TRUE, define si el tipo de post tiene una página de archivo, si la url sigue tu estructura de permalinks y si el slug es el nombre que ingresaste en el parámetro 1 de register_post_types(). Por ejemplo, http://www.misitioweb.com/articulo/ muestra todas las publicaciones de Artículos Personalizados.
• show_in_admin_bar: usar el valor TRUE hará que este tipo de post aparezca en la barra de administración superior, en el menú +Añadir.
• show_in_nav_menus: define si las publicaciones de este tipo se pueden agregar a los menús de navegación creados a través de Apariencia -> Menús. Aquí, debemos ingresar el valor TRUE.
• query_var: TRUE o FALSE establece si una publicación se puede ver escribiendo el tipo de publicación y el nombre de la publicación como una consulta en la URL, es decir, ‘http://www.misitioweb.com/?articulo=ejemplo-articulo’.

¿Qué es el array $labels?

El primer array de la variable $args es $labels. La particularidad es que está hecho para contener otros arrays. Por lo tanto, es crucial crear una variable llamada $labels para mantener todos los pares de claves y valores en una sección separada. Esto reduce el riesgo de escribir código incorrecto y hace que la función esté mas limpia.

Aquí hay algunas de las claves más importantes para el array $labels:

• name: el nombre plural general para el tipo de post.
• singular_name: el nombre para una sola publicación de este tipo.
• add_new: reemplaza el texto ‘Añadir nueva’.
• add_new_item: reemplaza ‘Añadir nueva entrada’.
• edit_item: reemplaza ‘Editar entrada’.
• featured_image: reemplaza ‘Imagen destacada’ en el editor del post.
• set_featured_image: reemplaza ‘Establecer imagen destacada’.
• menu_name: cambia el texto del enlace de nivel superior (el texto predeterminado para el enlace es la clave del nombre).

¿Qué es el array ‘supports’?

Una de las claves del array $args es supports. Esta es un array simple en el que escribes la lista de funciones del editor que quieres habilitar para tu tipo de post personalizado. Por defecto, solo el título y el editor están habilitados.

También puedes escribir FALSE en lugar de un array. Al hacer esto, desactivarás todas las funciones de edición de publicaciones, incluido el título y el área de contenido. De esta manera, las publicaciones no se pueden editar, pero siguen siendo visibles.

Aquí está la lista de características del editor que puedes habilitar en el array supports:

• title
• editor
• author
• thumbnail
• excerpt
• trackbacks
• custom-fields
• comments
• revisions
• page-attributes
• post-formats

Crear los nuevos custom post types a través de un plugin

Para crear un custom post type de WordPress, puedes crear un plugin específico de tu sitio, descargar un plugin normal o editar tu archivo functions.php.

El tercer método no es recomendable porque los datos de tu tipo de post personalizado podrían sobrescribirse tras la actualización del tema. El segundo método tampoco es fiable ya que tus datos desaparecerán una vez que desactives la herramienta.

Por lo tanto, vamos a realizar la primera opción: construir un plugin específico para el sitio. Básicamente, es una herramienta personalizada que puedes construir por ti mismo para tareas específicas.

Lo bueno de esto es que se conservan los datos incluso si decides actualizar tu tema o desactivar el plugin. También es altamente personalizable.

Sin embargo, este método puede ser un poco técnico. Por eso, para ayudarte a empezar, te invitamos a leer también nuestro tutorial sobre cómo crear un plugin para WordPress.

Ahora que sabemos qué elementos son necesarios para la función, podemos construir nuestro plugin, escribir las funciones personalizadas y engancharlas al hook de acción init.

Así es como debería verse un custom post type de WordPress terminado:

<?php
/*
Nombre del plugin: Mis Custom Post Types
Descripción: Añadir tipos de post para artículos personalizados
Autor: Hostinger Dev
*/
 
// Enganchar <strong>ht_custom_post_article()</strong> al hook de acción init
add_action( 'init', 'ht_custom_post_article' );
 
// La función personalizada para registrar un tipo de artículo personalizado
function ht_custom_post_movie() {
 
  // Establece las etiquetas, esta variable se utiliza en el array $args
  $labels = array(
    'name'               => __( 'Articulos' ),
    'singular_name'      => __( 'Articulo' ),
    'add_new'            => __( 'Agregar Nuevo Articulo' ),
    'add_new_item'       => __( 'Agregar Nuevo Articulo' ),
    'edit_item'          => __( 'Editar Articulo' ),
    'new_item'           => __( 'Nuevo Articulo' ),
    'all_items'          => __( 'Todos los articulos' ),
    'view_item'          => __( 'Ver Articulo' ),
    'search_items'       => __( 'Buscar articulos' ),
    'featured_image'     => 'Poster',
    'set_featured_image' => 'Agregar Poster'
  );
 
  // Los argumentos para nuestro tipo de post, que se introducirán como parámetro 2 de register_post_type()
  $args = array(
    'labels'            => $labels,
    'description'       => 'Contiene información específica de los artículos personalizados',
    'public'            => true,
    'menu_position'     => 5,
    'supports'          => array( 'title', 'editor', 'thumbnail', 'excerpt', 'comments', 'custom-fields' ),
    'has_archive'       => true,
    'show_in_admin_bar' => true,
    'show_in_nav_menus' => true,
    'has_archive'       => true,
    'query_var'         => true,
  );
 
  // Llamar a la función de WordPress
  // Parámetro 1 es un nombre para el tipo de post
  // Parámetro 2 es el array $args
  register_post_type( 'articulo', $args);
}

Ahora, para convertir este código en un plugin, sigue los siguientes pasos:

1. Primero, abre un editor de texto en tu ordenador. Copia y pega el código.
2. Guárdalo como un archivo PHP. Para este ejemplo, lo llamaremos my-custom-post-type.php.
3. Ve a public_html -> wp-content -> plugins. Allí, crea una nueva carpeta con el mismo nombre que tu plugin y sube tu archivo PHP dentro. Utiliza el administrador de archivos de tu proveedor de hosting o un cliente FTP como FileZilla para subir el archivo.
   
4. Luego, ingresa a tu panel de WordPress y ve al menú de Plugins. Verás tu plugin recién instalado. Por último, actívalo. Verás un nuevo tipo de post, llamado Artículos Personalizados.

Felicitaciones, acabas de instalar un plugin específico para crear un tipo de artículo personalizado en WordPress.

Personalizar el nuevo tipo de post

Para personalizar tus nuevos tipos de post, solo tienes que cargar dos archivos de plantillas correspondientes en el directorio principal de tu tema. Los nombres de estos archivos de plantillas deberían verse así:

• Plantilla para un post individual: single-{post-type}.php
• Plantilla para una página de archivo: archive-{post-type}.php.

La parte {post-type} de los nombres de los archivos debe ser el nombre del parámetro 1 de register_post_type(). En este ejemplo, los nombres de los archivos son single-article.php y archive-article.php.

Si no creas plantillas, WordPress usará single.php y archive.php, manteniendo todos tus posts y archivos idénticos.

Dicho esto, la mejor manera de comenzar es duplicando single.php o archive.php y cambiarles el nombre como se muestra arriba. De esta manera, la estructura general es idéntica al resto de tu tema y ​​todas las etiquetas de plantilla requeridas ya están en su lugar. Por lo tanto, te será más fácil estilizar la plantilla más adelante.

Así es como se suben los archivos de la plantilla:

1. Una vez que hayas accedido al almacenamiento de tu sitio web, busca la carpeta de tu tema activo actualmente. En nuestro caso, es el tema Twenty Seventeen. El directorio es /public_html/wp-content/themes/twentyseventeen.
2. Copia los archivos single.php y archive.php y pégalos fuera de esa carpeta.
3. Cámbiales el nombre a single-article.php y archive-article.php. Luego, muévelos de nuevo a la carpeta Twenty Seventeen.
   
4. Repite el segundo y el tercer paso con las demás plantillas de los tipos de post personalizados.

Una vez subidos los archivos de las plantillas, es el momento de mostrar los custom post types de WordPress en la página principal.

Mostrar tipos de post personalizados en la página principal

Los tipos de post personalizados no se muestran en la página principal por defecto. Por eso, debes escribir una nueva función que invoque el método set del objeto WP_Query de WordPress. Veamos primero la estructura del código:

// Enganchar nuestra función personalizada al hook de acción pre_get_posts
add_action( 'pre_get_posts', 'add_reviews_to_frontpage' );
 
// Cambiar la query principal
function add_reviews_to_frontpage( $query ) {
if ( is_home() && $query->is_main_query() ) {

$query->set( 'post_type', array( 'post', 'articulo' ) );

}

return $query;
}

En esta función, $query->set() toma dos parámetros:

El primer parámetro es la propiedad que deseas cambiar. En nuestro caso, queremos cambiar la propiedad post_type.

El segundo parámetro es el array que quieres que sea el valor de la propiedad post_type (post y artículo).

En el código anterior, el array comienza con ‘post‘. Esto se debe a que es el tipo de post por defecto en WordPress y todavía queremos incluirlo en la primera página. Si sólo quieres mostrar posts personalizados en la página principal, puedes eliminarlo.

En este ejemplo, añadiremos ‘articulo‘ al array, lo que significa que la página principal mostrará todos los posts regulares y todos los posts de artículos personalizados.

Ahora, para lograr esto, puedes pegar el código en el archivo functions de tu tema (functions.php) o en el plugin específico que hayas creado. De nuevo, para evitar cualquier pérdida de datos, utilizaremos la segunda opción.

1. Accede de nuevo a los archivos de tu sitio web y ve a la carpeta de tu plugin específico (/public_html/wp-content/plugins/my-custom-post-type).
2. Abre el archivo PHP. Luego, copia el código anterior y pégalo en la parte inferior del archivo.
   
3. Guarda los cambios.

Ahora puedes visitar tu sitio web. Todas las entradas de los tipos de posts por defecto y personalizados deberían estar disponibles en la página principal.

Añadir y mostrar un campo personalizado de WordPress

Una vez que hayas creado un nuevo custom post type de WordPress, es posible que quieras añadir un campo personalizado para dar más detalles sobre tu contenido.

Hay dos maneras de hacer esto: usando el campo personalizado estándar de WordPress o un plugin y cada uno tiene sus propias ventajas y desventajas. Empezaremos con el estándar.

Usar el campo personalizado por defecto de WordPress

WordPress nos proporciona una herramienta incorporada para añadir un campo personalizado. Lo mejor es que es bastante fácil de usar.

1. Los campos personalizados de WordPress están oculto por defecto. Por lo tanto, es necesario activarlo desde la opción en el editor de entradas.
2. Una vez activado, verás una sección de campos personalizados bajo el editor, donde puedes introducir el nombre y su valor. Cuando hayas terminado, haz clic en el botón Añadir un campo personalizado.

Lamentablemente, los campos personalizados no aparecerán por defecto en el front-end de tu página. Para hacerlos visibles, necesitas insertar la función the_meta() o echo get_post_meta() en el archivo del tema que se encarga de mostrar tus posts.

Ahora que tenemos dos tipos de post, podemos editar single.php o single-article.php. Depende de dónde quieras que esté el campo personalizado.

Digamos que queremos añadir un campo personalizado para las entradas de artículos personalizados. Tendremos que introducir el código en single-article.php. Estos son los pasos:

1. Desde tu panel de control de WordPress, dirígete a Apariencia -> Editor de temas -> singe-article.php.
2. Localiza el Loop de WordPress y encuentra esta línea.

   get_template_part( 'template-parts/post/content', get_post_format() );

3. Pega uno de los siguientes fragmentos de código en el archivo bajo esa línea.
   – the_meta(); – usa este código si quieres mostrar todos los campos personalizados disponibles en un post.
   – echo get_post_meta( $post->ID, ‘key’, TRUE ); – usa este código para mostrar un campo personalizado específico. Recuerda sustituir el valor de key por el nombre de tu campo personalizado.
4. Después de eso, haz clic en Actualizar archivo.

Si visitas tu sitio web, verás el campo personalizado debajo del post.

Limitar los campos personalizados a un tipo de post específico con un plugin

Aunque es sencillo de usar, añadir campos personalizados directamente desde WordPress no es necesariamente la mejor opción. Esto se debe a que una vez que añades un campo personalizado, éste estará disponible para todos los tipos de posts. Esto puede hacer que sea difícil encontrar el campo que necesitas para un tipo de post específico.

Por lo tanto, puedes probar el plugin Advanced Custom Fields. Limita ciertos campos personalizados para que sólo sean seleccionables en el tipo de post que elijas. Así es como se utiliza la herramienta:

1. En tu panel de control de WordPress, ve al menú de Plugins y selecciona Añadir nuevo. Escribe Advanced Custom Field en la barra de búsqueda e instala el plugin.
   

¡Importante! Después de activar este plugin, ya no verás el campo personalizado por defecto de WordPress en tu editor de entradas.

Habrá un nuevo menú en tu barra lateral llamado Campos personalizados. Para añadir un campo personalizado, haz clic en el botón Añadir nuevo. Tendrás que introducir varios detalles importantes, como:
– Etiqueta del campo: el nombre de tu campo personalizado que se mostrará en la página de edición.
– Nombre del campo: el ID de tu campo personalizado que se utilizará para mostrar en tu tema.
– Tipo de campo: elige entre texto, checkbox, URL, etc., según tus necesidades.

Cuando hayas terminado, pulsa Cerrar campo. Ahora, para limitar este campo personalizado a un tipo de post específico, ve a la configuración de Ubicación en el plugin Advanced Custom Field.

Digamos que queremos que el nuevo campo personalizado sea seleccionable sólo para nuestro nuevo custom post type. Cada opción en las columnas Mostrar este grupo de campos si debe ser Post type -> es igual a -> Artículo personalizado.

Una vez hecho esto, no olvides hacer clic en Publicar para guardar los cambios.

Como este campo se crea a través de un plugin, debes utilizar las funciones de ese plugin para mostrarlo. Estos pasos para insertar la función son similares a los del campo personalizado por defecto de WordPress. La única diferencia es que tienes que introducir el código the_post( ‘key’ ); en su lugar.

Conclusión

El custom post type de WordPress es la solución perfecta para organizar tu sitio web, especialmente si éste se centra en más de un tema. Podrás dividir tus contenidos en función de la información que incluyan.

Con un poco de conocimientos de WordPress y PHP, puedes seguir fácilmente todos los pasos tú mismo.

¡Buena suerte y asegúrate de dejar un comentario abajo si tienes alguna pregunta!