Adblock Detectado

Nuestro sitio se mantiene gracias a la publicidad, por favor Desactiva Adblock para seguir navegando

He desactivado Adblock
En este tutorial veremos como crar una pagina con Mapa del Blog o mapa del Sitio como mas les guste llamarlo.
Esta sera una versión en tablas con las posibilidades de ordenar por nombres o etiquetas.

Esta tabla estara ordenada por "Titulo de la entrada" "Etiquetas" "Fecha Creada"
Antes de comenzar veremos una demostración: 

Comencemos:

  • Paso 1: Vamos a Blogger>> Pàginas>> Pàgina Nueva>> Pàgina en Blanco

  • Paso 2: Copiamos el siguiente código y pegamos en la Pagina en blanco en  HTML
<style type="text/css">
#tocTable {
  border:2px solid white;
  font:normal 11px Verdana,Arial,Sans-Serif;
  color:#333;
  border-collapse:collapse;
  text-align:left;
}
#tocTable th, #tocTable td {
  border:1px solid white;
  background-color:#fafafa;
  padding:10px 15px;
}
#tocTable th {
  background-color:#5d5d5d;
  font-weight:bold;
  color:white;
  text-shadow:0px 1px 0px rgba(0,0,0,0.3);
}
th#th1         {width:60%;background-color:#5A930D;}
th#th2, th#th3 {width:20%;}
#tocTable td.toc-header-col1,
#tocTable td.toc-header-col2 {padding:0px 0px !important;background-color:#2372A7;}
#tocTable td.toc-header-col3 {background-color:#D7DEF0;}
#tocTable a {
  display:block;
  text-decoration:none;
  color:white;
  padding:10px 15px;
  background:transparent;
}
#tocTable td.toc-header-col1:hover,
#tocTable td.toc-header-col2:hover {
  background-color:#174B6F;
  -webkit-box-shadow:inset 0px 0px 3px rgba(0,0,0,0.4);
  -moz-box-shadow:inset 0px 0px 3px rgba(0,0,0,0.4);
  box-shadow:inset 0px 0px 3px rgba(0,0,0,0.4);
}
select#tocSort {
  width:200px;
  border:1px solid #ccc;
  display:block;
  margin:0px 0px 7px 0px;
}
</style>
<script type="text/javascript">
var numberpost   = 999, // Tentukan jumlah maksimal posting
    theOption    = "Opciones...",                  // Label opsi 1
    theSortPost  = "Ordenar por Nombre", // Label opsi 2
    theSortLabel = "Ordenar por Etiquetas", // Label opsi 3
    theJudul     = "Titulo de la entrada",  // Header tabel 1
    theLabel     = "Etiqueta",  // Header tabel 2
    theDate      = "Fecha ",   // Header tabel 3
    blankLabel   = "Tak Berlabel",   // Label kosong
    yoursite     = "http://tutorialesblogger.blogspot.com"; // URL blogmu
</script>
<script src="https://dl.dropboxusercontent.com/u/91602513/Html/TutorialesBlogger.blogspot.com/Mapa%20del%20Blog.js" type="text/javascript"></script>

  • Paso 3: Damos en Publicar y a disfrutar de nuestro Mapa del Blog o Mapa del sitio 
Nota:- Solo deberás de cambiar la URL rojo por tu URL
- - 8 Comentarios
Tag

Comentarios (8)

  1. Que rabia que no me funciona con la URL de mi blog. Con la vuestra sí que funciona.
    ¿Puedo haber pasado algo por alto?
    ¿Es necesario configurar el feed de alguna forma?
    Gracias

    ResponderEliminar
  2. @Manuel Hervás Arribas Copia la URL del blog sin .es

    Solo blogspot.com

    Espero que me hallas entendido

    ResponderEliminar
  3. Este comentario ha sido eliminado por un administrador del blog.

    ResponderEliminar
  4. Este comentario ha sido eliminado por un administrador del blog.

    ResponderEliminar
:))
:((
:D
:(
:)
:-)
;)
=))
:p
=.=
==
^_^
/=he
:*
/=r
/=l
:v
/=ok
/=clap
(y)
(yy)
/=hi
/=j
/=hup
/=hd
/=hl
/=hr
/=s
<3

Instrucciones Para omentar

Incertar Enlace

Utilice el codigo <a href='LINK'> EJEMPLO </a>

Cargar Imagen

[img] LINK_ANH [/img] -Use el codigo para cargar una imagen.

Formato Word

<b> negrita </b>
<i> cursiva </i>
<u> texto subrayado </u>
<strike> texto tachado </strike>

Insertar un Fragmento de codigo

Primero use esta herramienta para codificar el codigo que quiera agregar.
Luego utilice el codigo [code] CODIGO HTML [/code]

Cerrar