Latest From My Blog

Elegant Blogger Templates for Movie Review

These 3 templates was made by Maskolis in Creating Website especially for those who love movie collection. There's 3 styles color, they are black, white and green, easy to navigated.  Just download it, open xml template with wordpad and then copy into your Edit HTML. This templates suitable for gallery movie content blog with daily updates. But you can use it for any gallery images content for your blog.

Features :
  1. 5 column blogger
  2. Easy loading with elegant looks,
  3. Automatic slider Carousel for your recent post
  4. 1 right sidebar
  5. 3 columns footer
  6. Navigation drop down menu
  7. Grid and list style
  8. Pagination for blogger ready
  9. Clean design template, and many more.
Johny Joss Banget



Johny Ember



Johny Light Banget



And for cuztomisation this templates, visit this link for more detail :

Cuztomisation Template Blogger for Movie Review

Are you looking some templates for gallery content, especially for your template or theme collection? So you should go to visit this following link :

2 Templates Blogger for Gallery Theme

2 Templates Blogger for Gallery Theme

Hi, how are you today? I hope you get fine as like the days before. Are you looking some templates for gallery content, especially for your template or theme collection? I recomended these two beautiful templates that made for gallery theme purpose, but you can use it for any gallery content. This 2 templates design with the dark style color, black ones and the other is dark beautiful brown with wood ornament as I put in the background body, and feel free to use it, you don't even have to pay for this template. So, if you have interest to use this 2 gallery templates, check this out :

Martin Template

Martin Template was design in gallery style blogger template content, as I told you before you can use it for any gallery content. 



Features :
  1. 2/3 column blogger template with right sidebar
  2. Static navigation menu
  3. 3 column footer
  4. Gallery style blogger template
  5. Automatic content slider
  6. Ads ready 728 x 90 in header, and 648 x 60 above blog post
  7. Pagination for blogger ready
  8. Dropdown menu, clean design template, and many more.
This template designed for content gallery with daily updates, you can read this following post to see how to cuztomize this template :
Cuztomizing Martin Template Blogger

Collector Template

Collector Template is another free blogger template from Creating Website for gallery content with elegant dark brown style.



Features :
  1. Automatic image slider for your new post
  2. 3 column blogger template with right sidebar
  3. 4 column footer
  4. Gallery style blogger template
  5. Ads ready 468 x 60 in header, 300 x 250 in every post
  6. Pagination for blogger ready
  7. Dropdown menu, clean design template, and more. 
You can use this template for free, if you have any question about this template. Visit this link for more detail : Cuztomizing Collector Template Blogger.

That's all and hopefully useful

3 Simple Template Blogger with Elegant Style

Johny Classicsite



If you looking for a simple template blogger with SEO, I suggest you to considering this template. Johny Classicsite was a simple template with elegant classic style. There's no specific feature in this template. It's a white and grey color with 2 column blogger in there, easy loading and SEO friendly I think, 1 right sidebar, 3 columns footer, navigation menu, ads ready, clean design template, and more. This template suitable for all type of content blog especially for daily blogs, but you can use it for your site anything you like to. I hope you enjoy it and happy blogging.


Johny Sompret



Johny Sompret was a simple template with magazine style. There's no specific feature in this template. It's a white, blue and black color with 3 column blogger in there, easy loading with elegant style, 1 right sidebar, 3 columns footer, navigation menu, ads ready, pagination for blogger ready, clean design template, and more. This template suitable for all type of content blog especially for daily blogs, but you can use it for your site anything you like to. I hope you enjoy it and happy blogging.

Johny Jazzytube



Johny Jazzytube was made for video content only from Youtube. There's no specific feature in this template. It's a white, black and blue color with 4 column blogger in there, easy loading and SEO friendly with elegant looks, 1 right sidebar, 3 columns footer, navigation menu, ads ready, pagination for blogger ready, clean design template, and more. This template suitable for video content blog with daily updates only from Youtube. But you can use it for any gallery content for your blog. This is how to make a post in this template :
http://www.youtube.com/watch?v=K4Di2rvigVkendofvid

