حصريا طريقة إضافة شريط ثابت أعلى المدونة بشكل جذاب stick bar

كثيرا ما نصادف في مدونات ومواقع كثيرة شريطا ثابت لا يختفي حتى وإن
نزلنا أسفل الصفحة أو غيرنا الصفحة
صراحة هذه الإضافة رائعة جدا وتثير الإنتباه
حيث أن الزائر أثناء تصفحه لمدونتك يظل يرى الشريط
إذا الرسالة التي يتضمنها الشريط ستصل للزائر بشكل كبير ومتكرر
وتجعل الزائر يزور الرابط المتضمن في الرسالة سواء كان رابط لصفحة فيسبوك
أو تويتر أو جووجل بلس أو أي رابط آخر
هذه الإضافة حصرية علي شار ولا يحق نقلها دون ذكر المصدر
احتراما وتقديرا لمجهود الكاتب الأصلي
ـــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــ
مثال عن الإضافة:

ـــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــ
الشرح
نذهب إلى:
تصميم|تحرير HTML|توسيع القالب|Ctrl+F
ـــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــ
نبحث عن الكود التالي:

]]></b:skin>

قبله مباشرة نلصق هذا الكود:

#mbt-stickybar{
background:#0080ff url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHHATHartbPzdrFmhm55fVPQCV9LNutN2EgiajrrUqTCFwxABVPjHxXdG9EPP0fqg0wgjPiERz4ieSxaT9jwxt2yxXkcDpDoisBIhtbPRZPJCF6u4E-MQ98rPeyoSfhd6D0WoU670mmJc/s400/stickybar.png') repeat-x;
width:100%;
margin:0 auto;
text-align:center;
padding:0px 0;
border-bottom: 1px solid #888888;
-moz-box-shadow: #666666 0px 1px 3px;
-webkit-box-shadow: #666666 0px 1px 3px;
box-shadow: #666666 0px 1px 3px;
z-index: 999;
height: 28px; position:fixed;
line-height: 1.85em;
vertical-align: baseline;
letter-spacing: 1px;
}
#mbt-stickybar a{
text-decoration:none;
color:#fff;
font-size:13px;
font-weight:bold;
font-family: arial,"Helvetica",sans-serif;
line-height: 24px;
}
#mbt-stickybar a:hover{
text-decoration:underline;
}
#mbt-stickybar p {margin:0; list-style:none;}
#mbt-stickybar img {vertical-align: middle;
margin-right: 6px;}

لتغيير لون خلفية الشريط يكفي تغيير هذا الكود #0080ff بكود اللون الذي تريد
ـــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــ
نتابع
نبحث عن هذا الكود

<body>

بعده مباشرة نضع التالي:

<div id='mbt-stickybar'>
<img src='رابط الصورة'/><a href='الرابط'>النص أو الرسالة </a>
</div>

رابط الصورة:إذا أردت أن تظهر صورة ما في الشريط بشرط أن تكون أبعادها صغيرة مثل 28*28
الرابط:الرابط الذي تريد أن يتحول إليه الزائر عند النقر عليه
النص أو الرسالة:أكتب رسالتك أو أي شيء تريده
ـــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــ
تذكير ليس لك الحق في نقل الموضوع دون ذكر المصدر احتراما وتقديرا لمجهودات الكاتب الأصلي
تحياتي