Tutorial Blogger: Poner el archivo del blog en una página estática

24 ago 2016


Hola! ¿Qué tal están? Hace casi un mes compartí un tutorial donde mirábamos cómo personalizar el gadget de archivo de nuestro blog con la manera convencional y de acuerdo a nuestro propio estilo, y aquí está la "segunda parte" o mejor dicho, parte extra de ese tutorial.

Sucede que S. del blog Escalera de Teclas (esta va dedicada para ti xD no se me había ocurrido hacerlo) me preguntó si conocía o había alguna forma para poner el archivo en una página estática con actualización automática para no tener que hacerlo de forma manual y me sugirió que compartiera la forma, si la tenía. Siendo sincera, no conocía ninguna, de hecho yo de script no sé nada, pero soy más o menos buena buscando lo que sea así que me dediqué a eso y obtuve resultados. Encontré varios tutoriales en inglés, los cuales daban resultados diferentes pero ninguno me gustó tanto como el tutorial en el cual me he basado para hacer esta entrada.

Como dije, el tutorial al igual que el archivo estaba en inglés y me tocó hacer alguna maniobra para ponerlo en español y así mismo personalizar algunas cosas que no estaban incluidas en ese tutorial pero básicamente es lo mismo. Es supremamente sencillo, tanto que ni siquiera es necesario acceder a la plantilla HTML ni buscar etiquetas o cosas por el estilo.


El archivo queda super bonito, exactamente como se ve en la imagen. Si quieren pueden acceder a la página de mi archivo y mirarlo más de cerca. Las entradas se agrupan por mes, de las más antiguas a las más recientes. Dada la naturaleza del script no es posible organizarlo de una forma en que se pueda desplegar y ocultar algunas partes del archivo como sé que nos gustaría, pero si llego a ver alguna manera, con gusto la compartiré. Para ponerlo en su blog solo deben preparar el código y seguir cuatro sencillos pasos:




Primero desplegaremos el código, lo pegremos en una hoja del bloc de notas de nuestra computadora o un nuevo documento de word y editaremos el código según las indicaciones. Podemos ver que al final del código que hemos desplegado hay unas líneas que están de otro color; estas son las partes que  debemos modificar.

IMPORTANTEEn la línea <script src="http://TuBlog.blogspot.com/feeds/posts/default?max-results=500... debemos poner el enlace de nuestro blog en lo que está de color morado para que muestre el archivo de este; si hay el más mínimo  algún error en esta parte no se mostrará el archivo. Cuando tengamos listo el código procederemos con los cuatro pasos:


Paso 1: Vamos a PÁGINAS → PÁGINA NUEVA.
Paso 2: Ponemos un nombre de nuestra preferencia a la página que estamos creando.
Paso 3: Clickear en HTML para poner la entrada en este modo. Es indispensable que corroboremos que está en el modo HTML, porque de lo contrario no daría resultado.
Paso 4: Ponemos el código que previamente hemos editado y personalizado. Y por favor nos aseguramos de que hemos editado la parte donde debemos poner la URL de nuestro blog. Luego publicamos la página y listo.

Si tenemos el gadget de archivo y queremos ocultarlo para que sólo quede la página, vamos a PLANTILA → EDITAR HTML y clickeamos en cualquier parte de la plantilla para activar la caja de búsqueda (CTRL + F simultáneamente). Buscamos la etiqueta de cierre ]]></b:skin> y ponemos el código siguiente justo encima, con cuidado de no borrar la etiqueta:

#BlogArchive1 {
display: none !important;
}

Después de esto sólo debemos añadir el Archivo utilizando la URL de la página, como normalmente se haría con una página x, a una pestaña de nuestro menú o en la parte de la plantilla que queremos que se muestre. Como podemos ver, es muy fácil de realizar y nos serviría mucho si tenemos el archivo en una página estática con actualización manual o queremos una alternativa bien chachi para el gadget de archivo. Espero que les sirva y se animen a hacerlo, ahora o en cualquier momento.

Al igual que S., también pueden sugerir tutoriales o entradas sobre algo en específico y con mucho gusto lo haré, si no sé la respuesta lo buscaré hasta encontrar :D

