Saturday 1 October 2011

Techtive Free Premium Blogger Template

Techtive Blogger Template
Template Name : Techtive
Original Designer : Ngejunk
Bloggerize by : Free Blogger Template
Demo Url : CLICK HERE
Download : Release Page

Hybrid News Blogger Template

Hybrid News Blogger Template
Template Name : Hybrid News
Original Designer : Hybrid
Bloggerize by : Free Blogger Template
Demo Url : CLICK HERE
Download : Hybridnews.zip

Instalations Guide :

Because of most user of my template have a same problem with file hosting, so I places all javasript code in this template. No need to use file hosting anymore. But, be careful when editing this template, use CTRL+F to find the code for the right search.

Open Edit HTML, and lets begin.....




1. Top Navigations
Search this code

blue/# = link anchor
red = text anchor
bold code = adding new menu

<ul class='menu sf-menu'>
<li class='current_page_item'><a href='/'>Home</a></li>
<li class='page_item'><a href='#' title='About'>About</a></li>
<li class='page_item'><a href='#' title='Archives'>Archives</a></li>
<li class='page_item'><a href='#' title='Blog'>Blog</a></li>
<li class='page_item'><a href='#' title='Elements'>Elements</a></li>
<li class='page_item'><a href='#' title='New menu'>New Menu</a></li>
</ul>


2. Second Navigations
Search this code

<ul class='menu sf-menu'>
<li class='cat-item'><a href='#' title='Edit Title'>Edit</a></li>
<li class='cat-item'><a href='#' title='Edit Title'>Edit</a></li>
<li class='cat-item'><a href='#' title='Edit Title'>Edit</a></li>
<li class='cat-item'><a href='#' title='Edit Title'>Edit</a></li>
</ul>


3. Slide Feature [Automatic update for post summary and image thumbnail]


NOTE : SLIDE FEATURE OF HYBRID NEWS BLOGGER TEMPLATE USING LIMITED ATOM FEEDS SCRIPT AND IT'S STATIC MODE. IN THE XML OF THIS TEMPLATE, INCLUDING 2 ATOM SCRIPT FOR 2 PAGE OF SLIDE SHOW. SO, FOR TESTING THIS TEMPLATE/FOR NEW BLOG, YOU NEED MINIMUM 2 BLOG POST. YOU CAN TRY WITH 1 BLOG POST AND SEE THE EFFECT.

PLEASE FOLLOW THE INSTRUCTIONS CAREFULLY.

Find this code
Change red text with your blog feeds or blog feed by category/label like this

http://yourblogname.blogspot.com/feeds/posts/default/-/yourbloglabel


=> In Script 1
startposts = 0;
numposts = 1;
home_page = "http://hybridnews-fbt.blogspot.com/feeds/posts/default";


=> In Script 2
startposts = 1;
numposts = 2;
home_page = "http://hybridnews-fbt.blogspot.com/feeds/posts/default";


How to add more slide page?

Full code of slide feature for 2 page is like this
<div class='feature'>
<script language='JavaScript'>
bla....
bla....
bla....
startposts = 0;
numposts = 1;
home_page = &quot;http://hybridnews-fbt.blogspot.com/feeds/posts/default&quot;;
</script>
<script type='text/javascript'>
//<![CDATA[
bla....
bla....
bla....
//]]>
</script>
</div>

<div class='feature'>
<script language='JavaScript'>
bla....
bla....
bla....
startposts = 1;
numposts = 2;
home_page = &quot;http://hybridnews-fbt.blogspot.com/feeds/posts/default&quot;;
</script>
<script type='text/javascript'>
//<![CDATA[
bla....
bla....
bla....
//]]>
</script>
</div>

To add more page for slide feature, just copy the code from <div class='feature'> until </div>, paste it under previous code, then change the "startposts" and "numposts", example like below.
<div class='feature'>
<script language='JavaScript'>
bla....
bla....
bla....
startposts = 0;
numposts = 1;
home_page = &quot;http://hybridnews-fbt.blogspot.com/feeds/posts/default&quot;;
</script>
<script type='text/javascript'>
//<![CDATA[
bla....
bla....
bla....
//]]>
</script>
</div>

<div class='feature'>
<script language='JavaScript'>
bla....
bla....
bla....
startposts = 1;
numposts = 2;
home_page = &quot;http://hybridnews-fbt.blogspot.com/feeds/posts/default&quot;;
</script>
<script type='text/javascript'>
//<![CDATA[
bla....
bla....
bla....
//]]>
</script>
</div>

<div class='feature'>
<script language='JavaScript'>
bla....
bla....
bla....
startposts = 2;
numposts = 3;
home_page = &quot;http://hybridnews-fbt.blogspot.com/feeds/posts/default&quot;;
</script>
<script type='text/javascript'>
//<![CDATA[
bla....
bla....
bla....
//]]>
</script>
</div>


4. Change default image

Search this url : http://i584.photobucket.com/albums/ss289/hemingways-studio/Have_Images_TEXT.png

Replace with your own image url.