Este método de solapas es muy común verlo en el los sidebars  y resulta  muy útil a la hora de ahorrar espacio en nuestro blog, dejándolo ordenado y visualmente  atractivo.

Acá les dejo una guía paso a paso,donde explico cómo implementar las pestañas (tabs) con un scrip open source llamado DomTABs

1 – Descarga y descomprime el scrip desde este enlace
2 – Sube el archivo domtab.js dentro de la carpeta de tu theme de WordPress.
3 – Descargar pbd_domtab.css (click derecho -> Guardar destino co

mo o  Guardar enlace como), y subelo también dentro de la carpeta de tu theme
4 – En el archivo header.php de tu theme copia el siguiente código antes de la etiqueta </head> (asegúrate de fijar las comillas si se cortan y pegan de este post):

<script type=”text/javascript” src=”<?php bloginfo(‘template_directory’); ?>/domtab.js”>

</script> <link rel=”stylesheet” type=”text/css” href=”<?php bloginfo(‘template_directory’); ?>/pbd_domtab.css” media=”screen” />

5 – En el archivo sidebar.php de tu theme, pega el siguiente código donde quieras que se muestren las pestañas de DomTABs:

<div class="domtab">
 <ul class="domtabs">
 <li><a href="#t1">titulo de la pestaña 1</a></li>
 <li><a href="#t2">titulo de la pestaña 2</a></li>
 </ul>
 <div>
 <a name="t1" id="t1"></a>contenido de la pestaña 1 </p>
 </div>
 <div><a name="t2" id="t2"></a>contenido de la pestaña 2 </p>
 </div>
 </div>

Eso es todo, si quieres añadir mas pestañas solo copia una línea mas en cada sección y cambia la referencia de t3 a t4 y así consecutivamente.

Si quieres cambiar el diseño de tus DomTABs, solo edita el archivo pbd_domtab.css, donde hay una expliación de las lineas que tienes que cambiar.