Si les ha gustado el post o si les parece que puede servir a alguien más ¡Compartan la entrada en sus redes sociales! Eso me haría muy feliz ;)

Eso es todo por hoy. ¿Les ha gustado? ¿Se animan a hacerlo?
¡Los leo! Un abrazo gigante.

xx Jisela

11 comentarios

  1. Hola Jisela, pues tu post me ha caído como anillo al dedo... soy un lió con el html y desde tiempo que quiero cambiar el diseño de mi blog! así que has sido de gran ayuda

    besos y que tengas un bonito día

    ResponderEliminar
  2. ¡Buenas!
    Yo voy y veo tu respuesta a mi comentario HOY OTL Bueno, así me he llevado la sorpresa... porque además no caí en eso cuando comenté en tu última entrada :'DUu

    ¡Muchas gracias por averiguar y dejarnos el tutorial por aquí! En cuanto tenga un ratito voy a hacerlo en mi blog >U<


    ¡Abrazotes! ♪♥

    ResponderEliminar
  3. Hola!
    Yo la verdad soy un desastre con estas cosas jajaja^^
    Gracias por el tutorial :D
    Un beso!

    ResponderEliminar
  4. Este es el momento en el que me doy cuenta que, si no llego a ver esto, jamás se me hubiera pasado por la cabeza hacer un archivo estático. Lo que es genial, porque eso de estar accediendo a las etiquetas y todo eso, resulta muchísimo más complicado, así que tomaré nota y si algún día me animo, serás la primera en saberlo.

    Ya he checado el tuyo y me he puesto a curiosear entradas antiguas que no hubiera podido ver de no ser por esto, así que gracias por dedicarle tiempo a ayudar a los y las interesados(as) en aprender un poco más de html.

    Te mando un beso enorme, Jisela y espero que estés muy bien ♥

    ResponderEliminar
  5. Hola!!!

    Recuerdo que cuando inicie con mi blog todo eso del HTML y Script me era tan ajeno que me dolía la cabeza nada más de ver tantos códigos, y es un alivio que personas pacientes y listas como tu hagan estas entradas para personas sin paciencia para buscar como yo♥

    Sin dudas lo pondré en practica para un próximo diseño de mi blog, besos ♥

    ResponderEliminar
  6. No conocía un archivo de este tipo, me encantó! Intentaré usarlo, aunque creo que no quedará muy bien porque son siete (casi ocho) años de entradas en el blog... tal vez pueda limitarlo a mostrar sólo desde un año en especifico.
    Gracias por el tuto!!

    ResponderEliminar
  7. ¡Buenas!
    He vuelto :'D

    Hoy al fin me he puesto con esto y... sólo me aparecen entradas hasta julio de 2015, cuando yo comencé a escribir en mi blog allá por noviembre de 2014 (no tengo ni 300 entradas, eso sí, así que no creo que sea eso, ¿no?). ¿Tienes idea de qué podría estar fallando? Porque yo no ;___;Uu

    ¡Saludillos! .u. ♪

    ResponderEliminar
  8. Hola!!
    Me ha encantado el tutorial, hace tiempo que buscaba algo parecido, aunque a mí tampoco me salen todas las entradas, ni siquiera modificando el número de max-results=500, pero bueno igual lo terminaré haciendo :)
    He estado echando un vistazo por tu blog y me ha gustado mucho, así que ya me tienes como seguidora, te invito al mío si te apetece!
    Besos :33

    ResponderEliminar
  9. ¡Hola de nuevo!

    Al fin lo puse en practica y me salió todo perfecto, eres genial, te he acreditado y todo♥ Sólo que al igual que S, tengo entradas del 2015 que no me salen, inicia de abril del 2015 ¿Se podría hacer algo para que salgan todas las entradas?

    Besos ♥

    ResponderEliminar
  10. Si no se ve el código queria hacer exactamente esto! Pero como no se ve el código pues no lo pude hacer...

    ResponderEliminar
  11. Hola! Me encanta tu índice pero no puedo ver el script porque no funciona el desplegable. ¿Podrías ayudarme? Muchas gracias!

    ResponderEliminar

¡Suscríbete! Recibe todos los posts en tu e-mail.