Tutorial de metadatos con MetaBox

WordPress incorpora desde hace mucho tiempo una característica muy poderosa llamada campos personalizados (Custom Fields). Gracias a ella podemos asociar información adicional a cualquier entrada, página o tipo de contenido personalizado.

A esa información adicional se le conoce como metadatos, es decir, datos que describen a otros datos.

Los ejemplos son prácticamente infinitos. Si escribes una reseña de un libro podrías almacenar el autor, la editorial, el ISBN o el año de publicación. En una película podrían ser el director, los actores principales o la duración. Incluso puedes guardar información completamente distinta, como el estado de ánimo del autor, la versión del software que estás revisando o la canción que escuchabas mientras escribías el artículo.

Todos estos datos se almacenan como pares clave/valor, una estructura extremadamente flexible que WordPress utiliza internamente en muchos lugares.

Los metadatos también sirven como base para otras tecnologías, como los Rich Snippets de Google, Open Graph o cualquier otro esquema que necesite describir de manera estructurada el contenido de una página.

El problema de los campos personalizados

Los campos personalizados tradicionales funcionan muy bien cuando se utilizan de manera ocasional.

Sin embargo, cuando todos los artículos de una determinada categoría necesitan exactamente los mismos metadatos, la captura comienza a hacerse repetitiva.

Cada vez que publicamos una entrada debemos crear nuevamente las claves, escribir sus nombres correctamente y asignarles un valor. Además de ser un proceso lento, aumenta la posibilidad de cometer errores o simplemente olvidar alguno de los campos.

La solución consiste en agrupar todos esos campos dentro de una MetaBox.

Una MetaBox no es otra cosa que un formulario que aparece integrado en la pantalla de edición de WordPress y que agrupa los metadatos relacionados con una determinada tarea.

Una vez creada, cada nuevo artículo presenta automáticamente los campos necesarios para capturar la información.

El caso de Cyberia.MX

En Cyberia.MX^[1] cada artículo mostraba en la parte superior una pequeña leyenda que internamente llamábamos SEOTexto.

Este bloque estaba formado por dos elementos:

• un título corto;
• una línea descriptiva con información adicional.

Aunque ambos valores se almacenaban como metadatos, siempre aparecían juntos.

Capturarlos mediante los campos personalizados tradicionales resultaba poco práctico, así que decidí crear una MetaBox específica para ellos.

De esa forma, cada vez que escribía un nuevo artículo los dos campos aparecían automáticamente en la pantalla de edición.

Utilizando WPAlchemy

En aquella época la biblioteca más completa para crear MetaBoxes era WPAlchemy, desarrollada por Dimas Begunoff.

Después de descargarla basta con copiarla dentro del child theme.

Recuerda que, cuando trabajas con Genesis Framework, todas las modificaciones deben realizarse sobre el child theme y nunca directamente sobre el framework.

El siguiente paso consiste en cargar la biblioteca desde functions.php.

include_once CHILD_DIR . '/lib/wpalchemy/MetaBox.php';

La biblioteca incluye otros archivos auxiliares, como MediaAccess.php, utilizados para controles más avanzados relacionados con archivos multimedia. En este ejemplo únicamente necesitaremos la clase principal.

Creando la MetaBox

Una vez cargada la biblioteca podemos registrar nuestra MetaBox.

$ficha = new WPAlchemy_MetaBox(array(
    'id'       => '_ficha',
    'title'    => 'Texto Seo',
    'template' => CHILD_DIR . '/lib/textoseo/ficha.php',
    'types'    => array('post'),
    'context'  => 'normal',
    'prefix'   => 'seo_',
    'mode'     => WPALCHEMY_MODE_EXTRACT
));

Este bloque registra una nueva MetaBox dentro del administrador de WordPress.

Los parámetros más importantes son:

• id identifica de forma única la MetaBox.
• title es el título que aparecerá en la pantalla de edición.
• template indica el archivo que contiene el formulario.
• types especifica sobre qué tipos de contenido estará disponible.
• prefix añade un prefijo a todas las claves generadas para evitar conflictos con otros metadatos.

El parámetro template merece una explicación especial.

La MetaBox únicamente registra el nuevo bloque dentro del administrador. El contenido visual se encuentra en un archivo independiente, lo que permite mantener separada la lógica de la presentación.

La plantilla de la MetaBox

En este ejemplo el formulario es muy sencillo porque únicamente necesitamos dos campos.

<div class="ficha_tecnica">

    <p>
        El texto que aparece en la parte superior de la página mejora la forma
        en la que Google indexa el contenido, por lo que conviene escribir un
        texto rico en palabras clave.
    </p>

    <?php /** Título SEO */ ?>
    <label>
        Título SEO
        <span>(<em>incluir la palabra clave principal</em>)</span>
    </label>

    <p>
        <input type="text"
               name="<?php $metabox->the_name('seo_title'); ?>"
               value="<?php $metabox->the_value('seo_title'); ?>" />

        <span>
            Escribe el título SEO con la palabra clave principal.
            Ejemplo: <strong>Angry Birds para iPod</strong>
        </span>
    </p>

    <?php /** Texto SEO */ ?>
    <label>
        Texto SEO
        <span>(<em>palabras clave secundarias</em>)</span>
    </label>

    <p>
        <input type="text"
               name="<?php $metabox->the_name('seo_text'); ?>"
               value="<?php $metabox->the_value('seo_text'); ?>" />

        <span>
            Escribe una breve descripción utilizando palabras clave
            secundarias. Ejemplo:
            <strong>Un divertido juego de estrategia para dispositivos iPod.</strong>
        </span>
    </p>

    <div style="clear: both;"></div>

</div>

Visualmente no deja de ser un formulario HTML.

Lo realmente interesante es que los atributos name y value no están escritos manualmente.

En su lugar dejamos que WPAlchemy los genere mediante dos métodos.

$metabox->the_name(...)
$metabox->the_value(...)

¿Qué hacen the_name() y the_value()?

the_name() genera automáticamente el nombre interno del metadato utilizando el prefijo definido en la MetaBox.

Por su parte, the_value() recupera el valor almacenado previamente y lo coloca dentro del control correspondiente cuando editamos una entrada existente.

Gracias a estas dos funciones no necesitamos preocuparnos por leer o escribir los metadatos manualmente. La biblioteca se encarga de todo el proceso de almacenamiento y recuperación.

El resultado

Una vez registrada la MetaBox y creada su plantilla, WordPress incorpora automáticamente este nuevo bloque en la pantalla de edición de los artículos.

A partir de ese momento el autor únicamente tiene que capturar los valores del formulario. Los metadatos quedan almacenados junto con la entrada y pueden recuperarse posteriormente desde cualquier parte del tema o de un plugin.

Ésta es precisamente la mayor ventaja de utilizar MetaBoxes.

No cambian la forma en la que WordPress almacena la información; simplemente hacen que la captura sea mucho más cómoda, consistente y menos propensa a errores. Conforme un sitio comienza a manejar decenas de metadatos distintos, esta diferencia termina siendo enorme.

Usa Genesis Framework

Genesis proporciona una base sólida para desarrollar temas sobre WordPress. Gracias a su arquitectura basada en hooks y filtros resulta muy sencillo integrar bibliotecas como WPAlchemy sin modificar el núcleo del framework.