How To Add Notification Box For Blogger/Blog

Making your readers observance crucial division of your install or blog is real strategic.So we prefab this new asking box.We other a hang impression and thence it could impress your job.Lets get o.k. to our manipulate now and acquire this new asking box.

 

[button link=”http://bloggerherodemo.blogspot.com/2012/11/modern-notification-box-v2-for-blogger.html” newwindow=”yes”] LIVE DEMO[/button]

Adding The Notification Box For Blogger

Step 1: Adding The CSS 

  • Go to Blogger
  • Template > Edit Html
  • Search for  ]]></b:skin> (Ctrl+f)
  • Add the following code above it
.tip {
text-decoration: blink;
background: #FFC url(https://lh5.googleusercontent.com/-sRX_pcKj5V0/UK8LgCVZanI/
AAAAAAAAG84/-Pst-ZgY36k/s32/notification.png) center no-repeat;
margin: 0 auto;
width: 90%;
display: block;
border: 1px solid #D5B900;
background-position: 7px 50%;
padding: 10px 10px 10px 45px;
vertical-align: text-top !important;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.tip:hover{
 box-shadow: 0 0 5px 2px rgba(0,0,0,.35);
}

Step 2: Implementing The Notification Box 

  • Whenever you feel the need to use this box just use the code given below :
<div class="tip"><blink>Note:- </blink>YOUR TEXT HERE</div>
  • Replace the YOUR TEXT HERE with your own.
  • If  You Enjoy This Post! Please Take 5 Seconds To Share It.

Be sure to subscribe to the Blogger Heroe newsletter and get regular updates about awesome posts just like this one and more!

About kasper

Hey Guys I am Avinash a.k.a Kasper.I am one of the founder of this blog.I love blogging,gaming and other fitness activities.Blogging has taught me many things in my life and made me different from others.The only thing I believe is that if you ain't First your Last!

Speak Your Mind

*


*