Johny Darkgamer 2 Free Premium Blogger Template 2012

Johny Darkgamer 2  Blogger Template

Demo         Download

TEMPLATE FEATURES

Johny Darkgamer 2 is template blogger that design in magazine game style blogger. You can use this template for any content games. It's a 2/3 column blogger template with 1 right sidebar, static page ready, 3 column footer, magazine style blogspot template with black and green color, automatic slider carousel, ads ready, pagination for blogger ready, dropdown menu, clean design template, and more. This template designed especially for content games but you can use it for any content with daily updates

Template Name : Johny Darkgamer 2
Author : Maskolis

1. Slider Carousel
   
   To change the slider you only need to enter the code in the box below HTML / Javascript. On the dashboard go to the layout and then select the blank field under the header >> Add gadget >> HTML / Javascript:
   <script type="text/javascript">
   showPostDate_g = false;
   showComm_g = false;
   slideOpenNewTab = true;
   idMode = true;
   slidebyLabels = false;
   slideLabelName var = "label",
   pBlank = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieYWSRBn9pbIgX5ObwQCF8FkQT1YzuQSD9g0-p8fsG1yrne_5zu7fFuvh_V0AVaAtaEz4YNzmBfxyCRY3ezH3hvYMiUt5IyqZJqvPBWGqoAVJcrCukC9-en0PrQPfCwlwNcY4Zge8b6As/s1600/no+image.jpg",
   text = "comment",
   numposts_g = 12,
   numchars_g = 0,
   showText = "Show at",
   postText = "Posts",
   tinyprevNav = "<",
   tinynextNav = ">",
   home_page = "http://johnydarkmusic.blogspot.com /";
   </ Script>
   src="http://jamu-martin.googlecode.com/files/tinycarousel.js" <script type="text/javascript"> </ script>
   Replace URL with the blue color on your blog URL, then save.
2. Category with thumbnail (Category with thumbnail)
   
   It is located in the middle sidebar (a thumbnail), how to pair add gadget >> HTML / Javascript and enter the code below:
   <script type='text/javascript'> numposts var = 1; var showpostthumbnails = true; var displaymore = false; var displayseparator = false; var showcommentnum = false; var showpostdate = false; var showpostsummary = true; numchars var = 60; </ script>
   
   <script type="text/javascript" src="/feeds/posts/default/-/ jazz ?orderby=updated&alt=json-in-script&callback=labelthumbs"> </ script>
   
   <script type="text/javascript">
   recentpostslist function (json) {
   document.write ('<ul>');
   for (var i = 0; i <json.feed.entry.length; i + +)
   {
   for (var j = 0; j <json.feed.entry [i]. link.length; j + +) {
   if (json.feed.entry [i]. link [j]. rel == 'alternate') {
   break;
   }
   }
   entryUrl var = "'" + json.feed.entry [i]. link [j]. href + "'" ;/ / bs
   json.feed.entry entryTitle = var [i]. title. $ t;
   var item = "<li>" + "<a href="+ entryUrl +'" target="_blank"> 'entryTitle + +" </ a> </ li> ";
   document.write (item);
   }
   document.write ('</ ul>');
   }
   </ Script>
   <Script
   <a http://johnydarkmusic.blogspot.com /search/label/ jazz "11px style="float:right;font:normal Arial;padding:5px 0;"> More on this category» < / a>
   Description:
   Blue (jazz): is a label or category that is shown on the sidebar. You can replace it with a label you adjust as needed.
   The red color: Replace URL with the URL of your blog.
3. Latest Post
   
   To set the latest post on the homepage the way he is, in the blogger dashboard select settings, then click the posts and comments. At the very top (Show at most) choose how many posts you want displayed on the homepage. Then go to the Language and formatting, so you like the demo blog template is the Timestamp format select only the clock / time (00:00).
4. Feedburner box under the post
   Find the below script code in HTML editing (do not forget to check expand widget templates):
   
   <div class='subscribe'>
   <p class='intro'> If you enjoyed this article just <a href='http://feeds.feedburner.com/ JohnyTemplate 'target='_blank' title='feedburner'>
   <b> click here </ b> </ a>, or subscribe to receive more great content just like it. </ p>
   <p class='feed'> <a href=' http://johnytemplate.blogspot.com /feeds/posts/default'> Subscribe via RSS Feed </ a> </ p>
   <Form action = 'http://feedburner.google.com/fb/a/mailverify' method = 'post' onsubmit = "window.open ('http://feedburner.google.com/fb/a/mailverify ? uri = JohnyTemplate ',' popupwindow ',' scrollbars = yes, width = 550, height = 520 '); return true' target = 'popupwindow'>
   <input name='uri' type='hidden' value=' JohnyTemplate'/>
   <input name='loc' type='hidden' value='en_US'/>
   <Input id = 'botsub' name = 'email' onblur = "if (this.value ==" ") {this.value = 'Enter your email";}' onfocus = "if (this.value = = "Enter your email ') {this.value =" ";}' type = 'text' value = 'Enter your email ...." />
   <input id='botsubbutton' type='submit' value='Submit'/> <br/>
   <small> Your information will not be shared. Ever. </ Small>
   </ Form>
   </ Div>
   Description:
   The blue color: replace with your feed address.
   The red color: replace with your URL.
   Also replace the feed URL to your feed URL http://feeds.feedburner.com/blogspot/htbgh.
