Widgets de WordPress

Este post resume mi lectura acerca de widgets de wordpress de automattic.com creadores de los mismos. Un widget de wordpress es un trozo pluggleable (que se puede conectar) para un sidebar. A partir de la versión 2.2, el plugin de widget forma parte del core de wordpress.

Tener habilitado wordpress para soportar widgets no es suficiente, se necesia que los temas estén habilitados para utilizarlo, en el artículo “widgetizing themes” hay un tutorial que indica como hacerlo.

Los widget de wordpress como se dijo anteriormente, se usan en los sidebar, lo primero que debemos hacer es identificar como está implementado nuestro sidebar y como está dividida cada sección. En la mayoría de los casos en los temas que nos encontramos en internet, estos widget están implemementados en listas no ordenadas html, esta estructura puede ser fácilmente adaptada via hojas de estilo en cascada (css) para lograr direntes tipos de efectos.

Para hacer un tema conciente de los widget, basta con agregar en la parte de código que genera el sidebar lo siguiente.

<?php if ( !function_exists('dynamic_sidebar')|| !dynamic_sidebar() ) : ?>
 <!-- codigo sidebar estático-->
<?php endif; ?>

La instrucción dynamic_sidebar() esta disponible en wordpress habilitados con widget y permite que el plugin de widgets fije dinámicamente el contenido del sidebar.

El siguiente paso es registrar el sidebar (Wodpress version 2.0 o superior) para ello, edite el ficher function.php (o creelo si no está) y agrege:

<?php
if ( function_exists('register_sidebar') )
    register_sidebar();
?>

Esto permitirá al plugin conocer que su tema necesita exactamente un sidebar y agregará en la parte administrativa presentación de wordpress un botón widget que le permitirá configurar dinámicamente su barra lateral de manera gráfica usando drag & drop.

El plugin de widget soporta además otras formas de sidebar y permite configurar el contenedor del título y del widget, para personalizar las salidas de los widget, usamos una versión extendida de register_sidebar.

<?php

if ( function_exists('register_sidebar') )
    register_sidebar(array(
        'before_widget' => '',
        'after_widget' => '',
        'before_title' => '<div class="title">',
        'after_title' => '</div>',
    ));
?>

La estructura de before_widget es un poco más compleja, el valor por defecto es incluye las directivas %1$s y %2$s que corresponden al id y a la clase respectivamente (El ID debe ser único en todo el documento html). De esta forma, el registro del sidebar sería:

if ( function_exists('register_sidebar') )

    register_sidebar(array(

    'before_widget' => '<div id="%1$s" class="widget %2$s">',

    'after_widget' => '</div>',

    'before_title' => '<div class="title">',

    'after_title' => '</div>',

    ));

?>

Para registrar varios sidebars use register_sidebars(n) y en el sidebar indique el sidebarque desea usar en la instrucción dynamic_sidebar(Número Sidebar).

Finalmente, para implementar nuestros propios widgets, creamos una función en el tema y la registramos como widget.

function widget_mytheme_search() {
?>
    << PASTE YOUR SEARCH FORM HERE >>
<?php
}

if ( function_exists('register_sidebar_widget') )

register_sidebar_widget(__('Search'), 'widget_mytheme_search');

Para más información sobre como hacer widgets puede leer el documento How I do Develop a Widget. Yo luego estaré escribiendo algo del tema, ahora me voy a jugar un rato con mi temas para widgetizarlos… que termino más raro. :-).