Johny DemoSite
Love this
41
About this template
- Date Released: Feb, 2013
- Designer: Mas Template
- Price: FREE
License
- Creative Commons Attribution: You are free to use for personal/commercial use. But, you must attribute the work to the author. Should not remove credit links.
Statistics
- Downloads: 7205
- Demo views: 10713
- 41 people love this template
Shortlist this Blogger template
Lovely Template Editor's Choice award winning template
Design Features
- Responsive design
- Designed to provide optimal viewing experience across wide range of devices from Desktop to mobile phones
- Post Thumbnails
- Show a thumbnail image (small image) for every post using this template
- Hierarchical Menu
- Johny DemoSite template comes with hierarchical dropdown navigation menu.
- Custom web fonts
- Johny DemoSite template uses Web fonts like Google Fonts. Improve your website typography by using custom fonts
Customization Features
- HTML Menu
- Navigation menu for this template is customizable in HTML. Edit the HTML to add your menu links
- Widget Ready
- Johny DemoSite template comes with many widgetized area. Add your widgets easily using this template
- Footer Widgets
- Johny DemoSite template comes with footer widgets. Use your footer area effectively for engaging your users
More Features
- SEO Ready
- Johny DemoSite template is optimized for Search engines like Google. This template helps your website to rank higher in search engines
- Related Posts
- Johny DemoSite template shows related posts in the bottom of every post. This improves user engagement of your site
- Ad Ready
- Use this template to show Banner advertisement or Google ads easily. Make money using your site
- Social Buttons
- This template comes with social buttons like facebook, twitter etc., Let your users share your content easily
- Search box
- Johny DemoSite template has search box in it. Search box helps your user to find the content easily on your site
Open this template file (Johny Demosite.xml) in a text editor like Notepad or Notepad++ and do the following modifications.
Dropdown Navigation Menu
Find the following code in the template file. Update the href value and Menu text to your needs. This will be dropdown navigation menu for your site.
<ul class='sf-menu'> <li><a href='/'>Home</a></li> <li><a href='#'>Menu 1</a></li> <li><a href='#'>Drop Menu 1</a> <ul> <li><a href='#'>Sub Menu 1</a></li> <li><a href='#'>Sub Menu 2</a></li> <li><a href='#'>Sub Drop Menu 3</a> <ul> <li><a href='#'>Sub Drop Menu 3.1</a></li> <li><a href='#'>Sub Drop Menu 3.2</a></li> </ul> </li> </ul> </li> <li><a href='#'>Drop Menu 2</a> <ul> <li><a href='#'>Sub Menu 1</a></li> <li><a href='#'>Sub Menu 2</a></li> <li><a href='#'>Sub Menu 3</a></li> </ul> </li> <li><a href='#'>Menu 2</a></li> <li><a href='#'>Menu 3</a></li> </ul>
Ad Banner areas
This template comes with many widgetized areas which can be used to put your Google ads or other banner ads. For example, you can add a 728x90 banner ad in the HTML/Javascript widget next to (Header) widget. You can also place 300x250 banner ads in sidebar and footer areas.
Comments widget
Go to Layout page -- Click Edit on Comment widget. Place the following code in the content box.
<style type="text/css"> ul.tb_recent_comments{list-style:none;margin:0;padding:0;} .tb_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;} .tb_recent_comments li .avatarImage{padding:3px;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;} .tb_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;} .tb_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;} </style> <script type="text/javascript"> //<![CDATA[ // Recent Comments Settings var numComments = 5, showAvatar = true, avatarSize = 30, characters = 60, defaultAvatar = "http://www.gravatar.com/avatar/?d=mm", hideCredits = true; //]]> </script> <script type="text/javascript" src="http://html-scripts.googlecode.com/files/rcentcmmntavr.js"></script> <script type="text/javascript" src="/feeds/comments/default?alt=json&callback=tb_recent_comments&max-results=5"></script>
Random Post widget
Go to Layout page -- Click Edit on Random Post widget. Paste the following code in the content box.
<script type="text/javascript"> var randarray = new Array();var l=0;var flag; var numofpost=10;function randomposts(json){ var total = parseInt(json.feed.openSearch$totalResults.$t,10); for(i=0;i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){ flag=1;}} if(flag==0&&l!=0){randarray[i++]=l;}}document.write('<ul>'); for(n in randarray){ var p=randarray[n];var entry=json.feed.entry[p-1]; for(k=0; k < entry.link.length; k++){if(entry.link[k].rel=='alternate'){var item = "<li>" + "<a href=" + entry.link[k].href + ">" + entry.title.$t + "</a> </li>"; document.write(item);}} }document.write('</ul>');} </script> <script src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=randomposts" type="text/javascript"></script>
SEO Stuff
Find following code in your template file and update meta values with appropriate text<meta content='Your Blog Description here!' name='description'/> <meta content='Your Keywords here!' name='keywords'/> <meta content='Author Name here!' name='Author'/> <meta content='general' name='rating'/> <meta content='all' name='robots'/> <meta content='index, follow' name='robots'/> <meta content='id' name='geo.country'/> <meta content='1 days' name='revisit-after'/> <meta content='Indonesia' name='geo.placename'/>
Layout for Johny DemoSite Blogger Template
- Dhrumit
- http://fashiondeca.blogspot.com Uliana
- Romulo
- mehdi
- Admin
- http://meraklisinagercekler.blogspot.com Harun Tepe
- http://www.idiotsfreedownload.com/ Hassan Al Mehdi
- orb
- http://www.sellthaihome.com orb
- http://www.sellthaihome.com orb
- Houssam
- jenny
- lovelytemplates
- Mehdi Ruby
- lovelytemplates
- Mehdi Ruby
- lovelytemplates
- Saqib
- Saqib
- lovelytemplates
- Graduation Party Ideas