5. Headline News (Below the navigation menu above or a news ticker)
   
   To replace the dashboard select a template and then click Edit HTML do not forget to check expand widget templates then search by using control + F http://johnydarkmusic.blogspot.com replace URL with the URL of your blog.

Read more »

Johny Gallery Free Premium Blogger Template 2012

Johny Gallery Free Premium Blogger Template

Demo    Download

TEMPLATE FEATURES:
Gallery Johny is another free blogger template from Creating Website with elegant white and blue style for gallery content. This template design with an automatic image slider category, 3/4 column blogger template with right sidebar, 4 column footer, magazine white gallery for template and theme, ads ready, pagination for blogger ready, dropdown menu, clean design template, and more. But you can used this template for any content just as like you wanted blog with daily updates

Template Name : Gallery Johny
Author : Maskolis

The second template of the trilogy is my template named Johny Johny Gallery, as the name suggests this template for a blog that contains the template and theme gallery. This template is also no feature static page (static page), there are no special features contained on this template to note is the way in creating a post that as shown in the demo blog.

1. To make sure you are in a position to post HTML (not compose). Below is an example in creating a post on this template Johny Gallery:
   
   <div align="center">
   </ Div>
   <div class="badge sblogger">
   </ Div>
   <Img class = "latest_img" height = "250" width = "310" />
   <div class="fullpost">
   <ul class="postbuttons">
   class="livedemo" <a href=" http://johny-darkmovie.blogspot.com/ "rel="nofollow" target="_blank"> Live Demo </ a> </ li>
   class="download" <a href=" http://www.box.com/s/qjhv758fzmne8lt3xpa8 "rel="nofollow" target="_blank"> Download Theme </ a> </ li>
   </ Ul>
   </ Div>
   <b> TEMPLATE FEATURES </ b>
   Please fill up your description of the template or .........
   Note the script code that I gave above colors:
   
   The green color: the URL of an image that should be changed. After you upload the image enter the image URL in the code that colored green.
   The blue color: the demo blog URL
   The color red: URL for download
