تغيير شكل شريط التمرير لشكل احترافي وجذاب لمدونات بلوجر

كتب Sanad Nabil اخر تعديل أكتوبر 20, 2019

تغيير شكل شريط التمرير لشكل احترافي وجذاب لمدونات بلوجر

Advertisements

اضافه رائعه جدا لتغيير شكل السكرول بار أو شريط التمرير لشكل احترافي وانيق لمدونات بلوجر عزيزى الزائر الكريم وهذه الاضافه لا تقم بتبطئ التصفح لمدونتك أو ثقل في التحميل فهي 100% سريعه ولأنها مصممه بال css فالجميع يعلم أن مظهر المدونه يجذب الزوار لتصفحها وأيضا التعلق بها وهذا لايعني أن تقوم بوضع اضافات كثيره جدا تجعل الزائر يهرب من كثر وقت التحميل وبطي التصفح

شاهد أيضا

حل مشكلة تعدد النطاقات فى بلوجر وتحويل الروابط

اضافة أداه مواضيع ذات صله بشكل راقى لبلوجر

دعونا لا نتكلم كثيرا و لنذهب مباشرة لتركيب الاضافه فاذا كنت ترغب فى تغيير شكل السكرول بار أدخل على هذا الرابط من خلال الضغط على معاينه من فضلك

معاينة

تغيير شكل السكرول بار

يمكن تغيير شريط التمرير عزيزى المتابع أو السكرول بار بشكل احترافى وممتاز لمدونات بلوجر بعدة طرق تابع معى شرح طريقة التركيب كما يلى

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

قم بتحرير قالب Html
استخدم Ctrl + F وقم بالبحث عن]]></b:skin>
قم بوضع الكود التالي فوقه اي قبله

/*start bar by tapseet.com*/
::-webkit-scrollbar { background:#e1e1e1; width:15px;}
::-webkit-scrollbar-thumb {
-webkit-shadow:inset 0 0 6px rgba(0,0,0,0.5);
background:#00AFFF;
}
::-webkit-scrollbar-track {
-webkit-shadow:inset 0 0 6px rgba(0,0,0,0.3);
-webkit-border-radius:30px;
}
::-webkit-scrollbar-thumb:hover {background:#0096DC;}
::-webkit-scrollbar-thumb:active {background:#007EC1;}
::-moz-scrollbar { background:#e1e1e1; width:15px;}
::-moz-scrollbar-thumb {
-moz-shadow:inset 0 0 6px rgba(0,0,0,0.5);
background:#00AFFF;
}
::-moz-scrollbar-track {
-moz-shadow:inset 0 0 6px rgba(0,0,0,0.3);
}
::-moz-scrollbar-thumb:hover {background:#0096DC;}
::-moz-scrollbar-thumb:active {background:#007EC1;}
::-o-scrollbar { background:#e1e1e1; width:15px;}
::-o-scrollbar-thumb {
-o-shadow:inset 0 0 6px rgba(0,0,0,0.5);
–
background:#00AFFF;
}
::-o-scrollbar-track {
-o-shadow:inset 0 0 6px rgba(0,0,0,0.3);
-o-border-radius:30px;
}
::-o-scrollbar-thumb:hover {background:#0096DC;}
::-o-scrollbar-thumb:active {background:#007EC1;}
/*End bar by tapseet.com*/