Showing posts with label Responsive Blogger Templates. Show all posts
Showing posts with label Responsive Blogger Templates. Show all posts

Sunday, April 20, 2014

// // Leave a Comment

Incipient Blogger Simple & Neat Template


Features of this template :



  • Responsive blogger template both of desktop and mobile view
  • Minimalist and clean design template
  • Compatible with modern browsers
  • 2 column template
  • 2 column footer and more
Demo    |    Download


Read More
// // Leave a Comment

Main Photo Responsive Blogger Template



Features of this template :


  • Responsive blogger template both of desktop and mobile view
  • Support Template designer. You can edit the background image, font family, font size, font color and others in Template Designer
  • Featured image slider with auto recent post per label
  • Minimalist and clean design template
  • Compatible with modern browsers
  • 2 column template
  • 3 column footer and more
DEMO DESKTOP    |    DEMO MOBILE    |    DOWNLOAD


Setting Main Photo Responsive Blogger template


1. General setting
Before install this template, make sure to change the mobile view. 
Go to Template > click the Gear icon > click Yes. Show mobile template on mobile devices. > choose Custom (please see the image below) 

* this setting recommended if in your current setting for mobile view is No. Show desktop template on mobile devices 

2. Setting Featured Image Slider
This template support image slider with auto recent post per label/category. You just need type the Label name in widget section.
Go to Layout > click "Edit" Looped Slider widget


* Case sensitive. make sure you write correctly

3. Setting social networks
Go to Design > Edit HTML > Proceed and find this code below :

<div class='network'>
<ul>
<li><a href='https://twitter.com/ireng_ajah'><img alt='Twitter' src='http://4.bp.blogspot.com/-xAYWEVyxvmM/Tpkdq4l1lNI/AAAAAAAALtk/FYlb2DxEcqE/s1600/twitter.png' title='Main Blogger on Twitter'/></a></li>
<li><a href='https://www.facebook.com/MainBlogger'><img alt='Facebook' src='http://3.bp.blogspot.com/-VOBRmsL8e6Y/Tpkdqs5VxOI/AAAAAAAALtI/z57Wppciv5c/s1600/facebook.png' title='main Blogger on Facebook'/></a></li>
<li><a href='https://plus.google.com/111461490683022468168'><img alt='Google+' src='http://4.bp.blogspot.com/-yA9nQkc9rSQ/Tpkdqk2-hKI/AAAAAAAALtQ/K0PjU7Z5tNs/s1600/gplus.png' title='Main Blogger on Google+'/></a></li>
<li><a href='http://feeds.feedburner.com/mainbloggerz'><img alt='RSS Feed' src='http://4.bp.blogspot.com/-i7NERqdQKP0/Tpkdq10lKqI/AAAAAAAALtY/TYmuUrKey9A/s1600/rss.png' title='Subscribe RSS Feed Main Blogger'/></a></li>
</ul>
</div>

Replace : Red color with you social and RSS feed links 

4. Setting Menu navigation on Bottom 
Go to Design > Edit HTML > Proceed and find this code below : 

<div class='creditl'>
<ul>
<li><a href='/'>Home</a></li>
<li><a href='/p/about.html'>About</a></li>
<li><a href='/p/advertise.html'>Advertise</a></li>
<li><a href='/p/contact-us.html'>Contact Us</a></li>
</ul>
</div>

Replace : Link and title menu

5. Setting Banner Ad 125*125px 
For perfect view, the structure of banner ad 125*125px should be like this 

<ul class='ads'>
<li>YOUR_LEFT_BANNER_CODE_HERE</li> <!-- Left banner -->
<li class='last'>YOUR_RIGHT_BANNER_CODE_HERE</li> <!-- Right banner -->
</ul>

6. Setting Widget on Mobile 
To display widget on mobile or/and desktop, you can add these codes 

mobile='yes'
mobile='no'
mobile='only'

For example, you want to add Popular Post widget. Default Popular Post widget look like this :
<b:widget id='PopularPosts1' locked='false' title='Popular' type='PopularPosts'/>

Then, you want to display on mobile too. So, the Popular Post widget code will be like this
<b:widget id='PopularPosts1' mobile='yes' locked='false' title='Popular' type='PopularPosts'/>
If you need more information please leave a comment i am glad to see your comments here. :)

Template Owner : Main-Blogger


Read More

Wednesday, April 9, 2014

// // 8 comments

Adamz Responsive Premium Blogger Template Free Download

Adamz Responsive Premium Blogger Template Free Download


Blogger template choice is an important things to make a wonderful  blog. Because everyone has aim to earn money from his blog. But you need to increase your traffic fast to make it's a source of earning. Perfect choice of your template will increase your blog visitors. Today I will give a wonderful template. Name of  this template is Adamz Premium Responsive Blogger Template.

Also Read: Top Easy Ways To Generate Huge Traffic To New Blog


Adamz blogger template is a responsive blogger template. It is SEO optimized  and Adsense friendly, especially designed for professionals. Attractive color and it some especial feature easily attracts visitors.

Main Features: 


Auto featured post and manual featured post
Lightweight read more button
Load more post feature
Popular post widget, recent comment widget, archive widget
Slide show
And more
Support IE8+,Mozilla,Chrome,Safari

DEMO      |      DOWNLOAD
Read More

Tuesday, February 4, 2014

// // 1 comment

Blackomaz Responsive Blogger Template


Live Demo    ||    Download

Blackomaz is essentially professional and far high quality 3 column Blogger Template designed for technology blogs, Magazine and news portal. This theme is second version of our famous theme new mashable. We have named it dynamo to give a respect to world's best Magician "Steven Frayne". This theme also has some dynamic features.

Key Features

  • Retina Ready: All images, text and icon in this theme is stretchable and user can see it clearly, We have added a jquery plugin to this theme which automatically resize thumbnail according to their surrounding.
  • Social Media Icons: Some real high quality Social plugins are added by default. You can see them on the main header, below post title, and many other high quality places.
  • Related Post: We have added morden related post widget to this theme which don't stretch images and make it look worst.

Add Labeled Post on 3rd Column

  • Go to blogger dashboard
  • Click on layout tab and add gadget on 3rd column and select Html/JavaScript.

  • Now paste below code in Html/JavaScript.

<div id='featurebottom1'><h2 class='headingfeature'>Technology</h2>
<div class='left-corner-canvas'/>
<script src='/feeds/posts/summary/-/technology?max-results=9&amp;orderby=published&amp;alt=json-in-script&amp;callback=recentthumbs&amp;' type='text/javascript'/>
<a class='readmoretopic' href='/search/label/technology'>Browse More</a>
</div>
<div style='clear:both;'/></script></div></div>

  • Now replace technology with the label you want to show post of in 3rd column. 

Fix Your Blog Header


We highly recommend you to use image logo as blog header but if you want to show text in your blog header instead of img then your blog header will look creapy, To fix it follow below steps:

  • Go to blogger dashboard
  • Click on Template tab
  • Now click on Edit HTML button
  • Paste below code above </head> tag.
<style>
.header-right {
margin-top: -48px !important;
}
</style>

Click on save button. 

NOTE:
  1. We highly recommend you to use image logo as blog header.
  2. Don't Show more than 7 post on home page.
  3. We recommend users to show popular post on 1st column at top most position.
  4. Don't remove our credit link or it will redirect your blog here.

Read More