Features Oslanis Blogger Template
- Fully responsive template
- Support Template Designer for background color, background image and background widget sidebar. For other variables, you can edit via Edit HTML
- Support most browsers user include IE8.
- Featured content slider.
- Responsive dropdown menu.
- Responsive video.
- No error Google Snippet. Please check here.
- Font icon from Font Awesome.
- Widgetable, drag and drop.
- Related posts with thumbnail.
- 3 column footer
- Auto crop thumbnail image with proportional size (not streched)
- Recent post and comment with thumbnail
- Default thumbnail in summary post, recent post, and related post for a post without image
- Ads ready
- and more
See also :
Axorys Blogger Template. A Blogger template with 8 predefined styles.
Setting Oslanis Blogger template
1. Setting Menu Navigation
You can add menu navigation from Layout > Add a gadget. The structure code something like this :<ul class='sf-menu' id='osl-menu'>
<li><a href="/">Home</a></li>
<li><a href="#LINK">Menu</a></li>
<li><a href="#LINK">Model</a></li>
<li><a href="#LINK">Project</a></li>
<li><a href="#LINK">Inspirations</a></li>
<li><a href="#LINK">Portfolios</a>
<ul>
<li><a href="#LINK">Art Work</a>
<ul>
<li><a href="#LINK">Sketch</a></li>
<li><a href="#LINK">Poster</a></li>
<li><a href="#LINK">Animation</a></li>
</ul>
</li>
<li><a href="#LINK">Logo</a></li>
<li><a href="#LINK">Branding</a></li>
<li><a href="#LINK">Web Design</a></li>
<li><a href="#LINK">Social Media</a></li>
</ul>
</li>
<li><a href="#">Sample Posts</a>
<ul>
<li><a href="#LINK">Post Format 1</a></li>
<li><a href="#LINK">Post Format 2</a></li>
<li><a href="#LINK">Post Format 3</a></li>
<li><a href="#LINK">Post Format 4</a></li>
</ul>
</li>
<li><a href="#">Last Menu</a>
<ul class='last'> <!-- LAST_MENU -->
<li><a href="#LINK">Child Last Menu 1</a></li>
<li><a href="#LINK">Child Last Menu 2</a>
<ul class='last'> <!-- LAST_MENU -->
<li><a href="#LINK">Sub Child Last Menu 2.1</a></li>
<li><a href="#LINK">Sub Child Last Menu 2.2</a></li>
<li><a href="#LINK">Sub Child Last Menu 2.2</a></li>
</ul>
</li>
<li><a href="#LINK">Child Last Menu 3</a></li>
</ul>
</li>
</ul>
Note :
- #LINK : Menu link
- For last dropdown (but not last single menu), code
<ul>
must be<ul class='last'>
- code above for single menu (5 menu) and 1 level dropdown menu (1 menu), and 2 level dropdown menu (2 menu). You can custom as you want
2. Setting Content Slider
You can add content slider from Layout > Add a gadget. Overall, the structure code something like this :<div class="osl-slider">
<div class='slider-item'>
<img src='IMG_LINK' alt='ALT_IMG'/>
<div class='slider-content'>
<h2 class='title'><a href="LINK_HERE">TITLE_SLIDER_HERE</a></h2>
</div>
</div>
<div class='slider-item'>
<img src='IMG_LINK' alt='ALT_IMG'/>
<div class='slider-content'>
<h2 class='title'><a href="LINK_HERE">TITLE_SLIDER_HERE</a></h2>
</div>
</div>
</div>
Note :
For other setting such as : recent posts with thumbnail, recent comments with thumbnail, profile, social media account, etc, you can see in documentation (available in download file). - IMG_LINK : image link
- ALT_IMG : image ALT
- TITLE_SLIDER_HERE : title slider
- LINK_HERE : link to post
- all images for content slider it must same size
- If you want to add a link in image, the code should be like this :
Image<a href="LINK_HERE"><img src='IMG_LINK' alt='ALT_IMG'/></a>
* This template is free license. Please keep and DO NOT edit/remove the credit link. More details click here
**If you share this post in your blog, i would appreciated if the download link redirect to this post
Let me know if you have any question about Oslanis Blogger Template.
Images credit : - ArtPX.com
0 Comments