Easy Blog - Responsive and SEO Blogger Template

Easy Blog - Responsive and SEO Blogger Template is the latest release from MS Design. At the first sight, this template is very clean, fast response, minimalist.

This is them simple grid template blogger, that made me chose it for my Blogthemes.top template from now on.

When I check out the html template, it has already intergrated some SEO features, that made people feel happy. One more thing, Easy Blog is a responsive template, have a good score with Page Speed Insight testing tool and Structured Data Testing Tool, Mobile Friendly testing,...

I love this version of Easy Blog while you could change your template color at anytime.

Features:

Fully responsive
SEO optimize
Good Structured Data
Admin Panel
Sticky Menu
Dropdown menu
Social Icons
Unlimited color
Ads ready
Subscribe box
Related post widget
Recent post widget
Google comment
Social share
Next/Previous post/page
Custom 404 page
...

Demo - Download

Documentation

1. Installation

Unzip the downloaded ZIP file.
On Blogger Dashboard Click Template.
Click Backup/Restore button (Top Right).
Click Choose File button. Find where the Template xml file location.
Then Click Upload.

Customize SEO Meta tags

YOUR KEYWORDS HERE: Type your main keywords.
GOOGLE+ID: Your Google Plus profile id (replace 3 times).
GOOGLE-WEBMASTER-CODE: Google webmaster tools verification code.
BING-WEBMASTER-CODE: Bing webmaster tools verification code.
ALEXA-VERIFY-CODE: Alexa Verify code.
Sylhet, Bangladesh: Your state and country name.
YOUR-NAME: Blog's Admin name.
Bangladesh: Your country name.
english: Your content language
Msubel.np: Facebook user name.
Msdesign.rtml: Facebook page user name.
FACEBOOK-APP-ID: Facebook app id.
FACEBOOK-ADMIN-ID: Your Facebook ID.
@msubelbd: Your Twitter username (replace 2 times).

Main Menu

<nav id='menu'> 
<input type='checkbox'/> 
<label>≡<span>Menu</span></label>
<ul> 
<li class='homers'><a href='/'><i class='fa fa-home'/> Home</a></li> 
<li><a href='#'>About</a></li> 
<li><a href='#'>Drop Down <i class='fa fa-chevron-down'/></a> 
<ul class='menus'> 
<li><a href='#'>Tab 1</a></li> 
<li><a href='#'>Tab 2</a></li> 
<li><a href='#'>Tab 3</a></li> 
<li><a href='#'>Tab 4</a></li> 
<li><a href='#'>Tab 5</a></li> 
<li><a href='#'>Tab 6</a></li>
</ul> 
</li> 
<li><a href='#'>Contact</a></li> 
<li><a href='#'>Drop Down <i class='fa fa-chevron-down'/></a> 
<ul class='menus'> 
<li><a href='#'>Tab 1</a></li> 
<li><a href='#'>Tab 2</a></li> 
<li><a href='#'>Tab 3</a></li> 
</ul> 
</li> 
<li><a href='#'>Advertise</a></li> 
<li><a href='#'>Drop Down <i class='fa fa-chevron-down'/></a> 
<ul class='menus'> 
<li><a href='#'>Tab 1</a></li> 
<li><a href='#'>Tab 2</a></li>
</ul> 
</li> 
</ul> 
</nav>

Top Social Icons

<div class='header-social'>
<a class='header-facebook' href='#' style='background: #375593'><i class='fa fa-facebook'/></a>
<a class='header-twitter' href='#'><i class='fa fa-twitter'/></a><a class='header-google-plus' href='#'><i class='fa fa-google-plus'/>
</a>
<a class='header-youtube-play' href='#'><i class='fa fa-youtube'/></a>
</div>

Footer Links

<div class='footerlinks'>
<a class='footer-link' href='#' title='About'>About</a> | 
<a class='footer-link' href='#' title='Sitemap'>Sitemap</a> |
<a class='footer-link' href='#' title='Advertise'>Advertise</a> |
<a class='footer-link' href='#' title='Privacy Policy'>Privacy Policy</a> | 
<a class='footer-link' href='#' title='Contact'>Contact</a>
</div>

Post Page Ad (728x90)

Go to Template > Edit HTML > Find below code and change with your Ad code

<div class='ad_banner728'>
<a href='#'><img alt='banner' src='http://i.imgur.com/BmEFrJJ.png' title='top banner'/></a>
</div>

Customize Author Box

<div class='authorboxwrap'>
<div class='authorboxfull'>
<div class='avatar-container'>
<a href=''>
<img class='author_avatar' expr:alt='data:post.author' expr:src='data:post.authorPhoto.url' height='110' width='110'/>
</a>
</div>
<div class='author_description_container'>
<h4><a href='#' rel='author'><data:post.author/></a> <i class='fa fa-check-circle' style='color:rgb(17, 143, 249);font-size:16px;' title='Verified Author'/> </h4>
<p>
<data:post.authorAboutMe/>       
</p>
</div>
</div>
 <ul class='social-links'>
<li class='first'><a class='external external-link' href='#' rel='nofollow' target='_blank'><i class='fa fa-facebook'/></a></li>
<li><a class='external external-link' href='#' rel='nofollow' target='_blank'><i class='fa fa-twitter'/></a></li>
<li><a class='external external-link' href='#' rel='nofollow' target='_blank'><i class='fa fa-google-plus'/></a></li>
<li><a class='email-link' href='mailto:yourmail@domain.com'><i class='fa fa-envelope-o'/></a></li>
<li class='last'><a href='/'><i class='fa fa-laptop'/> </a></li>
</ul>
</div>

Change Template Color

It's Easy to customize this template's color. Just Go to Blogger Dashbord and Click Template then Click Customize and ClickAdvanced. Now You can change your blog color with your favorite color. This template is great with this hand on tool.

That's it. All the shortcode are similiar with other templates. If you don't know how to use them, just post it here.

Have fun with Bloging!