Pre Live Mag

Advertisements

Free Pre Live Mag Blogger Template

If Static Pages has an error with your browsers such as Firefox and Chrome, please attention note the updates

Free Pre Live Mag Blogger Template is a clean and elegant magazine style blogger template with vertical content slider.
Features of this template :
- 2 column template
- 3 column footer
- Magazine style template
- Vertical content slider
- SEO friendly with semantic heading level
- Ads Ready
- Auto readmore
- RSS & Twitter buttons
- Comment with gravatar ready
and more

It's suitable for all type of blog and compatible with most user browsers

Similar Templates : Cubenatic Blogger Template & Wazzirator Blogger Template

Designer & Author : ireng_ajah - DheTemplate.com / WordPress Theme 2 Blog

Instructions :

Setting Pre Live Mag Blogger Template

1. Setting Twitter & RSS Feed

Go to Design > Edit HTML and find this code below
<li class='twitter'><a href='#TWITTER_LINK'>Twitter</a></li>
<li class='rss'><a href='#FEED_LINK'>RSS</a></li>

Change the Red color with yours

2. Setting Featured content

Go to Design > Page Elements. Click EDIT of Featured-Content widget. Copy and paste this code below

<div id='featured'>
<ul class='ui-tabs-nav'>
<li class='ui-tabs-nav-item ui-tabs-selected' id='nav-fragment-1'><a href='#fragment-1'><img alt="testing" height="60" src="http://1.bp.blogspot.com/_aAjcAMHOGT4/TOt4OcTqpVI/AAAAAAAAF20/4Q0yOHIrQbA/s400/Poster-Inc.jpg" width="80" /><span>Poster Inc</span></a></li>
<li class='ui-tabs-nav-item' id='nav-fragment-2'><a href='#fragment-2'><img alt="testing" height="60" src="http://1.bp.blogspot.com/_aAjcAMHOGT4/TOIgrQJbO7I/AAAAAAAAFr4/uRE9EL_1TAY/s400/whitePress.jpg" width="80" /><span>whitePress</span></a></li>
<li class='ui-tabs-nav-item' id='nav-fragment-3'><a href='#fragment-3'><img alt="testing" height="60" src="http://2.bp.blogspot.com/_aAjcAMHOGT4/TN2P0H3e1uI/AAAAAAAAFn8/0CuVs7JXXEU/s400/Ireng-Manis-V2.jpg" width="80" /><span>Ireng Manis V2</span></a></li>
<li class='ui-tabs-nav-item' id='nav-fragment-4'><a href='#fragment-4'><img alt="testing" height="60" src="http://3.bp.blogspot.com/_aAjcAMHOGT4/TEnQFBKvnoI/AAAAAAAADlI/kt7IBZMVho4/s400/Press-Magajah.png" width="80" /><span>Press Magajah</span></a></li>
</ul>
<!-- First Content -->
<div class='ui-tabs-panel' id='fragment-1' style=''>
<img alt="testing" height="290" src="http://1.bp.blogspot.com/_aAjcAMHOGT4/TOt4OcTqpVI/AAAAAAAAF20/4Q0yOHIrQbA/s400/Poster-Inc.jpg" width="420" />
<div class='info'>
<h3><a href='http://www.dhetemplate.com/2010/11/free-poster-inc-blogger-template.html'>Poster Inc Blogger Template</a></h3>
<p>Aliquam sit amet felis. Mauris semper, velit semper laoreet dictum, quam diam dictum urna, nec placerat elit nisl in quam...<a href='http://www.dhetemplate.com/2010/11/free-poster-inc-blogger-template.html'>More</a></p>
</div>
</div>
<!-- Second Content -->
<div class='ui-tabs-panel ui-tabs-hide' id='fragment-2' style=''>
<img alt="testing" height="290" src="http://1.bp.blogspot.com/_aAjcAMHOGT4/TOIgrQJbO7I/AAAAAAAAFr4/uRE9EL_1TAY/s400/whitePress.jpg" width="420" />
<div class='info'>
<h3><a href='http://www.dhetemplate.com/2010/11/free-whitepress-blogger-template.html'>whitePress Blogger Template</a></h3>
<p>Etiam augue pede, molestie eget, rhoncus at, convallis ut, eros...<a href='http://www.dhetemplate.com/2010/11/free-whitepress-blogger-template.html'>More</a></p>
</div>
</div>
<!-- Third Content -->
<div class='ui-tabs-panel ui-tabs-hide' id='fragment-3' style=''>
<img alt="testing" height="290" src="http://2.bp.blogspot.com/_aAjcAMHOGT4/TN2P0H3e1uI/AAAAAAAAFn8/0CuVs7JXXEU/s400/Ireng-Manis-V2.jpg" width="420" />
<div class='info'>
<h3><a href='http://www.dhetemplate.com/2010/11/free-ireng-manis-v2-blogger-template.html'>Ireng Manis V2 Blogger Template</a></h3>
<p>Etiam augue pede, molestie eget, rhoncus at, convallis ut, eros...<a href='http://www.dhetemplate.com/2010/11/free-ireng-manis-v2-blogger-template.html'>More</a></p>
</div>
</div>
<!-- Fourth Content -->
<div class='ui-tabs-panel ui-tabs-hide' id='fragment-4' style=''>
<img alt="testing" height="290" src="http://3.bp.blogspot.com/_aAjcAMHOGT4/TEnQFBKvnoI/AAAAAAAADlI/kt7IBZMVho4/s400/Press-Magajah.png" width="420" />
<div class='info'>
<h3><a href='http://www.dhetemplate.com/2010/07/free-blogger-template-press-magajah.html'>Press Magajah Blogger Template</a></h3>
<p>Aliquam sit amet felis. Mauris semper, velit semper laoreet dictum, quam diam dictum urna, nec placerat elit nisl in quam...<a href='http://www.dhetemplate.com/2010/07/free-blogger-template-press-magajah.html'>More</a></p>
</div>
</div>
</div>


Green color = alt image
Blue color = image url
Brown color = Title of featured content
Red color = URL post
Black bold = short description of featured content


** Updates **

Go to Design > Edit HTML and find this code below

.crosscol .PageList li, .PageList li{
margin:0;
padding:0;
outline:none
}

.PageList{
padding:0;
margin:0;
float:left;
width:700px;
}

.PageList li a{
line-height:1.6;
font-size:16px;
font-weight:bold;
margin:0;
padding:5px 20px;
display:block;
color:#fff;
}

.PageList li a:hover{
background:#474640;
color:#fff;
}

.PageList li.selected a{
background:#474640;
color:#fff;
text-decoration:none;
}

Change that code with this one :

#PageList1{
padding:0;
margin:0;
float:left;
width:700px;
}

.crosscol .PageList li, .footer .PageList li, .crosscol .PageList ul, .footer .PageList ul {
float: left;
list-style: none;
margin: 0;
padding:0;
}

.PageList li a{
line-height:1.6;
font-size:16px;
font-weight:bold;
margin:0;
padding:5px 20px;
display:block;
color:#fff;
}

.PageList li a:hover{
background:#474640;
color:#fff;
}

.PageList li.selected a{
background:#474640;
color:#fff;
text-decoration:none;
}

Then add this code below to hide the PageList title

#PageList1 h2 {display:none;}

exactly before ]]></b:skin> code

Download Pre Live Mag for free at DheTemplate.com