[starttext]
Your description here..........
[endtext]
You can grab URL from Youtube just like you see in this picture below, and you must closed with this code endofvid (with no space)


Or this picture


And the final result to make a post should be like in this picture :


For more detail how to use and installation this template, please visit this link.

And if you want to use this template in image gallery, you can download here

2 Elegant Templates Blogger for Online Store and Tube

Today I will share another template for online store, but in other template you can use it for your video online only for Youtube. This two templates design in a same color, with a black in basic and white. If you looking forward to your online store or video online for Youtube you can choose one of them.

Johny Crott Template (e-commerce blogger template)



Another template blogger for your online store from Creating Website. Names Johny Crott, magazine template that was made especially for online store. Design with magazine style blogger template with 4 column blogger template and 1 column siderbar in left, 3 column footer, shopping cart for e-commerce blogger with cart, automatic featured content slider, pagination for blogger ready, dropdown menu, tooltip image, clean design template, and more. This template designed for online store only with daily updates. For more detail visit this link to see how to manage this template

Johny Crottube (Video online blogger template)



Johny Crottube template is Johny Crott series that was made for video content only from Youtube. There's so many feature in this template. It's a white and black color with 5 column blogger in there, easy loading with elegant looks, 1 left sidebar in homepage and 1 right sidebar in post page, 3 columns footer, navigation drop down menu, grid and list style, pagination for blogger ready, clean design template, and more. This template suitable for video content blog with daily updates only from Youtube. But you can use it for any gallery images content for your blog. For more detail about how to installation and customize this template please visit this link.

Johny Blackstore, Blogger Template for your Online Store

I provide this template to your online store, easy to navigated all you have to do just read the instruction completly and you will see your online store work just as you seen in demo. I made this template with shopping cart features from wojodesign.com with Dollar in default currency, you can change with any Paypal currency such as Pounsterling, Euro etc.


Johny Blackstore template it was made especially for online store only. Design with magazine style blogger template with 4 column blogger template and one left sidebar, 3 column footer, shopping cart for blogger platform, automatic featured content slider, ads 728 x 90 px ready, pagination for blogger ready, dropdown menu, , zooming image, clean design template, and more. This template designed for online store only with daily updates. For more detail visit this link to see how to manage this template

2 Simple Templates Blogger for your site

Johny Simpleblog

This template has two basic colors, white and gray with a black background, easy loading and easy to navigated.

johny simpleblog


Johny Simpleblog was a simple template with classic style. There's no specific feature in this template. It's a white and grey color with 2 column blogger in there, easy loading and SEO friendly I think, 1 right sidebar, 3 columns footer, navigation drop down menu, ads ready, pagination for blogger ready, clean design template, and more. This template suitable for all type of content blog especially for daily blogs, but you can use it for your site anything you like to. I hope you enjoy it and happy blogging. For more detail visit this link, if you have any question about this template you can leave your message in that link.

Creating Website Template

creating website template


Ths template look like Maskolis used in his site. Free Creating Website blogger template is a blogger template with another style Creating Website template. It's a 3 column blogger template with 2 right sidebar, ads ready, there's no footer in this template, pagination for blogger ready, tabview ready, clean design template, and more. This template suitable for all type of blogs. You used it for any content for daily updates. For instruction how to use this template you can visit this link. Ask him how to navigated this template.

How to make an automatic Carousel slider based on labels?

In this tutorial I will discuss how to create automatic Carousel slider based on your labels in blogger. All you have to do only replace with your own label and the slider will work based on the label that you add in Edit HTML template. I made this carousel slider was very simple and only used jCarousellite script without adding easing effects or mousewheel.

