Tutorials, tips and tricks about Blogger

22 Mar

iStudio HTML5 Blogger template

6 Comments | by in Freebies | 2011

Español Português

iStudio is a template originally designed for WordPress by Xu.hel and converted to Blogger by Blog and Web and BTemplates. A simple, but elegant, clear and functional design.


  • HTML5 Code.
  • Random header.
  • Faithful adaptation from WordPress.
  • Color settings from the panel.
  • Static pages menu.
  • Compatible with modern browsers and IE8 and higher.


Blogger: Download | Demo
WordPress: Download | Demo


You can read our FAQ section to see how to install a blogger template.


1. Random headers.

You can add / change the images in the following template code:

images = new Array(3);
images[0] = "<img alt='' src='https://4.bp.blogspot.com/_Zuzii37VUO4/TYgALoaiH3I/AAAAAAAAFiQ/k9sEBPYHcqk/s000/stushow1.jpg'/>";
images[1] = "<img alt='' src='https://lh6.googleusercontent.com/_Zuzii37VUO4/TYhA6myzoaI/AAAAAAAAFio/vG-tPIJhIAw/s000/stushow2%5B1%5D.jpg'/>";
images[2] = "<img alt='' src='https://lh4.googleusercontent.com/_Zuzii37VUO4/TYhBGCd7LvI/AAAAAAAAFis/EpH53jaE5NY/s000/stushow3%5B1%5D.jpg'/>";
index = Math.floor(Math.random() * images.length);


To add links to the menu simply create a new static page from the Dashboard.


This work is licensed under GPL. This means you may use it, and make any changes you like. Just, please, leave the credits on footer to respect the designer’s work.


6 Comments, leave a reply · Feed
  1. Hello

    I would like to use one of your beautiful blog templates. I would like to upload some costumes jewelry that I make for sale. I wanted to know if there are any templates that allow for me to add Pay Pal to my blog. I have not done this before and this will be my first attempt to set up online.

    Pls email me to let me know if I can use your template and which ones would be appropriate.

    Thank u kindly

  2. Hola que tal,excelente plantilla, realmente no tengo mucha idea pero la piloteo, estoy agregando el script de leer mas haciendo los siguientes pasos y logro agregarlo pero me desordena literalmente toda la pagina, los pasos que sigo son los que aparecen en el escaparte de rosa :


    Si me puedes dar una solucion de como agregar un “leer mas” sin que se desordene el blog te lo agradeceria, desde ya gracias

  3. Hi,
    I’ve noticed that in the HTML “pure” (without any customizations) code there is this text:

    /* Downloads Button */
    article .entry div.but_down a{float:left;display:block;background:transparent url(https://1.bp.blogspot.com/_Zuzii37VUO4/TYgAJUjvN1I/AAAAAAAAFhs/o9L-iifkzUE/s000/dlbutton.png) no-repeat left top;border:none;padding:0 0 0 40px;height:33px;font:12px Tahoma, Arial;color:#123;text-decoration:none;}
    article .entry div.but_down a span{float:left;display:block;background:transparent url(https://1.bp.blogspot.com/_Zuzii37VUO4/TYgAJUjvN1I/AAAAAAAAFhs/o9L-iifkzUE/s000/dlbutton.png) no-repeat right top;padding:0 10px 0 0;line-height:33px;cursor:pointer;}
    article .entry div.but_down a:hover{color:#000;}

    I think that I can use the images linked to create a custom download button with the text that I want… Am I right?

    And another question: how can i customize the sidebar menu making customs link?

    Thankk you.

  4. really great wordpress theme remaked for blogspot user’s
    but disqus comment box is not appearing properly please any one can help me please

  5. Nice template. Why my page element didn’t appear correctly? How I want to add a gadget??

  6. Lemari Arsip October 16, 2012

    Nice Tool, Thank You For Sharing…


You must be logged in to post a comment.

Tutorials, tips and tricks about Blogger