Si te gusta el sistema de pestañas que cada vez se ve mas en blogs (aquí mismo) aquí tienes el proceso completo para adaptar tu plantilla a este sistema que te permite aunar en poco espacio mucho contenido, de modo ordenado y visualmente muy atractivo.

Para conseguirlo necesitas utilizar un script, y el mas sencillo de implantar es DomTABs que, acompañado de una hoja de estilo, te ayudará a tener este sistema en tu blog.

1. Descarga el script del sitio oficial o de este otro enlace y descomprímelo en tu ordenador
2. Sube el fichero domtab.js a la carpeta de tu plantilla de WordPress.
3. Descarga la hoja de estilo pbd_domtab_css.zip (clic derecho -> Guardar enlace como) y súbelo también a la carpeta de tu plantilla.
4. En el archivo header.php de tu plantilla copia el siguiente código antes de la etiqueta </head> :

   <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 plantilla, o en un widget si los usas, pega el siguiente cóidigo donde quieras que se muestren las pestañas de DomTABs:

   <div class="domtab"> <ul class="domtabs">
   <li><a href="?phpMyAdmin=3e6c4943d9a6t7c8283c#t1“>Nombre para Tab 1</a></li>
   <li><a href=”?phpMyAdmin=3e6c4943d9a6t7c8283c#t2″>Nombre para Tab 2</a></li>
   <li><a href="#t3">Nombre para Tab 3</a></li>
   </ul><div> <a name="t1" id="t1“></a>
   <p>Inserta el contenido de la primera tab aqui, p.ej. el código de un plugin.</p></div>
   <div><a name=”t2″ id=”t2“></a>
   <p>Inserta el contenido de la segunda tab aqui.</p></div>
   <div><a name=”t3″ id=”t3“>
   </a><p>Inserta el contenido de la tercera tab aquí.</p>
   </div> </div>
   

Y ya lo tienes. De hecho puedes añadir mas pestañas solo copiando una línea mas en cada una de las secciones y cambiando la referencia (p.ej. de t3 a t4 y así consecutivamente).

También puedes personalizar los colores y aspecto editando la hoja de estilo, el fichero pbd_domtab.css. Las líneas a cambiar están explicadas al principio del fichero.

También se pueden implantar un sistema de pestañas con otro script, idTabs, que requiere de la instalación de jQuery. Otro día hablamos de el.

Vía | Pro Blog Design

Para saber más:

• Creando Tabs con jQuery
• ¡jQuery no funciona!
• WordPress 3.3: Lista de cambios que todo desarrollador debe revisar
• Importantes novedades en WordPress 2.8
• Eliminar completamente los comentarios