2. Menenampilkan widget to share and subscribe to exist in the upper right sidebar, enter the following code in the box HTML / Javascript:
   <style type="text/css">. maskolis {width: 288px; float: left; margin: 0 0 2px; padding: 0 5px;}
   . Maskolis. Count {margin: 0px; padding: 0px 0px 10px 0;}
   . Maskolis. Subicons {background: url (https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBLfZDmJwEuvtnkObvDUxabx0_YX2QaAVuAYT3hr9lkO89NlJeKkkNDscJMIKqiBheF95OSUEAFJWthYq_4_6299h87jvDZsIlsgJoleo4gW2n05OFrR-4TG9ONOrvT13Xo7rNT3hUyXKR/s1600/batas.png) repeat-x scroll bottom; margin: 0px 0 0px 0; float: left; width: 288px; font-family: Helvetica, Arial; font-size: 12px;}. maskolis. subicons a {text-decoration: none; color: # 333333;}. maskolis. subicons a: hover {text -decoration: underline; color: # 333333;}. maskolis. subicons no-repeat; background-position: 0px 5px; min-width: 2px; height: 48px; line-height: 57px; vertical-align: middle; float: left; padding: 0px 10px 28px 0px; margin: 5px 0 0 0 ;}. maskolis. subicons no-repeat; background-position: 0px-37px; min-width: 2px; height: 48px; line-height: 57px; vertical-align: middle; float: left; padding: 0px 10px 28px 0px; margin: 0 0 0 5px;}. maskolis. subicons no-repeat; background-position: 0px-79px; min-width: 20px; height: 48px; line-height: 57px; vertical-align: middle; float: left; padding: 0px 10px 28px 0px; margin: 0 0 0 5px;}. maskolis. subicons no-repeat; background-position: 0px-121px; min-width: 20px; height: 48px; line-height: 57px; vertical-align: middle; float: left; padding: 0px 28px 0px 7px; margin: 0 0 0 5px;}. maskolis. emailsub {border-bottom: 0px solid # e6e6e6; padding: 15px 0 0 0px; float: left; width: 100%; font-family: Helvetica, Arial;}. maskolis. emailsub. emailicon {background : url (http://www.fordfarmhouse.com/images/email.png) no-repeat 0 2px; float: left; padding: 0px 20px 50px 0px; margin: 0 5px; width: 288px; line-height: 20px ; vertical-align: middle; font-size: 14px; color: # 333;}. maskolis. emailsub. emailupdatesform {margin: 15px 5px 5px 5px; width: 288px; float: left;}. maskolis. emailsub. emailupdatesform input. emailupdatesinput {background: # fff! important; float: left; border: 1px solid # afafaf; padding: 0px 8px 0px . Emailsub. Emailupdatesform input.joinemailupdates {/ * linear-gradient * / background:-webkit-gradient (linear, left top, left bottom, color-stop (# b4c5fa, 0), color-stop (# 0f46fa, 1)) ; background:-webkit-linear-gradient (top, # b4c5fa 0%, # 0f46fa 100%); background:-moz-linear-gradient (top, # b4c5fa 0%, # 0f46fa 100%); background:-o- linear-gradient (top, # b4c5fa 0%, # 0f46fa 100%); background: linear-gradient (top, # b4c5fa 0%, # 0f46fa 100%); background:-webkit-gradient (linear, left top, left bottom , from (# 567dfc), to (# 0f46fa)); border: 1px solid # 1143a8; text-transform: none; font: bold 12px arial; color: # fff; height: 25px; padding: 0 12px 0 12px; margin : 0 0 0 class = "maskolis"> <div class="subicons"> <div class="rssicon"> <a rel = "nofollow" href = "http://feeds.feedburner.com/ Maskolis" target = "_blank "> RSS </ a> </ div> class="googleicon"> <a href =" ID https://plus.google.com/u/0/ GOOGLE + "rel =" author "target = "_blank"> + G </ a> </ div> class="fbicon"> <a href = "URL https://www.facebook.com/ Facebook" target = "_blank" rel = " nofollow "> FB </ a> </ div> class="twittericon"> <a href =" https://www.twitter.com/ TWITTER USERNAME "target =" _blank "rel =" nofollow " > Twitter </ a> </ div> </ div> <div class="emailsub"> class="emailicon"> <p style = "width: 250px; color: # 3A3A3A; font-size: 13px; font-weight: normal; font-family: Helvetica, Arial; padding-right: 5px; margin: 0; "> If you enjoyed this article subscribe to receive more great content from us </ p> </ div> <div class = "emailupdatesform"> <form action = "http://feedburner.google.com/fb/a/mailverify" method = "post" target = "popupwindow" onsubmit = "window.open ('http://feedburner. google.com / fb / a / mailverify? uri = Maskolis', 'popupwindow', 'scrollbars = yes, width = 550, height = 520'); return true "> <input gtbfieldid =" 10 "class =" emailupdatesinput " name = "email" value = "Enter your email here ..." onblur = "if (this.value =='') {this.value = 'Enter your email here ...';}" onfocus = "if (this.value == 'Enter your email here ...') {this.value ='';} "type =" text "/> <input value =" Maskolis "name = "uri" type = "hidden" /> <input value="Submit" class="joinemailupdates" type="submit" /> </ form> <div class="count"> <a rel = "nofollow" href = "http://feeds.feedburner.com/ Maskolis"> <img style = "border: 0" alt = "" src = "http://feeds.feedburner.com/% 7Efc / Maskolis? bg & fg = aeaeae = 000 & anim = 1 "height =" 26 "width =" 88 "/> </ a> </ div> </ div> </ div> </ div>
   Description:
   
   I am writing in bold print you please replace with your ID and username.
   Red writing (Maskolis) demo blog is feedburner ID, ​​replace with your feedburner ID.
3. To make popular post as the demo, go to layout >> add the gadget and select popular posts. Here you have to check only the thumbnail, leave blank snippet.

Read more »

Johny Papers Magazine Free Premium Blogger Template 2012

Johny Papers Magazine  Free Premium Blogger Template

Demo     Download

TEMPLATE FEATURES:
Free Johny Papers Magazine 2 blogger template is magazine style blogger template for portal and news blog with auto recent per category. It's a 2/3 column blogger template with right sidebar, 3 column footer, magazine style blogspot template, featured content slider, tab view menu, ads ready, pagination for blogger ready, dropdown menu, clean design template, and more. This template designed for portal news blog with daily updates

Template Name : Johny Papers Magazine
Author : Maskolis

This my first template design, especially for blogs that have content for news, and like my other magazine template there is no static features of a static page or pages. The assembly of existing widgets in the template are:

1. Latest Post
   
   Located on the left, this feature automatically, meaning that if you make a new post then the article will appear automatically on the latest post. Setting that as in the demo template as follows (new blogger interface):
   On the dashboard select settings and then click the formatting and language then the timestamp format select only an hour, because the width of the timestamp on my latest post for setting the clock (see demo). To set the number of posts to be displayed is the setting, select the post and comment >> show at most select how many posts are shown in columns latest post.
2. Slider
   To change the image on the slider, locate the following code:
   

    numposts1 = 7;
    label1 = "health"; 

   Description:
   
   Number 7 is the number of the image displayed on the slider, you can replace it according to your taste. Health is a label or category that is displayed on the slider, please change the label you want displayed on the slider (Remember the letter must be the same as the label you have created).
3. Label 1, label 2 and label 3
   It lies under the banner 468 x 69 and follow twitter. To display the widget enter the following code to add the gadget layout >> select HTML / Javasxript:
   
   <script type='text/javascript'> numposts var = 1; var showpostthumbnails = true; var displaymore = false; var displayseparator = false; var showcommentnum = false; var showpostdate = false; var showpostsummary = true; numchars var = 60; </ script>
   
   <script type="text/javascript" src="/feeds/posts/default/-/ ?orderby=updated&alt=json-in-script&callback=labelthumbs"> news </ script>
   
   <script type="text/javascript">
   recentpostslist function (json) {
   document.write ('<ul>');
   for (var i = 0; i <json.feed.entry.length; i + +)
   {
   for (var j = 0; j <json.feed.entry [i]. link.length; j + +) {
   if (json.feed.entry [i]. link [j]. rel == 'alternate') {
   break;
   }
   }
   entryUrl var = "'" + json.feed.entry [i]. link [j]. href + "'" ;/ / bs
   json.feed.entry entryTitle = var [i]. title. $ t;
   var item = "<li>" + "<a href="+ entryUrl +'" target="_blank"> 'entryTitle + +" </ a> </ li> ";
   document.write (item);
   }
   document.write ('</ ul>');
   }
   </ Script>
   <Script
   <a http://johnyportal2.blogspot.com /search/label/ news "11px style="float:right;font:normal Arial;padding:5px 0;"> More on this category» < / a>
   Description:
   
   The blue color: the labels or categories displayed in the widget. You can replace it with a label you adjust as needed.
   The red color: Replace URL with the URL of your blog.
4. Label 4 and label 5
   Enter the code below:
   
   <script type="text/javascript">
   var numposts = 4; var showpostthumbnails = true; var displaymore = false; var displayseparator = false; var showcommentnum = false; var showpostdate = false; var showpostsummary = true; var numchars = 100;
   </ Script>
   About src="/feeds/posts/default/-/ paced <script type="text/javascript"> ?orderby=updated&alt=json-in-script&callback=labelthumbs"
   </ Script>
   <a http://test-maskolis.blogspot.com /search/label/serba serbi" style="float:right;font:normal Arial;padding:5px 10px 0;"> More on this category </ a>
   The red color: the labels or categories displayed in the widget. You can replace it with a label you adjust as needed.
   The blue color: Replace URL with the URL of your blog.
5. Tab view menu
   
   Located on the upper right sidebar, you just want to make 4 widget will be automatically installed tabber sidebar, I recommend to be given the title of the widget.
6. Twitter Widget
   
   To create a twitter widget like the demo enter the code in the box below HTML / Javascript:
   <Div style = "background: # fff url (https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgR9HRrV4zkZxqH8joopKSf2px5wOZ5PEjZ-_aPoC8tQOCCSN9RTWemEIFtKAxVM9Io1zVmwaw61J67weYXjrhFhegtrlDLwGi7MRz7s3pUm3PmCPRIPphbGZOhcwFWzMr-791V9Yf7fReg/s1600/tweet.png) no-repeat; padding-top: 45px; padding- left: 8px ">
   <script src="http://widgets.twimg.com/j/2/widget.js"> </ script>
   <script>
   TWTR.Widget new ({
   version: 2,
   type: 'profile',
   Draft: 10,
   interval: 3000,
   width: 285,
   height: 123,
   theme: {
   shell: {
   background: 'transparent',
   color: '# 000000'
   },
   tweets: {
   background: 'transparent',
   color: '# 000000',
   links: '# 135a9e'
   }
   },
   features: {
   scrollbar: false,
   loop: true,
   live: true,
   hashtags: true,
   timestamp: true,
   avatars: true,
   behavior: 'default'
   }
   }). Render (). SetUser ('maskolis'). Start ();
   </ Script>
   </ Div>
   Replace maskolis with your twitter username.
7. To replace existing ads or adsense under post in addition to related articles on the Edit HTML (check expand widget templates) Find the following code:
   <div id="banner-ads">
   

   <script type='text/javascript'> <! -

   google_ad_client = "ca-pub-9608487840337104";

   google_ad_host = "pub-1556223355139109";

   / * Johny side * /

   google_ad_slot = "1127342458";

   google_ad_width = 300;

   google_ad_height = 250;

   / / ->

   </ Script>

   <script type='text/javascript'> src='http://pagead2.googlesyndication.com/pagead/show_ads.js'

   </ Script>
   Change the color code blue on the script code of your ads.

Read more »

Johny Soulmater Free Premium Blogger Template 2012

Johny Soulmater  Free Premium Blogger Template

Demo     Download

TEMPLATE FEATURES:
Johny Soulmater is another free blogger template with elegant style. It's a 2 column blogger template with tab view menu, 1 right sidebar, 3 columns footer, 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

Template Name : Johny Soulmater
Author : Maskolis

The third template is very simple, which is on the right sidebar is almost equal to J ohny Papers Magazine. In the sidebar tabber You just enter the 4 widget on the sidebar. Twitter widget to install the same way with the template above Johny Papers Magazine. Meanwhile, to replace feedburner located under the post, look below script code in HTML editing (do not forget to check expand widget templates):

<div class='subscribe'>
<p class='intro'> If you enjoyed this article just <a href='http://feeds.feedburner.com/ JohnyTemplate 'target='_blank' title='feedburner'>
<b> click here </ b> </ a>, or subscribe to receive more great content just like it. </ p>
<p class='feed'> <a href=' http://johnytemplate.blogspot.com /feeds/posts/default'> Subscribe via RSS Feed </ a> </ p>
<Form action = 'http://feedburner.google.com/fb/a/mailverify' method = 'post' onsubmit = "window.open ('http://feedburner.google.com/fb/a/mailverify ? uri = JohnyTemplate ',' popupwindow ',' scrollbars = yes, width = 550, height = 520 '); return true' target = 'popupwindow'>
<input name='uri' type='hidden' value=' JohnyTemplate'/>
<input name='loc' type='hidden' value='en_US'/>
<Input id = 'botsub' name = 'email' onblur = "if (this.value ==" ") {this.value = 'Enter your email";}' onfocus = "if (this.value = = "Enter your email ') {this.value =" ";}' type = 'text' value = 'Enter your email ...." />
<input id='botsubbutton' type='submit' value='Submit'/> <br/>
<small> Your information will not be shared. Ever. </ Small>
</ Form>
</ Div> 
Description:
The blue color: replace with your feed address.
The red color: replace with your URL.

