حصريا اضافة شريط ترحيبي الى البلوجر بتفنية CSS

الكاتب : Jzairi Web

بتاريخ : 4:02 م

عدد التعليقات : 10

طريقة اضافة شريط ترحيبي الى البلوج هي طريقة جميلة جدا ولقد أظهرت على جودة وفعالية كبيرة في دورها في حين يمكنك استعماله على سبيل المتال بالترحيب بزوار مدونتك او استعمالعها كااشعار الخ , ولقد تلقيت طلبات كثيرة من أجل إضافة هده الاداة الجميلة ,و الان اقول لكم انه يمكنك زيادة اتقانك مجال تطوير مدونتك والطريقة سهلة جدا فقط اتبع الخطوات اسفله .

شرح طريقة التركيب :

ادخل الى القالب تحرير HTML
فوق هذا الوسم <b:skin/> نضع الكود التالي

/* CSS welcome Bar */ #welcomejazairiweb_bar{width:auto;height:auto;display:block;text-align:center;line-height:1.6em;padding:8px 20px;background:#FF0000;color:#fff;position:relative;margin:0 auto 10px 0;font-weight:normal;border-radius:2px;margin-top: 10px;} #welcomejazairiweb_bar a{background:#fff;color:#3498db;padding:2px 6px;border-radius:4px;margin-left:5px} #close_welcomejazairiweb_bar {background:#34495E;border-left: double;display:inline-block;cursor:pointer;padding:8px 15px;position:absolute;top:0px;right:0;font-weight:bold;font-size:25px;border-radius:0 3px 3px 0;}

بعد دلك اضف الكود التالي فوق هدا الوسم <body/>

<script type='text/javascript'> // Welcome bar var button=document.querySelector("#close_welcomejazairiweb_bar");button.addEventListener("click",function(){var t=document.querySelector(button.getAttribute("data-target"));t.style.display="none"==t.style.display?"block":"none"});</script>

اضف الكود التالي في المكان الدي تريد ان تضهر فيه الاضافة

<div id='welcomejazairiweb_bar'>هدا فقط مثال من موقع جزائري ويب ,قم بتغيره <span data-target='#welcomejazairiweb_bar' id='close_welcomejazairiweb_bar'>×</span></div>

حصريا اضافة شريط ترحيبي الى البلوجر بتفنية CSS

PUB

اعضاء الموقع

اشترك بالقناة:

تدوينات آخر 30 يومًا

أقسام الموقع