How to get automatic blog archive page in Blogger in 5 seconds

Wow,  I can't believe I actually got such an awesome way to do it!
Here's the Here's the demo of how your blog archive page will look like.

It just couldn't be easier! I still can't bring myself to believe it worked!  Jeez! (Touch wood)

I got this from

Steps to follow to get a Blogger Blog Archive Page

  1. Go to Blogger and sign in
  2. Go to PAGES
  3. Add a new page titled Archive (or whatever you want to call it but be sure you save it with that name. 'Untitled' will make you lose your permalink SEO) 
  4. Go to HTML mode (just on right of Compose at the top left) 

  1. Simply paste the code below! (it's a really short code. Go to original page here) 

  2. And hit publish and you are done! Hurray! 

For example,  if your blog name is,  change 'thisawesomeblog'  to 'yourblogname'

I earlier got it from fabulous blog but the link just didn't work. It had linked to this original blog which had very kindly posted such an awesome way to gave a blog archive. So to create my blog archive page I went into their how to create blog archive and Voila!
So if it doesn't work in this post also, chillax and visit the original page! It works!

It is so simple!  So damn simple! I just can't believe it still!  So,  I thought why not help everyone of you who like me are searching all over the Internet how to have a cool archive page.

Adding the basic blog archive widget to the sidebar is what we used to do when we were kids.  Right?
I mean who wants to know what you did in what month? Is it a treasure hunt? I don't know where blogger feedback department sleeps. Because they are obviously not improving. As the main blogger provided widgets are just where they were years ago,  one has to Google all over the world to find these really cool codes being given.

But I'm usually anxious on whether the code will work or not.  Especially ask me to go to edit html in template and I'm dead at finding the place where I should paste it. Trust me Blogger is not at all easy on an Android phone or an iPad!

So,  this was a flat 5 second way to get my blog archive page. I then designed a Hogwarts style graphic design to add some shimmer and glamour to my blog archive page.

The default code in this one has the links in your link color of your template and page text formatting along with the dates on the right in a different color.

I couldn't increase the line height. It looks a little packed,  I know. But don't you think it's awesome? Let me know what you think!

P.S: Talk to me, I'm right here. (Pls comment. Makes me feel great) || Tweet @doveranalyst


  1. Unfortunately I can't get this to work :( It doesn't come up with anything except "archive" and a comments section, help please!

    1. Did you go to the main site ? Copy paste the code from there only. It always works.

      Try deleting everything in the html mode in your archive page, if you have pasted and tried already. And then start afresh. It works.

      Mine has suddenly vanished once. I figured it was because of the picture I had added. It so happens the code actually changes into a huge code. So, try deleting everything and doing it again

  2. Same issue, did not work. I made sure the second script element had my blog url. I also went to the original github and copied the code from there. :(

    1. Go to github and copy that code, change the URL, like you did. But, the trick is to remove any previous attempts from your HTML window before you publish it.

      Once, my archive page (at was gone. So, when I tried re-pasting the code, it didn't work.

      Just do a select all and delete any content or script left over from previous attempt in the static page. If you see my page, I also inserted an artwork that I created. I deleted everything below it, before I copied the code from github. Try it and it will work. Share your archive links with us.

    2. Heya, it works for me in this very site. Like I said, once I did face a problem in implementing it too. You have to go to the original github website. I do not own the code and hence, it does not even work if you copy from this post. From the link given, go to the github site, copy the code from there and then empty your entire html content. And by that I mean, in the new page, whatever you have attempted earlier will actually create a problem. Empty it completely. Paste and publish and you are good to go!


Post a Comment

Please do subscribe on I love replying! :)
fb/doveranalyst | |

Follow @rjtanu