U3F1ZWV6ZTI4MjEzNTA0NTM5MDc0X0ZyZWUxNzc5OTUxODMwOTIxNg==

طريقة اضافة زر الوضع الليلي لمدونات بلوجر 2021 | عائلة التكنولوجيا

 طريقة اضافة زر الوضع الليلي لمدونات بلوجر 2021 

بسم الله الرحمن الرحيم و الصلاة و السام علي اشرف الخلق و المرسلين نبينا محمد وعلي اله و اصحابه اجمعين ...



طريقة اضافة زر الوضع الليلي لمدونات بلوجر 2021


بعض الناس يعانون من الضوء الابيض او الضوء الفاتح بسبب ما يسببه من تعب للعيون ذلك يستخدمون دائما الوضع المظلم

 DARK MODE  حيث ان هذا الوضع مريح للعيون وبما ان الكثير من الناس يدخلون الي المواقع وسرعان ما يخرجون حيث انهم لا يستوعبو ضوء الوضع النهاري  لذلك يجب وضع زر الدارك مود  او زر الوضع الليلي لجعل المستخدمين لا يخرجون من الموقع وفي نفس الوقت تلبية احتياجاتهم ولذلك قررنا شرح طريقة اضافة زر الوضع الليلي في مدونات بلوجر 2021 و الطريقة سهلة جدا ويمكن لاي حد تنفيذها وسوف نقوم بشرح الاتي :

1- طريقة التعديل علي كود HTML لاضافة الاكواد الخاصة بالوضع الليلي او وضع الظلام 


2- الحصول علي الاكواد المستخدمة واضافة الاكواد لتفعيل زر الوضع الليلي 


3- مكان وضع الزر المناسب للوضع الليلي او وضع الظلام 


الشرح :

1- طريقة التعديل علي كود HTML لاضافة الاكواد الخاصة بالوضع الليلي او وضع الظلام 

1.  قم بالذهاب  الي لوحة التحكم بلوجر ثم اختار المظهر ثم اضغط علي تعديل Html


2. ابحث عن وسم ]]></b:skin> (للبحث بسهولة اضغط علي Ctrl + f ثم الصق الكود) ثم الصق الكود التالي فوقة 

مباشرة

/* عائلة التكنولوجيا : الوضع اليلي بواسطة */ .malam{background:#333;transition:all .3s} .arlina-nav .share-box button{border:0;background:transparent;cursor:pointer;transition:all .3s} .arlina-nav .share-box button:hover{color:#e74c3c} .malam .arlinatotop{background:rgba(255,255,255,0.15);color:rgba(255,255,255,0.85)} .malam .arlinatotop:hover{background:rgba(255,255,255,0.25);color:rgba(255,255,255,1)}

3. ابحث عن وسم  </body> والصق الكود الثالي فوقه مباشرة



<script class='java' type='text/javascript'> //<![CDATA[ $(document).ready(function(){$("button.tombol-malam").click(function(){$("body").toggleClass("malam")})}); //]]> </script>

4. قم باضافة الكود التالي في المكان الذي تريد ان يظهر فية الزر. وليكن تريد ان تضعه اعلي المدونة كل ماعليك هو ان تضع الكود اسفل الكود <Head>


<button class='tombol-malam' title='الوضع الليلي'><i class='fa fa-toggle-on'></i></button>








مقالات اخري :










 




تعليقات
ليست هناك تعليقات
إرسال تعليق

إرسال تعليق

الاسمبريد إلكترونيرسالة