Ulzurrun de Asanza i Sàez

Integrando WP Carousel en cualquier theme

Theme por defecto de WP Carousel 0.4
Theme por defecto de WP Carousel 0.4

Nota: Este tutorial está destinado a los diseñadores de themes de WordPress y para poder entenderlo del todo son necesarios conocimientos básicos de PHP.

Desde la versión 0.4 de WP Carousel, los carruseles admiten themes, y claro, esto da mucho juego a los diseñadores, que con un poco de ingenio y creatividad, pueden hacer maravillas. También permite darle al carrusel un toque más acorde con el diseño de nuestros blogs, aunque claro, es posible que al distribuir nuestro theme con soporte de WP Carousel muchos usuarios se pierdan a la hora de instalar un segundo theme para WP Carousel.

Sin embargo, en la versión 0.4.0.1 añadí un parámetro muy útil a la función wp_carousel() (encargada de mostrar el carrusel): el parámetro $mode. Este parámetro acepta tres valores: show, get y array. El primero es que se toma por defecto y muestra el carrusel. El segundo devuelve el código HTML generado por el theme, mientras que el tercero devuelve una matriz con el contenido y la configuración del carrusel. Entonces disponemos de dos métodos diferentes para integrar WP Carousel en nuestro theme: llamándolo estableciendo el parámetro $mode en get (y reemplazando código) o llamándolo estableciendo el parámetro $mode en array, para más adelante crear un theme muy similar a los normales de WP Carousel, sólo que almacenado en la carpeta de nuestro theme e inseleccionable desde la página de opciones de WP Carousel.

Veamos cómo hacerlo.

Lo primero que haremos será crear una variable que almacene la matriz que devuelve wp_carousel() con el parámetro $mode establecido en array. Podemos crearla dentro de una función, en el archivo functions.php o directamente en el archivo correspondiente de nuestro theme (header.php, index.php, etc).

A continuación cargamos en nuevas variables la configuración del carrusel y sus elementos. La matriz que hemos obtenido antes tiene 3 índices: CONFIG, que almacena la configuración, ITEMS, que almacena los elementos e ID, que almacena la ID del carrusel (aunque ésta debemos definirla nosotros, así que no es de mucha utilidad).

He creado la variable $c_id para que el mismo código de un theme normal de WP Carousel sirva en nuestro theme especial y he tomado el valor del índice ID de la matriz del primer paso para hacer uso de éste, aunque podríamos haberlo tomado del valor que usamos como primer parámetro de la función wp_carousel().

A continuación utilizo la función eval() para crear la función encargada de cargar el código Javascript necesario para iniciar el carrusel. La siguiente línea tan sólo carga la función en el pie de página del theme.

Por último, cargamos el archivo wp-carousel-theme.php, que es el que contiene el theme en mi ejemplo. El código que podéis ver a continuación es el que utilizo para integrar WP Carousel en Portal Colorido 2.0.

[php]
$carousel_array = wp_carousel(ID_DEL_CARRUSEL, ‘array’);
$carousel_config = $carousel_array[‘CONFIG’];
$carousel_items = $carousel_array[‘ITEMS’];
$c_id = $carousel_array[‘ID’];
eval(‘if (!function_exists("wp_carousel_load_carousel_’.$c_id.’_js_code")) { function wp_carousel_load_carousel_’.$c_id.’_js_code() { wp_carousel_load_carousel_js(‘.$c_id.’); } }’);
add_action(‘wp_footer’, ‘wp_carousel_load_carousel_’.$c_id.’_js_code’);
require_once(‘wp-carousel-theme.php’);
[/php]

El archivo wp-carousel-theme.php contiene un theme normal de WP Carousel, la única diferencia es que la matriz $config en este caso es $carousel_config, al igual que la matriz $items es $carousel_items. Podéis seguir este tutorial para crear el theme de WP Carousel.

Como veis, no tiene demasiada complicación y no difiere demasiado del sistema general de creación de themes de WP Carousel.


One reply on “Integrando WP Carousel en cualquier theme

Leave a Reply

Your email address will not be published.

Required fields are marked *

Your avatar