كيفية تغير شكل ولون وعرض شريط التمرير scrollbar في بلوجر

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

السلام عليكم ورحمة الله

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

كيفية تغير شكل ولون وعرض شريط التمرير scrollbar في بلوجر


ما هي الخطوات؟

1- تذهب إلى بلوجر من ثم المظهر من ثم السهم الذي بجانب التخصيص من ثم تعديل HTML
2- تنسخ هذا الكود

::-webkit-scrollbar {
  width: 15px;
}
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px grey; 
  border-radius: 10px;
}
::-webkit-scrollbar-thumb {
  background: #ffbc00; 
  border-radius: 10px;
}

3- تضغط crtl+f ليظهر لك مربع البحث من ثم تبحث عن هذا الوسم

]]></b:skin>
وبعدها تضع الكود السابق فوق هذا الكود كما في الصورة وتضغط حفظ القالب

كيفية تغير شكل ولون وعرض شريط التمرير scrollbar في بلوجر


كيفية تغير العرض واللون؟

أما العرض فهي التعليمة

width: 15px;

فقط غير الرقم 15 فإذا جعلته 16 أو 17 ..إلخ سيزداد العرض والعكس صحيح
وأما بالنسبة لتغير اللون فهي التعليمة

background: #ffbc00;

فقط غير الكود الذي باللون الأحمر باللون الذي تريده وهناك موقع لتختار منه الألوان التي تعجبك ثم تنسخ الكود الخاص به وتستبدله ورابط الموقع

https://www.color-hex.com

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

كيفية تغير شكل ولون وعرض شريط التمرير scrollbar في بلوجر

فإذا لم تفهم فقد شرحت كل هذا في فيديو على اليوتيوب ورابطه

إرسال تعليق