carousel slider johny

  1. You must login to blogger with your account
  2. After that select the blog that you want to add slider.
  3. Go to the template >> Edit HTML and check the expand widget templates, don't forget to backup your template first.
  4. And then place this following codes above ]]></b:skin>:
    #carousel{width:950px;height:185px;margin-bottom:0px;position:relative;display:block}
    #carousel .container{position:absolute;left:49px;width:895px;height:185px;overflow:hidden;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyBQgJGtWtAV-hF9kbxSskaoIH_qjkctzE_8p1SnrrWVQ0lLHZ4c0YOZ2SfObjXIHTZxbRX46l3Xcm_u62lwv316iglHAITLxpJh6TqHvaCmGuxx0x0I-spbZRtMaIMulN0U1cSR_oSkE/s1600/scroller-bg.png) repeat center}
    #carousel #previous_button{position:absolute;width:49px;height:185px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSxw7CcEayRbhLYfsg8zrR3sD-6BvfDHhWWfjFTPA6rsVCeTkC-Oz-4xAATA3CuxAR2LBrt8vyB9CeAtQwhhDt1f8EEjcFOKT0FTYv5Hv_oKsgCJZQwz2LisztCOFZeC-fFtbiatNM8pA/s1600/prev.png) center;z-index:100;cursor:pointer;border-right:1px solid #ccc}
    #carousel #previous_button:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhz7jFrPwrRTTBURd6p0aT0j65cL7PIgcI9l_MqHXG_95lrfVyrfbDaQT6vHlH4W-lgJ1CiTmMhLtUUSoQN89scAT4xx_0Svl-MTnW5IKxPv-3qJvVBFvkcTgIdoFaOk0oeEF6GFOYavB4/s1600/prev.png) center}
    #carousel #next_button{position:absolute;right:0;width:49px;height:185px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-m6Al3nruDDburQ3pzIrPMLS_joKARz30MmPCtu90AqUEXlfn7R2eREuy0nVa6Bfpt6hCAeecZvAcI1HrFN6pfHBKYzTShMiibC62h1RvthG_5K8F2PBCyXE6hl-tPi3srLwo9t9ojh4/s1600/next.png) center;z-index:100;cursor:pointer;border-left:1px solid #ccc}
    #carousel #next_button:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZhy7YROxGFVgYD2-oajG38aKlIUhKXj6P8-cqm-ocunR_Vki0YZMPd8K50oNNqMtZ5sLw43WbPepdzN06rnf_vUM1Y_koGW4HiTOwpF-2a_YZbE7BwqPKTqqCVkst6n7bP8BZIcKviCM/s1600/next.png) center}
    #carousel ul{width:100000px;position:relative;margin-top:10px}
    #carousel ul li{background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZQZWTKRrvfCCwstCQuPuvN2O3ehXREwoxCriDgQ7UIBEDI4ryhSp5_zUHwNTwFM8cWdZ1HSSMcDoYwJJqtB7lECL-rLgH_ez1Ink6AdFP2HBr8MeS0oKAJbkOWxWZiU3iVk-UsYjSjbM/s1600/main.png) repeat-x top;display:inline;float:left;text-align:center;font-weight:700;font-size:.9em;line-height:1.2em;border:1px solid #ccc;width:145px;height:150px;margin:0 4px 20px 7px;padding:6px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}
    #carousel ul li:hover{filter:alpha(opacity=75);opacity:.75;}
    #carousel ul li a.slider_title{color:#222;display:block;margin-top:5px}
    #carousel ul li a.slider_title:hover{color:#cd1713}
    #carousel a img{display:block;background:#fff;margin-top:0}
    Look at some codes with the blue color above, that's the width and height of the slider in the demo that I made, change with your own size depend on your template width.
  5. Still in Edit HTML, add this following code above </head> :
    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
    <script src='https://masolis-javascript.googlecode.com/svn/trunk/carousellite.js' type='text/javascript'/>

    <script type='text/javascript'>
    //<![CDATA[
    imgr = new Array();
    imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvZQZYa5P-HbFDO15vH-FSaPDu_cJM_qktKzxdLfJ2pP2UrLaZtSYRVKHps2legq39qvkldUUqvF5dINojPuivPDppLyTYyu7sJ0JjLj4fnrXKsXufOquMZIN62h9qJ5ku6r_T3xb3R1s/s1600/no+image.jpg";
    showRandomImg = true;

    aBold = true;

    summaryPost = 140;
    summaryTitle = 25;

    numposts1 = 15;
    label1 = "news";

    function removeHtmlTag(strx,chop){
    var s = strx.split("<");
    for(var i=0;i<s.length;i++){
    if(s[i].indexOf(">")!=-1){
    s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
    }
    }

    s = s.join("");
    s = s.substring(0,chop-1);
    return s;
    }
    function showrecentposts(json) {
    j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
    img = new Array();
    document.write('<ul>');
    for (var i = 0; i < numposts1; i++) {
    var entry = json.feed.entry[i];
    var posttitle = entry.title.$t;
    var pcm;
    var posturl;
    if (i == json.feed.entry.length) break;
    for (var k = 0; k < entry.link.length; k++) {
    if (entry.link[k].rel == 'alternate') {
    posturl = entry.link[k].href;
    break;
    }
    }

    for (var k = 0; k < entry.link.length; k++) {
    if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') {
    pcm = entry.link[k].title.split(" ")[0];
    break;
    }
    }

    if ("content" in entry) {
    var postcontent = entry.content.$t;}
    else
    if ("summary" in entry) {
    var postcontent = entry.summary.$t;}
    else var postcontent = "";
    postdate = entry.published.$t;
    if(j>imgr.length-1) j=0;
    img[i] = imgr[j];
    s = postcontent ; a = s.indexOf("<img"); b = s.indexOf("src=\"",a); c = s.indexOf("\"",b+5); d = s.substr(b+5,c-b-5);
    if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")) img[i] = d;
    //cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';
    var month = [1,2,3,4,5,6,7,8,9,10,11,12];
    var month2 = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
    var day = postdate.split("-")[2].substring(0,2);
    var m = postdate.split("-")[1];
    var y = postdate.split("-")[0];
    for(var u2=0;u2<month.length;u2++){
    if(parseInt(m)==month[u2]) {
    m = month2[u2] ; break;
    }
    }

    var daystr = day+ ' ' + m + ' ' + y ;
    var trtd = '<li class="car"><div class="thumb"><a href="'+posturl+'"><img width="145" height="100" class="alignnone" src="'+img[i]+'"/></a></div><p><a class="slider_title" href="'+posturl+'">'+posttitle+'</a></p></li>';

    document.write(trtd);
    j++;
    }
    document.write('</ul>');
    }
    //]]>
    </script>
    Notes:
    See the red URL script above, that's the latest series jQuery.min.js script code that I use to made this slider. And if you've found jQuery.min.js although with the different series in your template, the red codes no longer need to insert. There must be only one jQuery.min.js in your template, it is up to the serial number, if possible the latest version.
    Blue code (15) : amount of your post that display in the slider. news was a label that I choose to show up in slider.
  6. Next step you must call the slider to appear in your blog. Place this following code above <div id='main-wrapper'>:
    <b:if cond='data:blog.pageType != &quot;item&quot;'>
    <div id='carousel'>
    <div id='previous_button'/>
    <div class='container'>
    <script>
    document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/&quot;+label1+&quot;?max-results=&quot;+numposts1+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
    </script>   
    <div class='clear'/>
    </div>
    <div id='next_button'/>
    </div>
    <script type='text/javascript'>
    (function($) {     $(document).ready(function(){
    $(&quot;#carousel .container&quot;).jCarouselLite({
        auto:4000,
        scroll: 1,
        speed: 800,   
        visible: 5,
        start: 0,
        circular: true,
        btnPrev: &quot;#previous_button&quot;,
        btnNext: &quot;#next_button&quot;
        });
        })})(jQuery)   
    </script>
    </b:if>
    You can also put the following codes in the bottom of your navigation menu or you can also placed in your footer side, that's depend on your needs.
  7. The final step, save templates and see the results.
+