That was three templates that I share today, if there are less obvious in the installation of the widget please leave your message in the comment box below. Good luck and hopefully useful, sorry if the templates were less pleased because my ability to make that much different from the same template are still masters of other bloggers who've champ .... hehehehehehe

Read more »

Mas Paper Free Premium Blogger Template 2012

Mas Paper Blogger Template

Demo        Download

TEMPLATE FEATURES:

Mas Paper is a free blogger template with magazine style blogger template for portal news blog with auto recent per category. This template comes with an automatic image slider feature, 2/3 column blogger template with right sidebar, 3 column footer, magazine style blogspot template, featured content slider, accordion style, ads ready, pagination for blogger ready, dropdown menu, newsticker ready, clean design template, and more. This template designed for portal news blog with daily updates

Template Name : Mas Paper
Author : Maskolis

actually template pesenan ni my friend, but because he prefers to use this template wordpress would idle. Well than do not share my mending kepakai HERE, please for anyone who likes to be worn. This template is only a modification of the template Johny 2 Simple Magazine , on the slidernya I replace the automatic slider and sidebar wear my accordion instead of the tab view menu. The rest was just there at least an additional 3 columns below the sidebar in the first banner ads and additional social bookmark widget from Mashable.

I share these templates because there are some friends who want to use this template Mas Paper. Instead I sent the script one by one via email mending wrote'll be posting all can use. I'm confused about what the name given to this template, it's up to you what was not given a name, if I love the name of Mas Paper should not have to protest it.

