Crear Tabla de contenidos para la página de tu blog


Anteriormente hemos hablado de la creación de la tabla de contenidos en la barra lateral. Ese truco requiere dos componentes. No es el código que se pide que el contenido de su blog, y proporciona un enlace en el sidebar.This truco es también similar a la primera. hemos hecho algunas modificaciones en esa code.You necesidad de combinar dos códigos en el puesto page.For demostración se puede ver nuestra página de tabla de contenido.

Hack comienza

En primer lugar crear un nuevo blog y pegar el código siguiente en la sección Edición de HTML

Usted puede ver todo el post publicado en este blog aquí.
Para ver el cuadro completo de contenido, haga clic en el siguiente enlace (que se tome unos momentos)
<div id="toclink"> <a href="javascript:showToc();"> "Mostrar Tabla de contenido </ b> </ a>
</ div> <script style="" src="http://home.planet.nl/%7Ehansoosting/downloads/blogtoc.js"> </ script>
<script src="http:// YOURBLOG .blogspot.com/feeds/posts/default?alt=json-in-script&max-results=999&callback=loadtoc"> </ script>
<div id="toc"> </ div>


Recuerde que debe sustituir YOURBLOG tu blog con el nombre y pegue el código anterior para que se parezca a esto.

Ahora el segundo paso es el paso opcional. Si desea dar a su estilo de tabla de contenido a continuación, copie el siguiente código y pegarlo en la sección de cabecera de tu blog código déjelo.

<style type="text/css">
# toc (
border: 0px sólido # 000000;
de fondo: # ffffff;
padding: 5px;
ancho: 500px;
margen superior: 10px;
)
. toc-header-col1,. toc-header-col2,. toc-header-col3 (
de fondo: # ffd595;
color: # 000000;
padding-izquierda: 5px;
ancho: 250px;
)
. toc-header-col2 (
anchura: 75px;
). toc-header-col3 (
ancho: 125px;
)
. toc-header-col1 a: link,. toc-header-col1 a: visitado. toc-header-col2 a: link,. toc-header-col2 a: visitado. toc-header-col3 a: link, . toc-header-col3 una: visitó (
font-size: 80%;
text-decoration: none;
)
. toc-header-col1 a: hover,. toc-header-col2 a: hover,. toc-header-col3 a: hover (
font-size: 80%;
text-decoration: underline;
)
. toc-entrada-col1,. toc-entrada-col2,. toc-entrada-col3 (
padding-izquierda: 5px;
font-size: 70%;
)
</ style>



Más información se puede dar link a su página de tabla de contenido en tu blog. Ir a la disposición para que la página de destino y agregar un nuevo elemento de página HTML. Después de que crear un enlace de texto y utilizar el enlace de la tabla de contenido que la página que ha copiado.