Types Plugin Interesantes Para WordPress

Types Plugin Interesantes Para WordPress,Hoy, en nuestra (nueva) sección “Plugins Interesantes Para WordPress”, donde os comentamos los plugins más útiles y curiosos para nuestros blogs WordPress, vamos a hablaros sobre “Types“.

“Types” no es ni más ni menos que un plugin que crea tipos personalizados en WordPress y los integra totalmente con el sistema. Y además, es gratis. Si quieres saber más, ¡Sigue leyendo!

Hablando con propiedad: Tipos personalizados en WordPress

No podemos hablar de algo si no lo conocemos, así que vamos a explicar primero, grosso modo, qué es un tipo personalizado, o “Custom Type” en WordPress.

En la estructura de la base de datos que utiliza WordPress, existe una tabla llamada posts (wp_posts, con el prefijo por defecto de WordPress). Podemos pensar en un primer momento que ahí se guardan las entradas (posts) de nuestros blogs, y, de hecho, acertaríamos. Pero sólo en parte, puesto que en esta tabla también se guardan páginas, la información de los archivos adjuntos que subimos, y los menús que creamos para el front-end. Es la tabla más importante del sistema. En ella se guarda información del tipo: título del post, contenido, fecha de modificación, fecha de creación, estado (publicado o borrador)… y tipo. El resto de información necesaria pero secundaria se guarda en la tabla postmeta.

En el campo tipo (post_type) de la tabla wp_posts se establece el tipo de registro que estamos insertando: entrada, página, multimedia, menú… ¿Por qué no usar entonces este campo para crear tipos a nuestro antojo?

Eso es exactamente un tipo personalizado. WordPress lo trata como un tipo más, como si de otra página u otra entrada se tratase.

Crearlo mediante código nos implica llamar a la funcion register_post_type con dos parámetros, el “post_type” (que viene a ser el slug) y un array de argumentos que parece no tener fin: etiquetas, nombres, nombre en plural, nombre en singular, descripcion, público, si sale en las búsquedas, si sale en los menús, etc, etc… Si estáis muy interesados, podéis consultar la API, pero yo os recomiendo que sigáis leyendo sobre Types, que os facilita mucho todo esto.

La función de Types

Types nos facilita la vida a la hora de crear y gestionar tipos personalizados. No solo nos crea el tipo con una gran variedad de opciones y ajustes posibles, si no que además nos permite establecer los campos que va a tener este tipo (lineas de texto simple, selectores, checkbox, WYSIWYG, imagenes…). También nos permite crear taxonomías personalizadas, para poder categorizar nuestros tipos.

La tarea de crear un nuevo tipo personalizado se reduce a dos pasos:

  1. Crear un nuevo tipo, estableciendo su nombre, etiquetas, taxonomías (categorías), las secciones del formulario de inserción que van a aparecer (las mismas que vemos al agregar una nueva entrada, podemos activarlas o desactivarlas), la lógica de los permalinks, si la página es jerárquica… Todas las opciones que había que establecer a mano con la función ‘register_post_type‘, pero mediante un formulario, y sin tener que recordar o buscar los nombres de la multitud de opciones disponibles.
  2. Crear un grupo de campos y asociarlos al tipo anteriormente creado. La ventaja de hacer este paso por separado es que podemos tener varios tipos cuyos campos sean una imagen y un texto. Asociando los tipos al mismo grupo, no hay que crear cada campo para cada tipo.

Ejemplo funcional de Types

Está bien, de acuerdo, estoy hablando demasiado. Pongámoslo en práctica.

Vamos a suponer que en nuestro blog queremos crear dos tipos personalizados: Coches y Motos. De ambos, me interesa tener un registro de Modelo, Color, Matrícula, Potencia y una Foto. No crearemos de momento Taxonomías.

Creamos el tipo personalizado, desde “Types” > “Taxonomías y tipos personalizados“, y luego “Agregar nuevo tipo de entrada personalizado“. Hagamos primero el tipo “Coches”, y veréis como el tipo “Motos” no os supone ninguna complicación.

tipo de entrada personalizado

