Password : www.besttemplatesthemes.blogspot.com
Template Features:-
- In update version you can get label widget with awesome style. You can change the color.
- In first, the sharing buttons below are simple, but I repace the buttons with share this buttons with count with Subscribe us Box.
- I replace the text Older Posts, Home, New Post with images.
Template Customization:-
Copy and Paste The following code inside HTML/JavaScript widget for the subscribe box:
<style>
#salahuddin-ayubi {
border: 0;
margin-bottom: 10px;
margin: 0 auto;
width:300px;
}
#email-news-subscribe .email-box{
padding: 5px 5px;
font-family: "Arial","Helvetica",sans-serif;
height:38px;}
#email-news-subscribe .email-box input.email{
background:#FFFFFF;
border: 1px solid #dedede;
color: #999;
padding: 7px 10px 8px 10px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-o-border-radius: 3px;
-ms-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
border-image: initial;
font-family: "Arial","Helvetica",sans-serif;}
#email-news-subscribe .email-box input.email:focus{color:#333}
#email-news-subscribe .email-box input.subscribe{
background: -moz-linear-gradient(center top,#666 0,#333 100%);
background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#666),color-stop(1,#333));
font-family: "Arial","Helvetica",sans-serif;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border:1px solid #333;
color:white;
padding:7px 14px;
margin-left:3px;
font-weight:bold;
font-size:12px;
cursor:pointer;
border-image: initial;}
#email-news-subscribe .email-box input.subscribe:hover{
background-image:-moz-linear-gradient(top,#333,#666);
background-image:-webkit-gradient(linear,left top,left bottom,from(#333),to(#666));
filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#ffffff,endColorStr=#ebebeb);
outline:0;-moz-box-shadow:0 0 3px #999;
-webkit-box-shadow:0 0 3px #999;
box-shadow:0 0 3px #999
-pie-background:linear-gradient(270deg,#ffda4d,#ff9b00);
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border:1px solid #333;
color:#FFFFFF;
}
#other-social-bar {
padding: 0px;
overflow: hidden;
height:37px;
margin-top:-8px;
}
#other-social-bar ul {list-style: none outside none; padding-left: 4px;}
#other-social-bar .other-follow {
float: left;
overflow: hidden;
padding:5px;
width: 270px;}
#other-social-bar .other-follow ul {
list-style: none outside none;
padding-left: 4px;}
#other-social-bar .other-follow li {
display:inline;
border:0;
}
#other-social-bar .other-follow li a {
font-size: 12px;
color:#666;
font-weight: bold; font-family:arial;
display:inline;
}
#other-social-bar .other-follow li.my-rss {
background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsn3KUAG9KinxSKnvb5tSRkKJIVUXgClnYi0Dd7pYCA7h4eQgQ1TEu3D5sgJ2OIw0hiAQn_c0j6E0wzyS0TSaUwdVzgrcO-37u2Jk7xuoWZlR7k736ZG0DQb4NqZGNoRmUwA5HFP1O5u0/s400/rss-16x16.png') no-repeat transparent;
line-height: 1;
padding: 0px 3px 1px 20px;
width: 60px;
margin-bottom:0px;
margin-left:5px;}
#other-social-bar .other-follow li.my-rss a, #other-social-bar .other-follow li.my-twitter a, #other-social-bar .other-follow li.my-gplus a{
text-decoration:none;
}
#other-social-bar .other-follow li.my-rss a:hover, #other-social-bar .other-follow li.my-twitter a:hover, #other-social-bar .other-follow li.my-gplus a:hover{
text-decoration:underline;
}
#other-social-bar .other-follow li.my-twitter {
background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5cvgWc7uTIO8pa2nnsdqgTlhuEq6TeE6a0DvviF53kyf9B7UkUFBCFLmzx8I19nuy97_VktCU5uwFcb_KcfIGW5FhG4g-eDiDIauLPdZsQqwFlbU6xXc7OHDzEPY9JHRGy6WeWIOks_4/s400/twitter%2527.png') no-repeat transparent;
line-height: 1;
padding: 0px 3px 1px 20px;
width: 60px;
margin-bottom:0px;}
#other-social-bar .other-follow li.my-gplus {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi71gvfTiThyY5wsNph0FklB3SRmEYVPgBLgcbq2JXhYPk2zdioi9w0md4cwj4Kq_QOjRuM8YxpPUJpE5s295_ie-JMiKRjicdK3oJIx_UkpEM9nSKKSOESoWm0MlzEFXrm1jSscqoeU7E/s400/gplus-16x16.png) no-repeat transparent;
line-height: 1;
width: 60px;
padding: 0px 3px 1px 20px;
margin-bottom:0px;}
.emailicon {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqloOT8VcpsLvEkH41IlILmjqXMSC70-9w_SZo9hIbOi1ncMY_iatm413reHpnVX3kPQsKVJWcOoZ7X3heIda2oxy4Bk9c1hUdKY8hF6N2kFbhLG3I1KqqTzLJU4tdhvOJQQWf_tFVgz3i/s400/MBT-RSS-FEED.gif") no-repeat scroll 0px 2px transparent;
padding: 0px 20px 0px 95px;
min-height:100px;
margin: 0px;
width: 183px;
line-height: 20px;
vertical-align: middle;
font-size: 14px;
color: rgb(51, 51, 51);
}
.emailicon p {
color:#FF8604;
font-size: 20px;
font-weight: normal;
font-family: impact;
padding:40 0px 10px 0px;
margin:0;
padding-top: 20px;
line-height: 25px;
text-shadow: 0px 1px 0px #fff, 0px 2px 0px #C6C6C6;
}
</style>
<!--[if IE]>
<style>
#email-news-subscribe .email-box input.subscribe{
background: #333;
}
</style>
<![endif]-->
<div id="salahuddin-ayubi" >
<div class="emailicon"><p>Subscribe to our Free Email Updates! </p></div>
<div id="email-news-subscribe">
<div class="email-box"> <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=saqisoft', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input gtbfieldid="10" class="email" type="text" style="width: 160px; font-size: 12px;" id="email" name="email"value="Enter your email here..." onblur="if (this.value == '') {this.value = 'Enter your email here...';}" onfocus="if (this.value == 'Enter your email here...') {this.value = '';}" type="text" />
<input type="hidden" value="saqisoft" name="uri" /> <input type="hidden" name="loc" value="en_US" /> <input class="subscribe" name="commit" type="submit" value="Subscribe" /> </form> </div> </div>
<div id="other-social-bar">
<ul class="other-follow">
<li class="my-rss"> <a rel="nofollow" title="RSS" href="http://feeds.feedburner.com/saqisoft" target="_blank">RSS Feed</a> </li>
<li class="my-twitter"> <a rel="nofollow" title="twitter" rel="author" href="http://twitter.com/mybloggertricks" target="_blank">Twitter</a> </li>
<li class="my-gplus"> <a rel="nofollow" title="Google Plus" rel="author" href=https://plus.google.com/113751728388257561936 target="_blank">Google Plus</a> </li>
</ul>
</div>
</div>
Note: Repalce Yellow Highlighted Color with Yours.
These tabs can easily be adjusted in two ways. 1. either from layout section 2. or from Pages window.
To drag, add, delete or update the tabs, simply go to Blogger > Pages
From here you can add, delete pages and you can also drag the tabs to shift their locations.
To edit links simply search for the following code inside your template:
ust below it you will see a list of li tags where you can insert URL and title for your tabs. To create a sub menu transform your code in the following way:
From this:
- <li><a href='TAB URL'>TAB TITLE</a></li>
<li><a href='TAB URL'>TAB TITLE</a>
<span class='sf-sub-indicator'/>
<ul class='sub-menu' style='display: none; visibility: hidden;'>
<li><a href='Subpage url'>Subpage 1</a></li>
<li><a href='Subpage url'>Subpage 2</a></li>
<li><a href='Subpage url'>Subpage 3</a></li>
<li><a href='Subpage url'>Subpage 4</a></li>
</ul>
</li>
To edit the menu at the bottom, simply find this code inside your template:
<ul id='footer-navigation'>
<li><a href='#'>Home</a></li>
<li><a href='#'>Typography</a></li>
<li><a href='#'>Sitemap</a></li>
<li><a href='#'>Services</a></li>
<li><a href='#'>Contact</a></li>
</ul>
To add the archive widget kindly add an archive widget like your normally do from the layout section and then give it the following settings: