Necesitaba agrupar algunos gadgets de la sidebar para acortarla un poco, encontré este tabview y la verdad es que no está nada mal.
 |
| Ejemplo finalizado |
Si os decidís a llevarlo a vuestro blog solo seguid estos sencillos pasos....
1. Iniciamos sesión en Blogger y nos vamos a Diseño >> Edición de HTML
2. Nos asegúrese de poner la marca de verificación de " Expandir plantillas de artilugios "
3. Busca la etiqueta </head> mediante el uso de Ctrl + F
4. Pegamos a continuación el código antes de la etiqueta </head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js">
</ Script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js">
</ Script>
<script>
$ (Document). Ready (function () {
$ ("Pestañas #") pestañas ().;
});
</ Script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/blitzer/jquery-ui.css" type="text/css" />
</ Script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js">
</ Script>
<script>
$ (Document). Ready (function () {
$ ("Pestañas #") pestañas ().;
});
</ Script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/blitzer/jquery-ui.css" type="text/css" />
5. Ahora vamos a Diseño >> Elemento de página y hacemos clic en Añadir un gadget, ahí seleccionamos "HTML / Javascript" y pegamos el siguiente código:
<div id="tabs">
<li>
<a href="#tabs-1"> Tab-1 </ a> </ li>
href="#tabs-2"> <a Tab-2 </ a> </ li>
href="#tabs-3"> <a Tab-3 </ a> </ li> </ ul>
<div id="tabs-1"> script o texto aquí </ div>
<div id="tabs-2"> script o texto aquí </ div>
<div id="tabs-3"> script o texto aquí </ div>
<li>
<a href="#tabs-1"> Tab-1 </ a> </ li>
href="#tabs-2"> <a Tab-2 </ a> </ li>
href="#tabs-3"> <a Tab-3 </ a> </ li> </ ul>
<div id="tabs-1"> script o texto aquí </ div>
<div id="tabs-2"> script o texto aquí </ div>
<div id="tabs-3"> script o texto aquí </ div>
Donde pone Tab-1-2-3 colocamos el título de la pestaña y donde pone script o texto aquí insertamos el contenido de dicha pestaña.
6. Para finalizar guardamos el HTML / Javascript y listo.
Publicar un comentario