Cómo adaptar tu theme de WordPress a Widgets
de: http://www.tecnobot.com/tutorial-como-adaptar-tu-theme-de-wordpress-a-widgets/
Tutorial: “Cómo adaptar tu theme de WordPress a Widgets”
en No tag for this post.el 05/05/2007Recientemente tuve que widgetear varios themes que usaba para WordPress y me di cuenta de que no tenía ni idea de cómo hacerlo. De hecho, el manual que Automattic ofrece en su web de proyecto es muy limitado y no explica correctamente cómo hacer funcionar características adicionales.
Así que decidí hacer un tutorial en español para aquellos diseñadores que quieran ‘widgetear’ su theme, es decir, adaptarlo para su uso con el plugin de Widgets de Automattic.
¡Haz click en leer más para ver el tutorial!
1. Nuestro sidebar.php, ¿ordenado o desordenado?
Primero de todo, tenemos que mirar la estructura del código de nuestra barra lateral, nuestro sidebar. Eso lo podemos mirar accediendo al archivo sidebar.php en el directorio de nuestro theme o en el Editor de Themes de WordPress, bajo el menu de Presentación. Podemos tener dos tipos de sidebar: ordenado o desordenado.
Un buen ejemplo de ordenado sería este:
En este sidebar, los títulos de cada bloque del sidebar están encerrados en etiquetas h2 y la asignación de cada bloque está definida por etiquetas de listas li. Todo el sidebar está encerrado en una etiqueta ul primaria y después el texto de cada bloque está encerrado en otra etiqueta ul.
Si tienes un sidebar como este, pasa al paso 2: “Para sidebars ordenados por listas”.
Si, como a mí me pasó, no tienes uno así, sólo continúa leyendo.
Lo más normal es encontrarse sidebars que no están ordenados por listas li. También puede ser que tu sidebar no sólo no esté ordenado por listas li, sino que tampoco esté bajo etiquetas ul. Como ejemplo, daré el sidebar del theme que estoy usando en Sensei 21 ahora mismo, llamado Leia y creado por Kapikua.
Cuando me bajé el theme, el sidebar era así:
-
Categorias
Paginas
’ ); ?>
La estructura parece ordenada, y en cierta forma lo está, pero no es compatible con la estructura de un sidebar de widgets.
Otro ejemplo de estructura desordenada, que es el que dan en el tutorial de Automattic, sería el siguiente:
Si tienes un sidebar desordenado como este o de otro tipo, pasa al paso 3: “Para sidebars desordenados”.
2. Para sidebars ordenados por listas.
Si tu sidebar está ordenado por listas, tal como el ejemplo que ofrecí en el paso 1, estás de suerte porque el mecanismo es muy fácil.
Necesitas crear un archivo con tu Bloc de Notas o cualquier otro editor de text plano, llamado “functions.php”, que colocarás en el directorio del theme (en el mismo directorio que tiene el style.css, el index.php, el header.php, etc.). [Si ese archivo ya existe en el directorio de tu theme, no necesitas crearlo. Aunque lo más posible es que ya esté habilitado para widgets]
Este functions.php tiene que decir sólo lo siguiente:
if ( function_exists(’register_sidebar’) )
register_sidebar();
?>
Este código lo que hará será registrar tu sidebar como dinámica.
Después de eso, necesitarás implementar un pequeño trozo de código en tu sidebar. Tomaremos como ejemplo el sidebar que antes usé para ejemplificar un sidebar ordenado. Toma nota de las partes insertadas, que están en negrita:
Estas dos porciones en negrita tendrás que ponerlas tal y cómo se muestra en negrita, al principio y al final del código de tu sidebar.
¡Ya está! Tu sidebar ya está preparada para widgets. Si ya tienes el Widget Plugin instalado en tu WordPress, en el submenú de Presentación debería aparecerte un botón que dice “Sidebar Widets”, donde podrás incluir y manipularlos a tu gusto.
3. Para sidebars desordenados
Tu sidebar es desordenado. No pasa nada. Yo no tuve tanta suerte y todos los themes que quise widgetear estaban desordenados y muy desordenados. Tranquilo, no es el fin del mundo. El proceso es más sencillo de lo que crees.
Vamos a tomar como ejemplo el sidebar.php que Automattic ofrece en su web:
En un caso extremo, tendríamos que cambiar tooodo el código del sidebar y modificarlo para que fuese compatible con widgets. Pero los de Automattic fueron más listos y crearon un sistema de condiciones para que WordPress interprete tu forma de sidebar.
Necesitas crear un archivo con tu Bloc de Notas o cualquier otro editor de text plano, llamado “functions.php”, que colocarás en el directorio del theme (en el mismo directorio que tiene el style.css, el index.php, el header.php, etc.). [Si ese archivo ya existe en el directorio de tu theme, no necesitas crearlo. Aunque lo más posible es que ya esté habilitado para widgets]
El archivo será así:
if ( function_exists(’register_sidebar’) )
register_sidebar(array(
‘before_widget’ => ”,
‘after_widget’ => ”,
‘before_title’ => ‘
‘after_title’ => ‘
’,
));
?>
¿Lo ves? Lo que hace el archivo es establece, primero de todo, que tu sidebar será dinámica, y la registra como tal. Después, crea equivalencias para que wordpress interprete correctamente tu sidebar. Observa la línea que dice ‘before_title’ => ‘
Si en tu sidebar, por ejemplo, los títulos de cada bloque del sidebar están definidos por,
, o el que sea, como
, en esos campos del functions.php pondrás el que corresponda.
Ahora sólo queda añadir un pequeño trozo de código en el propio sidebar.php. Toma nota de las partes en negrita, que serán las añadidas:
|| !dynamic_sidebar() ) : ?>
About
This is my blog.
Links
Example
Deberás poner estas etiquetas en negrita al principio y al final del código de tu sidebar para que se corresponda con el functions.php.
¡Ya está! Tu sidebar ya está preparada para widgets. Si ya tienes el [tag]Widget[/tag] Plugin instalado en tu [tag]Wordpress[/tag], en el submenú de Presentación debería aparecerte un botón que dice “Sidebar Widgets”, donde podrás incluir y manipularlos a tu gusto.
|
|
 | 30 agosto 2010 en Informática | tags: Informática |
