Blogger Themes

Wednesday, 21 September 2011

>How to make announcements to your blogger blog

> 

Hi guys

Have u ever wanted to make some important announcements like a post that is very important ?

Well it is possible in a closeable-jquery-floating-message-box

This is also closeable



 

So this is from techtasks.net

So the post is from it i would like to thank him

so

Here is what u have to do

Step 1:Login to Blogger dashboard » layout » Edit HTML

Find(CTRL+F) ]]</b:skin>tag.

Now copy and paste below code just before ]]</b:skin> this.



 

/*----------Begin TechTasks Message Box CSS--------------*/

 

#TT_float_box_top {

background: none repeat scroll 0 0 #E1F0FF;

border: 1px solid #0080FF;

border-radius: 0 0 20px 20px;

font-weight: bold;

padding: 1px;

position: absolute;

text-align: center;

top: 0;

width: 99%;

left: 5px;

right: 5px;

}

#TT_close_box_t

{

float:right;

cursor:pointer;

padding: 10px 10px 0px 0px;

}

/*----------End TechTasks Message Box CSS--------------*/


 

 

Step 2:Find </head> .

 

Cope and paste the below just before </head> this.

 


<script src='http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.4.js' type='text/javascript'/>

<script type='text/javascript'>

/*----------Start TechTasks Message Box Script--------------*/

$(document).ready(function()

{

$(window).scroll(function()

{

$('#TT_float_box_top').animate({top:$(window).scrollTop()+"px" },{queue: false, duration: 350});

});

$('#TT_close_box_t').click(function()

{

$('#TT_float_box_top').animate({ top:"+=15px",opacity:0 }, "slow");

});

});

/*----------End TechTasks Message Box Script--------------*/

</script>


 

Step 3:Finally find the </body>

 

Now copy and paste below code just above the </body>.

 


<div id='TT_float_box_top'>

Your Msg Goes Here

<img id='TT_close_box_t' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgz1e6orhPgDoAxtQCq4S2Dvm30D8zZ-isu9fiiDs3SWuPe0XPbmAxzl-lqLwg1ZetTcThhKHA6EyOShRQXfqn5MXB_vOabB_oAsS0m1ADn7kkOxcyjw1WwfEe4nhsAXkSepVARbdi0tY4/s288/DeleteRed.png'/>

</div>




So thanks for viewing and please comment !!

Share on :

1 comments:

ratownik medyczny said...

I appreciate, cause I found exactly what I was looking for. You've ended my four day long hunt! God Bless you man. Have a great day. Bye

Post a Comment

 
© Copyright TechRio 2011 - Some rights reserved | Powered by Blogger.com.
Template Design by Herdiansyah Hamzah | Published by Borneo Templates and Theme4all