How To Add Message Box Like Wordpress With Close Button

How To Add Message Box Like Wordpress With Close Button 

1.Login to your blogger dashboard--> desing- -> Edit HTML

2.Scroll down to where you see ]]></b:skin> tag.

3.Copy below code and immediately after it paste ]]></b:skin> tag.

<script src='https://sites.google.com/site/bloggertricksandtoolz/massegebox-jquery.js' type='text/javascript'/>

<script type='text/javascript'>
$(document).ready(function(){
$(&quot;.close&quot;).click(function(){
$(&quot;#info&quot;).animate({left:&quot;+=10px&quot;}).animate({left:&quot;-5000px&quot;});
});
blink();
});
function blink(){
$(&quot;#info&quot;).fadeOut(800).fadeIn(800).fadeOut(400).fadeIn(400).fadeOut(400).fadeIn(400);
}
function nudge(){
$(&quot;#info&quot;).animate({left:&quot;+=5px&quot;},20).animate({top:&quot;+=5px&quot;},20).animate({top:&quot;-=10px&quot;},20).animate({left:&quot;-=10px&quot;},20)
.animate({top:&quot;+=5px&quot;},20).animate({left:&quot;+=5px&quot;},20)
.animate({left:&quot;+=5px&quot;},20).animate({top:&quot;+=5px&quot;},20).animate({top:&quot;-=10px&quot;},20).animate({left:&quot;-=10px&quot;},20)
.animate({top:&quot;+=5px&quot;},20).animate({left:&quot;+=5px&quot;},20);
}
</script>



<style type='text/css'>

#info{
border: 1px solid;
margin: 0px 0px;
padding:5px 5px 15px 5px;
background-repeat: no-repeat;
background-position: 10px center;
position:relative;
color: #00529B;
background-color: #BDE5F8;
background-image: url(&#39;info.png&#39;);
}

</style>

4.Scroll down to where you see <data:post.body/> tag.

5.Copy below code and paste it just after <data:post.body/>.

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div style="" id="info"> YOUR MASSAGE HERE <a href="#" class="close"> CLOSE !</a></div>

</b:if>

Note: Replace YOUR MASSAGE HERE with your text.

6.Now click "Save template" your are done.

Cheers

written By : bagas wahyu Tutorials Blogspot

Buddy was reading an article about How To Add Message Box Like Wordpress With Close Button .By Admin, buddy allowed to copy and paste or distribute this article, but do not forget to put the source link below <a href="http://tutorials1927.blogspot.com/2012/12/how-to-add-message-box-like-wordpress.html" target="_blank">How To Add Message Box Like Wordpress With Close Button </a>

:: Get this widget ! ::

Share:

• Tweet

Related

How To Add Message Box Like Wordpress With Close Button