Blogger templates Light magazine is designed for users of blogger / blogspot who want to have a blog magazine (blogazine). Blogger templates is suitable for news blogs, fashion blogs, personal blogs, etc
Light magazine has a magazine style features, 3 column, cutom dropdown menu, 4 column footer widget, jquery image slideshow, magazine style
blogger templates, left sidebar, right sidebar, white and gray color, etc
Template feature
- Magazine
- 3 columns
- Fixed
- Image Slideshow
- White and gray color
- Costum Menu (drop down)
- Right sidebar
- Left sidebar
Tutorials
Custom Menu
Go to
design -
Page element -
Add Gadged
Add
HTML/JavaScript
Add this code
The red color replace with your desired link
The green color change with the name you want the Menu
<div id='navbarmenuleftx'>
<ul id='navx'>
<!-- ============= Main Menu Edit Start =============== -->
<li><a href='/'>Home</a></li>
<li><a href='#YOURLINK'>Menu 1</a>
<ul>
<li><a href='#YOURLINK'>Menu 1.1</a>
<ul>
<li><a href='#YOURLINK'>Menu 1.1.1</a></li>
<li><a href='#YOURLINK'>Menu 1.1.2</a></li>
<li><a href='#YOURLINK'>Menu 1.1.3</a></li>
<li><a href='#YOURLINK'>Menu 1.1.4</a></li>
</ul>
</li>
<li><a href='#YOURLINK'>Menu 1.2</a>
<ul>
<li><a href='#YOURLINK'>Menu 1.2.1</a></li>
<li><a href='#YOURLINK'>Menu 1.2.2</a></li>
<li><a href='#YOURLINK'>Menu 1.2.3</a></li>
<li><a href='#YOURLINK'>Menu 1.2.4</a></li>
</ul>
</li>
<li><a href='#YOURLINK'>Menu 1.3</a>
<ul>
<li><a href='#YOURLINK'>Menu 1.3.1</a></li>
<li><a href='#YOURLINK'>Menu 1.3.2</a></li>
<li><a href='#YOURLINK'>Menu 1.3.3</a></li>
<li><a href='#YOURLINK'>Menu 1.3.4</a></li>
</ul>
</li>
</ul>
</li>
<li><a href='#YOURLINK'>Menu 2</a>
<ul>
<li><a href='#YOURLINK'>Menu 2.1</a>
<ul>
<li><a href='#YOURLINK'>Menu 2.1.1</a></li>
<li><a href='#YOURLINK'>Menu 2.1.2</a></li>
<li><a href='#YOURLINK'>Menu 2.1.3</a></li>
<li><a href='#YOURLINK'>Menu 2.1.4</a></li>
</ul>
</li>
<li><a href='#YOURLINK'>Menu 2.2</a>
<ul>
<li><a href='#YOURLINK'>Menu 2.2.1</a></li>
<li><a href='#YOURLINK'>Menu 2.2.2</a></li>
<li><a href='#YOURLINK'>Menu 2.2.3</a></li>
<li><a href='#YOURLINK'>Menu 2.2.4</a></li>
</ul>
</li>
<li><a href='#YOURLINK'>Menu 2.3</a>
<ul>
<li><a href='#YOURLINK'>Menu 2.3.1</a></li>
<li><a href='#YOURLINK'>Menu 2.3.2</a></li>
<li><a href='#YOURLINK'>Menu 2.3.3</a></li>
<li><a href='#YOURLINK'>Menu 2.3.4</a></li>
</ul>
</li>
</ul>
</li>
<li><a href='#YOURLINK'>Menu 3</a>
<ul>
<li><a href='#YOURLINK'>Menu 3.1</a>
<ul>
<li><a href='#YOURLINK'>Menu 3.1.1</a></li>
<li><a href='#YOURLINK'>Menu 3.1.2</a></li>
<li><a href='#YOURLINK'>Menu 3.1.3</a></li>
<li><a href='#YOURLINK'>Menu 3.1.4</a></li>
</ul>
</li>
<li><a href='#YOURLINK'>Menu 3.2</a>
<ul>
<li><a href='#YOURLINK'>Menu 3.2.1</a></li>
<li><a href='#YOURLINK'>Menu 3.2.2</a></li>
<li><a href='#YOURLINK'>Menu 3.2.3</a></li>
<li><a href='#YOURLINK'>Menu 3.2.4</a></li>
</ul>
</li>
<li><a href='#YOURLINK'>Menu 3.3</a>
<ul>
<li><a href='#YOURLINK'>Menu 3.3.1</a></li>
<li><a href='#YOURLINK'>Menu 3.3.2</a></li>
<li><a href='#YOURLINK'>Menu 3.3.3</a></li>
<li><a href='#YOURLINK'>Menu 3.3.4</a></li>
</ul>
</li>
</ul>
</li>
<li><a href='#YOURLINK'>Menu 4</a></li>
<li><a href='#YOURLINK'>Menu 5</a></li>
<li><a href='#YOURLINK'>Menu 6</a></li>
<li><a href='#YOURLINK'>Menu 7</a></li>
<!-- ============= Main Menu Edit End =============== -->
</ul>
</div>
Search
Go to
design -
Page element -
Add Gadged
Add
HTML/JavaScript
Add this code
The red color replace with your blog url
<form action='http://extemplatescom-demo.blogspot.com/search' id='searchform' method='get' name='searchform'><input id='searchformx' name='q' onblur='if (this.value == "") {this.value = "search";}' onfocus='if (this.value == "search") {this.value = ""}' type='text' value=''/> <input id='searchsubmit' type='submit' value='search'/> </form>
Image Slide Show
Go to Design - Edit HTML
Find this code
<!-- ============= Slider Edit Start =============== -->
The red color replace with yaour image
<!-- ============= Slider Edit Start =============== -->
<div class='ss-item' style='background-image: url(http://3.bp.blogspot.com/_OYo19xTeV58/TQJf2L5cTEI/AAAAAAAAAJA/77_yFDT_u4Q/s1600/banner1.jpg);'>
</div>
<div class='ss-item' style='background-image: url(http://2.bp.blogspot.com/_OYo19xTeV58/TQJgBkH34UI/AAAAAAAAAJE/KF4Nec6XQhk/s1600/banner2.jpg);'>
</div>
<div class='ss-item' style='background-image: url(http://1.bp.blogspot.com/_OYo19xTeV58/TQJgM1ryFiI/AAAAAAAAAJI/2YxwvbiRGGY/s1600/banner3.jpg);'>
</div>
<div class='ss-item' style='background-image: url(http://2.bp.blogspot.com/_OYo19xTeV58/TQJgVhQxG8I/AAAAAAAAAJM/Xg-5HUVuusA/s1600/banner4.jpg);'>
</div>
<div class='ss-item' style='background-image: url(http://2.bp.blogspot.com/_OYo19xTeV58/TQJgqs_iUnI/AAAAAAAAAJQ/1CFbReJFFUs/s1600/banner5.jpg); '>
<!-- ============= Slider Edit End =============== -->