My Mag Documentation

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).

Discover more about SEO Meta tags SEO Pack 2016 for Blogspot Blogger

Top Social Icons

Go to Template > Edit HTML and find below codes and change all # with your social profile links.

 <div class='top-social-wrapper'>
<div class='social-icon'><a href='#' target='_blank'><i class='fa fa-facebook'/></a></div>
<div class='social-icon'><a href='#' target='_blank'><i class='fa fa-google-plus'/></a></div>
<div class='social-icon'><a href='#' target='_blank'><i class='fa fa-twitter'/></a></div>
<div class='social-icon'><a href='#' target='_blank'><i class='fa fa-linkedin'/></a></div>
<div class='social-icon'><a href='#' target='_blank'><i class='fa fa-youtube-play'/></a></div>
<div class='social-icon'><a href='#' target='_blank'><i class='fa fa-pinterest-square'/></a></div>
<div class='clear'/>     
</div>

Main Menu

Go to Template > Edit HTML and find below codes and change all # with your menu links.

 <div id='menu-wrapper'>
<nav id='menu' itemscope='itemscope' itemtype='http://schema.org/SiteNavigationElement' role='navigation'>
<input type='checkbox'/>
<label/>
<ul>
<li class='homers'><a href='/'><i class='fa fa-home'/> Home</a></li>
<li><a href='#'>Menu1</a></li>
<li><a class='ai' href='#'>Drop Menu <i class='fa fa-angle-down'/></a>
<ul class='menus'>
<li><a href='#'>Drop Menu 1</a></li>
<li><a href='#'>Drop Menu 2</a></li>
<li><a href='#'>Drop Menu 3</a></li>
</ul>
</li>
<li><a href='#'>Menu2</a></li>
<li><a class='ai' href='#'>Drop Menu <i class='fa fa-angle-down'/></a>
<ul class='menus'>
<li><a href='#'>Drop Menu 1</a></li>
<li><a href='#'>Drop Menu 2</a></li>
<li><a href='#'>Drop Menu 3</a></li>
</ul>
</li>
  <li><a href='/404'>Error</a></li>
<li><a class='trigger2' href='#' onclick='window.open(&apos;http://translate.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&amp;amp;langpair=en%7cen&amp;amp;hl=en&apos;); return false;' rel='nofollow' target='_blank' title='English'>Translate</a></li>
</ul>
</nav>
</div>

Featured Posts Slider

Go to Layout and Open Featured Posts Slider widget and type recent or random

Sidebar Social Icons

Open 1st widget from Sidebar2 and past below codes.

 <div class="widget_social_apps">
<div class="app_social facebook">
<a href="https://www.facebook.com/USER_NAME" target="_blank">
<span class="app_icon"><i class="fa fa-facebook"></i></span>
</a></div>
<div class="app_social twitter">
<a href="https://www.twitter.com/USER_NAME" target="_blank">
<span class="app_icon"><i class="fa fa-twitter"></i></span>
</a></div>
<div class="app_social pinterest">
<a href="https://www.pinterest.com/USER_NAME" target="_blank">
<span class="app_icon"><i class="fa fa-pinterest"></i></span>
</a></div>
<div class="app_social google">
<a href="https://www.google.com/USER_NAME" target="_blank">
<span class="app_icon"><i class="fa fa-google-plus"></i></span>
</a></div>
</div>

Sidebar recent posts widgets

Go to Layout and open stocked widgets from Sidebar1 and Sidebar2 and type LABEL-NAME

Author Box Social Icons

Go to Template > Edit HTML and find below codes.

  <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>

Change Template Colors

It is very easy to change template color with one click. Go to Template > Customize > Advanced.

Documentations - MS Design Official