Aquí encontraremos varias secciones importantes, y otras, no tanto:

  • Nombre y descripción: Debemos establecer el nombre del tipo personalizado tanto en plural como en singular, así como su slug (nombre único de tipo, en minúsculas y sin espacios ni caractéres especiales). En nuestro caso, “Coches”, “Coche” y “coches” para el tipo de Coches.
  • Visibilidad: Aquí permitimos (o no) a nuestros usuarios editar elementos de este tipo, posicionar el submenú que aparecerá en el menú de administración, y establecer un icono para dicho submenú (por defecto sale un engranaje).
  • Seleccione taxonomías: No es especialmente importante, si no queremos establecer categorías ni taxonomías en nuestra entrada, como es nuestro caso. De lo contrario, podemos seleccionar todas las taxonomías que necesitemos. Lo dejamos como está.
  • Etiquetas: Aquí podemos traducir los textos que aparecerán en los botones de “Añadir nuevo” y “Editar”. Donde veáis un %s no la eliminéis, por ejemplo “Añadir nuevo %s” será “Añadir nuevo coche”. Esto nos da la opción de traducir según el género: “Añadir nuevo %s” para coches, “Añadir nueva %s” para motos.
  • Muestre secciones: Es bastante autoexplicativa esta sección, pero aun asi la detallaremos un poco. Podemos seleccionar las secciones que estarán y las que no estarán en nuestro formulario de inserción y edición de tipos. Esto es independiente de los campos que añadamos más tarde, es decir, si aquí dejamos marcado Título y Editor, luego además aparecerán los campos personalizados del grupo al que asociemos el tipo. Si no quieres que aparezca nada porque vas a personalizarlo todo, mi consejo es que, al menos, dejes el Título.
  • Avanzada: Podemos dejar las opciones que vemos por defecto. Si queremos que nuestras entradas se puedan organizar jerárquicamente, debemos seleccionar “jerárquico”, que por defecto no está marcado.
  • Relación entre entradas: No lo vamos a usar, pero lo explicaré porque es interesante. Aquí podemos establecer tipos y subtipos. Es decir. Si establecemos que nuestro tipo “Coches” es un subtipo de un supuesto tipo “Vehículos” (Parent), entonces todos los campos que tenga “Vehículos” aparecerán en el formulario de “Coches”. Y lo mismo si establecemos que “Coches” tiene un subtipo “Deportivos” (Children). No lo vamos a usar en este ejemplo, se queda en “Ninguno”.

Guardemos el ejemplo. Ahora las motos se añaden igual. Os dejo que lo hagáis vosotros, yo os espero aquí para continuar con el tutorial.

Si nos fijamos bien… Debajo de Entradas, Multimedia, Enlaces, Páginas… ¡Han aparecido Coches y Motos! Y los dos enlaces que nos encontramos son “Coches” (listado) y “Añadir nuevo” (formulario de inserción). Pero aun no hemos acabado. Vamos a “Types” > “Campos Personalizados“. Pulsamos en “Agregar un grupo de campos personalizados“. Pasos fundamentales:

campos01

 

  • Añadir el título del grupo.
  • En el cuadro justo inferior, hay cuatro botones “Editar”. Pulsamos el correspondiente a “Tipos de entradas” y seleccionamos “Coches” y “Motos“.
  • Y ahora sí, añadimos los campos que queramos. Habíamos dicho Matrícula, Modelo, Color, Potencia y una Foto. Pues bien, para todas la mecánica es la misma: pulsamos en el botón del tipo de campo que queramos agregar. Le ponemos un título al campo, un slug, y establecemos si es obligatorio o no. Si es un selector, un checkbox, o un radial, establecemos los valores de las posibles selecciones. Entonces añadimos una linea simple para el Modelo (Título: Modelo, slug: modelo), otra para el Color (Color, color), otra para la Potencia (Potencia, potencia) y un campo Imagen para la Foto (Foto, foto). ¿Y la matrícula? Pensemos un segundo, la matrícula es algo con lo que podemos diferenciar los coches. Pues la matrícula la vamos a dejar para el título de cada registro de Coches.

campos02

Ahora es el momento de comprobar nuestros logros. Vamos al menú, “Coches” > “Añadir nuevo” (o “Add new“, si no lo has traducido, o lo que hayas escrito a la hora de añadir el tipo en las traducciones). Como ves, el formulario con los tipos que acabamos de crear está ahí. Podemos añadir un nuevo Coche desde aquí, y WordPress generará su permalink y demás. Eso sí, lo que no hará será mostrarnos en el front-end la información que estamos escribiendo, ya que, aunque el tipo se guarda en wp_posts, los datos se guardan en wp_postmeta por separado y con el nombre del slug que le hayamos puesto. WordPress es un sistema inteligente, pero no tanto.

nuevoCoche

Plantillas de contenido

Pero no os preocupéis que no hay drama alguno, esto es simple. Tenemos dos opciones, una de pago y otra gratis. O compramos el complemento ideal para Types, que es el plugin Views, de los mismos desarrolladores de Types, y que cuesta 49$ (con soporte y actualizaciones durante un año, a partir de ahi, si queremos más, 25$ anuales), o creamos una plantilla en PHP. Otro día hablaremos de Views, hoy nos toca desarrollar las plantillas (¡Que todavía no hemos tocado código!)

