4/15/2018

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

مرحبا ! موضوع اليوم هو طريقة اضافة الوضع الليلي لمدونات بلوجر عن طريق الغاء الوضع النهاري ( ابيض ) , ان الوضع العادي او نهاري يؤثر سلبيا على متصفحي مدونتك او موقعك , حيث ان الكثير من الناس تفضل ميزة الوضع الليلي في التطبيقات و المواقع للحفاض على البصر لان شدة اضائة تكون قوية بالنسبة لون ابيض اما الون الاسود فهي ضعيفة و لاتاثر على البصر لهذا قمت بكثابة هذه تدوين حول اضافة الوضع الليلي لمواقع و مدونات بلوجر.

اضافة الوضع اليلي لمدونات بلوجر mode light

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

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

  1. توجه الى لوحت تحكم بلوجر ثم اختر قالب.
  2. تحريرhtml.
  3. ابحث الان عن   ]]></b:skin> ثم اضف كود التالي فوقه ( استعن باختصار CTRL+F للبحث )

/* tharabic.com  : الوضع اليلي بواسطة */
.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)}

الان قم بالبحث عن   </body> و اضف الكود التالي فوقه :

<script class='java' type='text/javascript'>
//<![CDATA[
$(document).ready(function(){$("button.tombol-malam").click(function(){$("body").toggleClass("malam")})});
//]]>
</script>
و في المرحلة الاخيرة مكان وضع ايقونة الوضع اليلي اي المكان الدي تريد ان تضهر فيه ايقونة يمكنك وضعها فيه
افضل مكان لوضع ايقونة هو بجانب اقسام المدونة على اليسار لكن الامر يعود لك حيث يمكنك وضعها اينما تريد  و لوضع ايقونة قم بتحديد المكان مثلا بجانب اقسام اضف الكود الاحمر بجانب تسميات في الاخير كالتالي :

<li><a href='#'><i class='fa fa-gamepad'></i> العاب </a></li>
<li><a href=''><i class='fa fa-html5'></i> قوالب </a></li>
<li><a href=''><i class='fa fa-cogs'></i> اضافات </a></li>
// الكود الخاص بالوضع اليلي
<button class='tombol-malam' title='الوضع الليلي'><i class='fa fa-toggle-on'></i></button>

وفي الاخير اتمنا ان تعجبك الاضافة و لتنسنا دعمنا بالانضام لنا و بالتوفيق


لا تنسا ان تكن من أعضاء المدونة من هنا , إذا واجهتك اي مشكلة لا تترد فى ترك تعليق

اضف تعليقك