Como crear pestañas en Blogger: DOMtab

DOMtab es otra forma de crear pestañas en Blogger.

Para hacerlo solo tenemos que descargar el ZIP y usaremos los dos archivos

domtab.js y domtab.css

Agregamos ambos antes de </head>:

<script type="text/javascript" src="URL_domtab.js"></script>
<link rel="stylesheet" type="text/css" href="URL_domtab.css"/>

El código HTML elemental tendría esta estructura:

<div class="domtab doprevnext">
  <ul class="domtabs">
    <li><a href="#t1">Pestaña 1</a></li>
    <li><a href="#t2">Pestaña 2</a></li>
  </ul>
  <div>
    <h2><a name="t1" id="t1">La Pestaña 1</a></h2>
    <p> ... contenido Pestaña 1 ... </p>
  </div>
  <div>
    <h2><a name="t2" id="t2">La Pestaña 2</a></h2>
    <p> ... contenido Pestaña 2 ... </p>
  </div>
</div>

Cuando en el bloque principal se agrega la clase doprevnext, en la parte inferior de cada pestaña aparecerá un enlace para avanzar o retroceder.


En el sitio del autor hay muchos más detalles de cómo configurar el script y personalizarlo.