La API de WordPress nos dice que a los tipos personalizados hay que generarles las plantillas. Principalmente son dos: single y archive. En nuestro caso, single-coches.php es la página en la que se muestran los datos de un coche, y archive-coches.php será la plantilla donde se muestre la lista de coches que tengamos. Asi que, en el tema que estemos usando (en nuestro caso TwentyEleven, el predeterminado de WordPress actualmente) creamos el archivo single-coches.php.

Podemos copiar el contenido de single.php y adaptarlo a nuestras necesidades (que es exactamente lo que voy a hacer yo). Si no usásemos types, nos complicaríamos bastante la vida para representar nuestra información. Pero eso no ocurre con Types, cuya API ya nos provee de un sistema para recuperar nuestros datos. La función que necesitamos es types_render_field, pasando como argumento el slug del campo, y si fuese necesario, un array con opciones.

Vamos con el código. Hemos hecho un par de cambios importantes. En el single.php predeterminado hay un:

<?php
/**
* Plantilla que muestra los coches.
*
* @package WordPress
* @subpackage Twenty_Eleven
* @since Twenty Eleven 1.0
*/
get_header();

<div id="primary">
    <div id="content" role="main">

    <?php if ( have_posts() ) : ?> <strong><?="".types_render_field("modelo")." ".types_render_field("color")." ".get_the_title()?></strong> <?=types_render_field("foto",Array("width"=>"400","height"=>"300"));?>
        <table>
            <tbody>
                <tr>
                    <td><strong>Matrícula</strong></td>
                    <td><?=get_the_title();?></td>
                </tr>
                <tr>
                    <td><strong>Modelo</strong></td>
                    <td><?=types_render_field("modelo");?></td>
                </tr>
                <tr>
                    <td><strong>Color</strong></td>
                    <td><?=types_render_field("color");?></td>
                </tr>
                <tr>
                    <td><strong>Potencia</strong></td>
                    <td><?=types_render_field("potencia");?></td>
                </tr>
            </tbody>
        </table>

    <nav id="nav-single">
        <h3><?php _e( 'Post navigation', 'twentyeleven' ); ?></h3>
        <span><?php previous_post_link( '%link', __( '<span>←</span> Previous', 'twentyeleven' ) ); // Enlace al anterior, si hubiera ?> <span><?php next_post_link( '%link', __( 'Next <span>→</span>', 'twentyeleven' ) ); // Enlace al siguiente, si hubiera ?> </span></span>

    </nav><!-- #nav-single --> <?php comments_template( '', true ); // ¿Has desactivado los comentarios? Esto no te servirá. ?> <?php endif; // end of the loop. ?>

    </div>
    <!-- #content -->

</div>
<!-- #primary -->

 

Este es el resultado:

resultado

Evidentemente no tiene CSS y sale “feo”. Eso os lo dejo a vosotros, que seguro que lo bordáis. Ahora tocaría también crear single-motos.php, archive-coches.php y archive-motos.php.

Si os fijáis, al llamar a la imagen hemos pasado parámetros en un Array. Concretamente ancho y alto. Las opciones de cada uno de los tipos las podéis ver en la documentación del plugin (pulsando aquí).

¿Truco o trato?: Si os fijáis, la imagen sale directamente, pero un truco interesante es pasarle como opción “URL”=>”true”. Esto hará que, en lugar de la imagen en sí, llamar a types_render_view nos devuelva un string con la URL de la imagen. ¡No dejéis de mirar la documentación de Types!

Conclusión

Como vemos, usar Types nos ahorra mucho trabajo, mucho código, y por lo tanto, mucho tiempo, y el tiempo es oro. Y nos ahorraríamos aun más en caso de contar con Views.

Podemos crear nuestros tipos personalizados a golpe de click, con una interfaz gráfica, en lugar de tener que hacerlo a mano. Podemos establecer muchas opciones, y muchos campos personalizados según nuestras necesidades. Y representarlos en PHP no es una tarea muy compleja gracias a types_render_field.

Y además de todo esto, Types es gratis. Realmente, si eres desarrollador y necesitas crear tipos personalizados, no hay ningún motivo para que no uses Types.

“La función de un buen software es hacer que lo complejo aparente ser simple”
— Grady Booch

¿Te ha gustado el artículo?
Sé el primero en calificar esta publicación.
1 estrella2 estrellas3 estrellas4 estrellas5 estrellas
Loading...
Artículo escrito por

¡Exprésate! Dejanos tu comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

1 Comentarios

Loeli

Hola. Gracias por está información, actualmente estoy utilizando este plugin, pero me gustaría saber si es posible colocar un contador de caracteres a ciertos campos que fueron creados por el plugin Types?. La verdad lo he intentado pero soy muy nueva en esto. Saludos