معهد خبراء بلوجر - اضافه شريط عائم فوق رأس المدونة بشكل رائع

بسم الله الرحمن الرحيم

اشافه شريط عائم فوق رأس المدونة بشكل رائع

http://www10.0zz0.com/2012/07/27/23/745074142.jpg

معاينه الاضافه

قم بتحرير القالب الخاص بك مع اخد نسخه احتياطيه..
قم بالبحث عن

كود بلغة HTML:

<body>

ثم اضف تحته او ادناة الكود التالى :

كود بلغة HTML:

<!-- Notification code start --> <style type='text/css'> #ut-sticky { background: #7d7e7d; /* Old browsers */ background: -moz-linear-gradient(top,  #7d7e7d 6%, #7d7e7d 9%, #0e0e0e 99%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(6%,#7d7e7d), color-stop(9%,#7d7e7d), color-stop(99%,#0e0e0e)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top,  #7d7e7d 6%,#7d7e7d 9%,#0e0e0e 99%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top,  #7d7e7d 6%,#7d7e7d 9%,#0e0e0e 99%); /* Opera 11.10+ */ background: -ms-linear-gradient(top,  #7d7e7d 6%,#7d7e7d 9%,#0e0e0e 99%); /* IE10+ */ background: linear-gradient(top,  #7d7e7d 6%,#7d7e7d 9%,#0e0e0e 99%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-9 */  border-bottom:2px solid #999;  color:#fff; text-align: center; margin:-12px auto; padding-bottom:1px; border-top: 1px solid #333; height:38px; font-size:13px; position:fixed; vertical-align: baseline; overflow:hidden; z-index:999; width:100%; border-bottom-left-radius:6px; border-bottom-right-radius:6px; display:block; font-weight: bold; font-family: arial,&quot;Helvetica&quot;; font-color:#fff;  -moz-box-shadow: 0 2px 4px hsla(0,0%,0%,.35);  -webkit-box-shadow: 0 2px 4px hsla(0,0%,0%,.35); } #ut-sticky:hover {  background-color:#333;background-image:-moz-linear-gradient(top,#555555,#434343);background-image:-ms-linear-gradient(top,#555555,#434343);background-image:-webkit-gradient(linear,0 0,0 100%,from(#555555),to(#434343));background-image:-webkit-linear-gradient(top,#555555,#434343);background-image:-o-linear-gradient(top,#555555,#434343);background-image:linear-gradient(top,#555555,#434343);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#555555',endColorstr='#434343',GradientType=0)  -webkit-transition:all 1.3s ease-in-out;-moz-transition:all 1.3s ease-in-out;-o-transition-duration:all 1.3s ease-in-out;transition:all 1.3s ease-in-out;   -moz-box-shadow: 0 2px 4px hsla(0,0%,0%,.35);  -webkit-box-shadow: 0 2px 4px hsla(0,0%,0%,.35);  }  #ut-button {background:#fff; padding:4px; color:black;text-shadow:0 -1px 0 rgba(255,255,255,0.25);background-color:white}  #ut-sticky p{line-height:5px; font-size:13px; text-align:center; width:95%; float:left;} #ut-sticky p a{ text-decoration:underline; padding:4px; color:#FFFF33;} .ut-cross{display:block; position:relative; right:15px; top:4px;float:right;} .ut-cross a{font-size:18px; font-weight:bold; font-family:&quot;Arial&quot;; color:#FF0000; line-height:30px;} .ut-cross, a:hover{color:#DDD; text-decoration:none;}  </style> <div id='ut-sticky'> <p style='padding-top:17px;'>كتابة ما تريد هنا  <a class='ut-button' href='http://arabianblog.blogspot.com/' target='_blank'>Click Here!</a></p> <div class='ut-cross'><a href='javascript:hide_cross();'>X</a></div> </div> <script language='JavaScript'> function hide_cross() { crosstbox = document.getElementById(&quot;ut-sticky&quot;); crosstbox.style.visibility = 'hidden'; } </script> <br/><br/> <br/><br/> <!-- End of Notification code, info - http://www.allbloggingtips.com -->

ثم قم بتغيير الرابط برابط مدونتك والاعلان التى تريدة