راسلنا من خلال النمودج التالي :

الاسم

بريد إلكتروني *

رسالة *

أكتب ما تود البحث عنـه .....

إعلان
إعلان

آخر الأخبار

شرح لطريقة تركيب الوضع الليلي لقوالب البلوجر الشكل الثالث



اقدم لكم شرح لطريقة تركيب الوضع الليلي الشكل الثالث

هذه الاضافة يمكن تثبيتها في المكان اللذي تراه مناسب 
تبقى بشكل ثابت بالمكان اللذي وضعته به
لا تنزل و تصعد بنزول الصفحة و صعودها


تركيب الاضافة


نذهب الى المظهر و نضغط على Ctrl + F و نضع في مستطيل البحث /head و نضغط على Enter
نضع الكود التالي فوقه





<style type='text/css'>
/*<![CDATA[*/
/*=====================================
=  button Dark Mode
=====================================*/
.switch-mode{display:inline-block;margin:0 0 0 10px;background:transparent;min-width:180px;height:40px;line-height:40px;padding:0 15px;z-index: 999999;top: -24px;left: 205px;float: left;position:relative}
.switch-mode #switch-mode{display:inline-block;width:40px;height:6px;background:#1a1c25;border-radius:3px;position:relative;top:1.5px; float: left;cursor:pointer}
.switch-mode #switch-mode .switch-button{width:14px;height:14px;display:block;background:#eb1111;position:absolute;top:-5px;left:0;border-radius:100%}
.switch-mode #switch-mode.active .switch-button{background:#0ca71b;left:auto;right:0}
/*=====================================
=  body Dark Mode == ضع اكواد التنسيق اسفل التعليق هذا
=====================================*/
/* هذه في الوضع اليلي*/
.dark-mode #outer-wrapper{color: silver;background-color: #222425;}
.dark-mode #footer-wrapper{color: silver;background-color: #222425;}
.dark-mode #header-wrapper{color: silver;background-color: #222425;}
.dark-mode #label_with_thumbs, .index .post, .item .post, .home-ad{background-color: #222425;}




/*]]>*/
</style>



طريقة التطبيق على اي قسم تختاره


تقوم بنسخ هذا الكود و تلصقه اسفل /* هذه في الوضع اليلي*/

.dark-mode #outer-wrapper{color: silver;background-color: #222425;}

و تقوم بالتعديل على ال ايدي الخاص بالقسم اللذي تريد التطبيق عليه



نضع في مستطيل البحث  </body>  و نضغط على Enter
نضع الكود التالي فوقه


<script type='text/javascript'>//<![CDATA[!function(a){"function"==typeof define&&define.amd?define(["jquery"],a):a("object"==typeof exports?require("jquery"):jQuery)}(function(a){function b(a){return h.raw?a:encodeURIComponent(a)}function c(a){return h.raw?a:decodeURIComponent(a)}function d(a){return b(h.json?JSON.stringify(a):String(a))}function e(a){0===a.indexOf('"')&&(a=a.slice(1,-1).replace(/\\"/g,'"').replace(/\\\\/g,"\\"));try{return a=decodeURIComponent(a.replace(g," ")),h.json?JSON.parse(a):a}catch(b){}}function f(b,c){var d=h.raw?b:e(b);return a.isFunction(c)?c(d):d}var g=/\+/g,h=a.cookie=function(e,g,i){if(void 0!==g&&!a.isFunction(g)){if(i=a.extend({},h.defaults,i),"number"==typeof i.expires){var j=i.expires,k=i.expires=new Date;k.setTime(+k+864e5*j)}return document.cookie=[b(e),"=",d(g),i.expires?"; expires="+i.expires.toUTCString():"",i.path?"; path="+i.path:"",i.domain?"; domain="+i.domain:"",i.secure?"; secure":""].join("")}for(var l=e?void 0:{},m=document.cookie?document.cookie.split("; "):[],n=0,o=m.length;o>n;n++){var p=m[n].split("="),q=c(p.shift()),r=p.join("=");if(e&&e===q){l=f(r,g);break}e||void 0===(r=f(r))||(l[q]=r)}return l};h.defaults={},a.removeCookie=function(b,c){return void 0===a.cookie(b)?!1:(a.cookie(b,"",a.extend({},c,{expires:-1})),!a.cookie(b))}});$(document).ready(function(){$.cookie("dark-mode")?($("#switch-mode").addClass("active"),$("body").addClass("dark-mode")):($("body").removeClass("dark-mode"),$("#switch-mode").removeClass("active")),$("#switch-mode").on("click",function(){$.cookie("dark-mode")?$.removeCookie("dark-mode",{path:"/"}):$.cookie("dark-mode","yes",{expires:360,path:"/"}),location.reload()})});//]]></script>


نضع الزر في المكان المناسب مثلا فوق رسائل المدونة الالكترونية


<div class="switch-mode">
<div id="switch-mode">
<div class="switch-button">
<span></span></div>
</div>
</div>



و قم بالحفظ و مبروك عليك الأضافة

عبدو تكنولوجي

hala teck
الكاتب : MAHER

مدون عربي صاحب مدونة هلا تك يهتم بكل جديد بعالم التقنية و المعلومات

شارك الموضوع
تعليقات
إعلان