The features on this template include:

1. Banner above (above the header)
   
   <head> Code located below the template, please replace with your banner or if you do not like to erase.
2. News Headlines
   
   To change the headlines from your blog, you just change the URL, because it seems now google API key is closed, or read more here .
3. Automatic Slider.
   To change the slider you find this code:
   

   numposts1 = 5;
    label1 = "mysteries"; 

   Description:
   
   Number 5 is the image displayed on the slider, you can replace it according to your taste. Mystery is a label or category that is displayed on the slider, you can also change them as needed More can be read here .
4. Sidebar top center
   How to install the add gadget >> HTML / Javascript and enter the code below:                      <script type='text/javascript'> numposts var = 1; var showpostthumbnails = true; var displaymore = false; var displayseparator = false; var showcommentnum = false; var showpostdate = false; var showpostsummary = true; numchars var = 60; </ script> <script type = "text / javascript" recentpostslist <script type="text/javascript"> function (json) {document.write ('<ul>'); for (var i = 0; i <json.feed.entry.length; i + +) {for (var j = 0; j <json.feed.entry [i]. link.length; j + +) {if (json.feed.entry [i]. link [j]. rel == 'alternate') {break;}} entryUrl var = "'" + json.feed.entry [i]. link [j]. href + "'" ;/ / bs = json.feed.entry entryTitle var [i]. title. $ t; var item = "<li>" + "<a href="+ entryUrl +'" target="_blank"> 'entryTitle + +" </ a> </ li> "; document.write (item);} document.write ( '</ ul>');} </ script> <script <a http://crottt.blogspot.com /search/label/ mystery "11px style="float:right;font:normal Arial;padding:5px 0;"> More on this category» < / a>     
