Notification Bar Widget to blogger

Notification bar at the bottom of your blog is a great way to divert user attention on some of the links , For example you can manually insert your new post link so that it gets maximum user attention and page views or you can add popular post link or anything for which you want some user attention.you can also put social media sharing icons at the bottom in this notification bar so your posts gets more Facebook likes and plus one,well for social media sharing we have many other widgets like:-

There are many things to do with notification bat at the bottom of blog like , If you want to earn money then you can insert your affiliate links in the notification bar along with you can promote your other blogs through anchor text of your blog's keyword or add social bookmarking icon at the bottom so you get more page views and traffic. So it is your choice what to do with this notification bar.

Lets get started , Below is the code and method to add notification bar at the bottom of blog with this new widget for blogger.

How to add blog bottom notification bat widget to blogger

Go to blogger dashboard

Go to template and then click on Edit HTML.

Now hit CTRL+F.And search for this piece of code </body>

Now copy the below code and paste it before the </body> and you are done.

<!-- Start of notification bat by http://blogtrixz.blogspot.in/ -->
<style type="text/css">
#blogtrixzbar
{
background-color:#1b1a1c;
color:#fff;
text-align: center;
margin:0 auto;
border-top: 3px solid #0ebfe9;
height:28px;
font-size:13px;
position:fixed;
bottom:0;
z-index:999;
width:100%;
border-top-left-radius:15px;
border-top-right-radius:15px;
display:block;
font-weight: bold;
font-family: arial,&quot;Helvetica&quot;;
font-color:#fff;
}
#blogtrixzbar:hover
{background:#111;}
#blogtrixzbar p{line-height:5px; font-size:13px; text-align:center; width:95%; float:left;}
#blogtrixzbar p a{ text-decoration:underline; color:#0ebfe9;}
.blogtrixzss{display:block; position:relative; right:15px; float:right;}
.blogtrixzss a{font-size:18px; font-weight:bold; font-family:&quot;Arial&quot;; color:#0ebfe9; line-height:30px;}
</style><center>
<div id="blogtrixzbar">
<blink>Get awesome and new</blink> <a href="http://blogtrixz.blogspot.in/search/label/blogging%20tips" target="_blank">Blogging Tips</a> | <blink>With all new and

creative </blink> <a href="http://blogtrixz.blogspot.in/search/label/Widget" target="_blank">Blogger widgets</a><br />
<div class="blogtrixzss">
<a href="javascript:hide_cross();">X</a></div>
</div>
</center>
<script language="JavaScript">
function hide_cross() {
crosstbox = document.getElementById(&quot;bssticky&quot;);
crosstbox.style.visibility = &#39;hidden&#39;;
}
</script>
<!-- End of notification bat by http://blogtrixz.blogspot.in/ -->

Here are some customization that you can make.Orange type highlighted text type your text.

Follow @dhavalkuku

BlogTrixz