Description: color blue: the labels or categories are displayed in the sidebar. You can replace it with a label you adjust as needed. The red color: Replace URL with the URL of your blog.
5. Banner ads on the sidebar
   
   There are two banner ads are the first under the content, and the other below the 3 rows of the sidebar on the second line. Please fill in your ad, and also can be replaced with the image twitter twitter from your own.
6. For the second sidebar above footer as in the tutorial how to install Johny Magazine Widget Templates . For those who forgot please read again
7. To view the menu tab on the right sidebar, you just make the top four will automatically become the widget and tab view menu. For more details read the tutorial here .
8. If you want to add Mashable widget, place the following code in the box HTML / javascript:  <style>
   / * Social Widget * /
   # MBT-mashable-bar {
   border: 0;
   margin-bottom: 10px;
   margin: 0 auto;
   width: 300px;
   }
   . Fb-likebox {
   background: # fff;
   padding: 0;
   margin-top: 0px;
   height: 290px;
   }
   . Googleplus {
   background: # F5FCFE;
   border-top: 0px solid # FFF;
   border-bottom: 1px solid # CCC;
   border-right: 1px solid # D8E6EB;
   border-left: 1px solid # D8E6EB;
   border-image: initial;
   font-size: .90 em;
   font-family: "Arial", "Helvetica", sans-serif;
   color: # 000;
   padding: 9px 11px;
   line-height: 1px;}
   . Googleplus span {
   color: # 000;
   font-size: 11px;
   position: absolute;
   display: inline-block;
   margin: 9px 70px;}
   . G-plusone {float: left;}
   . Twitter {
   background: # EEF9FD;
   padding: 10px;
   border: 1px solid # C7DBE2;
   border-top: 0;}
   # Mashable {
   background: # CCC;
   border: 1px solid # CCC;
   border-top: 1px solid white;
   padding: 2px 8px 2px 3px;
   text-align: right;
   border-image: initial;}
   # Mashable. Author-credit {}
   # Mashable. Author-credit a {
   font-size: 10px;
   font-weight: bold;
   text-shadow: 1px 1px white;
   color: # 1E598E;
   text-decoration: none;}
   # Email-news-subscribe. Email-box {
   padding: 10px 5px;
   font-family: "Arial", "Helvetica", sans-serif;
   border-top: 0;
   border-right: 1px solid # C7DBE2;
   border-left: 1px solid # C7DBE2;
   border-image: initial;
   height: 35px;}
   # Email-news-subscribe. Email-box input.email {
   background: # FFFFFF;
   border: 1px solid # dedede;
   color: # 999;
   padding: 8px 10px 10px 7px;
   -Moz-border-radius: 3px;
   -Webkit-border-radius: 3px;
   -O-border-radius: 3px;
   -Ms-border-radius: 3px;
   -KHTML-border-radius: 3px;
   border-radius: 3px;
   border-image: initial;
   font-family: "Arial", "Helvetica", sans-serif;}
   # Email-news-subscribe. Email-box input.email: focus {color: # 333}
   # Email-news-subscribe. Email-box input.subscribe {
   background:-moz-linear-gradient (top center, FFCA00 # 0, # FF9B00 100%);
   background:-webkit-gradient (linear, left top, left bottom, color-stop (0, # FFCA00), color-stop (1, # FF9B00));
   background:-moz-linear-gradient (top center, FFCA00 # 0, # FF9B00 100%);
   -Pie-background: linear-gradient (270deg, ffca00 #, # ff9b00);
   font-family: "Arial", "Helvetica", sans-serif;
   border-radius: 3px;
   -Moz-border-radius: 3px;
   -Webkit-border-radius: 3px;
   border: 1px solid # cc7c00;
   color: white;
   text-shadow: 0 1px 1px # d08d00;
   padding: 14px 7px;
   margin-left: 3px;
   font-weight: bold;
   font-size: 12px;
   cursor: pointer;
   border-image: initial;}
   # Email-news-subscribe. Email-box input.subscribe: hover {
   background: # ff9b00;
   background-image:-moz-linear-gradient (top, # ffda4d, # ff9b00);
   background-image:-webkit-gradient (linear, left top, left bottom, from (# ffda4d), to (# ff9b00));
   filter: progid: DXImageTransform.Microsoft.Gradient (startColorStr = # ffffff, endColorStr = # CCC);
   outline: 0;-moz-box-shadow: 0 0 3px # 999;
   -Webkit-box-shadow: 0 0 3px # 999;
   box-shadow: 0 0 3px # 999
   background:-webkit-gradient (linear, left top, left bottom, color-stop (0, # ffda4d), color-stop (1, # ff9b00));
   background:-moz-linear-gradient (top center, ffda4d # 0, # ff9b00 100%);
   -Pie-background: linear-gradient (270deg, ffda4d #, # ff9b00);
   border-radius: 3px;
   -Moz-border-radius: 3px;
   -Webkit-border-radius: 3px;
   border: 1px solid # cc7c00;
   color: # FFFFFF;
   text-shadow: 1px 1px # d08d00 0}
   # Other-social-bar {
   background-color: # D8E6EB;
   box-shadow: 0 1px 1px inset # FFFFFF;
   padding: 0px;
   font-family: "Arial", "Helvetica", sans-serif;
   font-weight: bold;
   overflow: hidden;
   border: 1px solid # B6D0DA;
   height: 37px;
   }
   # Other-social-bar ul {list-style: none outside none; padding-left: 4px;}
   # Other-social-bar. Other-follow {
   float: left;
   color: # 1E598E;
   overflow: hidden;
   height: 20px;
   padding: 5px;
   width: 270px;}
   # Other-social-bar. Other-follow ul {
   list-style: none none outside;
   padding-left: 4px;}
   # Other-social-bar. Other-follow ul li {
   font-size: 12px;
   font-weight: bold;
   display: inline;
   border: 0;
   text-shadow: 1px 1px white;}
   # Other-social-bar. Other-follow ul li a {
   font-size: 12px;
   color: # 1E598E;
   font-weight: bold;
   display: inline;
   text-shadow: 1px 1px white;}
   # Other-social-bar. Other follow-li {
   font-size: 12px;
   font-weight: bold;
   display: inline;
   border: 0;
   text-shadow: 1px 1px white;}
   # Other-social-bar. Other follow-li a {
   font-size: 12px;
   color: # 1E598E;
   font-weight: bold;
   display: inline;
   text-shadow: 1px 1px white;}
   # Other-social-bar. Other-li.my follow-rss {
   background: url ('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_wcIQkuTUIdSC_6NvuSZzwOpNEZeHQjssxPsE9MgsqJHfQjh4EFew1dtYjJD2n83InXM42CWKIGL2tCklPXIMDl-lYgO28SYHAUd6urmV8mpWswIFP-eRAjlgELy6ih7cL1jfw8TYZpA/s400/rss-16x16.png') no-repeat transparent;
   line-height: 1;
   padding: 1px 3px 0px 20px;
   width: 60px;
   margin-bottom: 0px;
   margin-left: 5px;}
   # Other-social-bar. Other li.my follow-rss-a, # other-social-bar. Other li.my follow-linkedin-a, # other-social-bar. Other-li.my follow-gplus a {
   text-decoration: none;
   }
   # Other-social-bar. Other-li.my follow-rss a: hover, # other-social-bar. Other follow-linkedin li.my a: hover, # other-social-bar. Other follow-li. my-gplus a: hover {
   text-decoration: underline;
   }
   # Other-social-bar. Other li.my follow-linkedin-{
   background: transparent no-repeat;
   line-height: 1;
   padding: 1px 3px 0px 20px;
   width: 60px;
   margin-bottom: 0px;}
   # Other-social-bar. Other-li.my follow-gplus {
   background: url (https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjz96xU5nHOSVhCFs1uxxEa33aWtF7YMJzBFG2-WzWESbDEpSRoY8DxN55CyltfbDfdfPVclpspCI9_3osAAABdITUjZXVJvpZA56_NnhjWrNKQeiDivpt277wehAvlKbzwyo5KDzCWVDo/s400/gplus-16x16.png) no-repeat transparent;
   line-height: 1;
   width: 60px;
   padding: 1px 3px 0px 20px;
   margin-bottom: 0px;}
   </ Style>
   
   <! - [If IE]>
   <style>
   # Email-news-subscribe. Email-box input.subscribe {
   background: # FFCA00;
   }
   </ Style>
   <! [Endif] ->
   
   <! - Begin of social widget -> <div style="margin-bottom:10px;"> <div id="MBT-mashable-bar"> <! - Begin Widget -> <div class = " fb-likebox "> <iframe scrolling = "no" frameborder = "0" style = "border: none; overflow: hidden; width: 300px; height: 292px;" allowtransparency = "true"> </ iframe> </ div> <div class = "googleplus "> <! - Google -> <span> Recommend us on Google! </ span> <div class="g-plusone" data-size="medium"> </ div> <script type =" text / javascript "src =" https://apis.google.com/js/plusone.js "> </ script> </ div> class="twitter"> <! - Twitter -> <iframe title = "" style = "width: 300px; height: 20px;" class = "twitter-follow-button" src = "http://platform.twitter.com/widgets/follow_button.html # _ = 1319978796351 &
   align = & button = blue & id = twitter_tweet_button_0 &
   lang = en & link_color = & screen_name = maskolis & show_count = &
   show_screen_name = & text_color = "frameborder =" 0 "scrolling =" no "> </ iframe> </ div> id="email-news-subscribe"> <! - Subscribe Email -> <div class = "mail-box">
   <Form action = "http://feedburner.google.com/fb/a/mailverify" method = "post" target = "popupwindow" onsubmit = "window.open ('http://feedburner.google.com/fb / a / mailverify? uri = FEEDBURNER_URL ',' popupwindow ',' scrollbars = yes, width = 550, height = 520 '); return true ">
   <Input class = "email" type = "text" style = "width: 150px; font-size: 12px;" id = "email" name = "email" value = "Enter Your Email here .." onfocus = "if (this.value == this.defaultValue) this.value ='';" onblur = "if (this.value =='') this.value = this.defaultValue; "/>
   <input type="hidden" value="FEEDBURNER_URL" name="uri" />
   <input type="hidden" name="loc" value="en_US" />
   <input type="submit" class="subscribe" name="commit" value="Subscribe" />
   </ Form>
   </ Div> </ div> id="other-social-bar"> <! - Other Social Bar -> <ul class="other-follow"> <li class="my-rss"> <a rel="nofollow" title="RSS" href="http://feeds.feedburner.com/tntbystc" target="_blank"> RSS Feed </ a> </ li> <li class = "my- linkedin "> <a rel="nofollow" title="linkedin" rel="author" href="LINKEDIN PROFILE LINK" target="_blank"> linkedin </ a> </ li> <li class =" my-gplus "> <a rel="nofollow" title="Google Plus" rel="author" href="http://plus.google.com/44448117245314564536" target="_blank"> Google Plus </ a> </ li > </ ul> </ div> <div id = "mashable" style = "background: # CCC; border: 1px solid # CCC; border-top: 1px solid white; padding: 1px 1px 3px 8px; text-align: right; border-image: initial; font-size: 10px; font-family: "arial", "helvetica", sans-serif; "> <span class =" author-credit "style =" font-family: Arial, Helvetica, sans-serif; "> <a href="http://creatingwebsite-maskolis.blogspot.com/" target="_blank"> Creating Website» </ a> </ span> </ div> </ div >
   <! - End Widget -> </ div> <! - End of social widget ->

Again this is not what it is, seems to have all, as well as the template Johny Simple Magazine 2 , no features of this template static page (static page) because the script summary and my thumb removed so as not to aggravate the loading blog. Below is the link to see the demo and download link for those of you who are interested to try to use this template. Good luck and hopefully useful.

Upates:

Because the google code repository is in trouble tabber menu in sidebar does not work, you are looking to fix and replace the following code in the HTML edit position:

<script src='http://creatingwebsite.googlecode.com/files/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
starttab var = 0;
var endtab = 3;
sidebarname var = "sidebar";
</ Script>
<script src='http://creatingwebsite.googlecode.com/files/tabber.js' type='text/javascript'/>

Replace the code below:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
starttab var = 0;
var endtab = 3;
sidebarname var = "sidebar";
</ Script>
<script src='http://johnytemplate.googlecode.com/files/tabber.js' type='text/javascript'/>

And if the headline news could not walk, to overcome this you must change the following code in HTML editing position, then find the code below:

<script src='http://maskolis.googlecode.com/files/ticker.js' type='text/javascript'/>

and you replace with the following code:

<script src='http://johnytemplate.googlecode.com/files/newsticker.js' type='text/javascript'/>

If it does not appear again slidernya replace this code:

<script src='http://creatingwebsite.googlecode.com/files/contentslider.js'/>

with the following code:

<script src='http://dl.dropbox.com/u/12924430/contentslider.js'/>

Last save templates.

Read more »