Benzer Konular
Blogger sitenize çerezleri kullanan bir gece modu eklemenin imkansız olmadığını daha önce duymuş muydunuz? Evet, şaka değil: gerçekten de böyle bir şeyi yapmak mümkün.
Gece modu, nasıl eklenir?
İlk önce Blogger panelinden Tema alanına giriş yapın, daha sonra HTML'i düzenle tuşuna tıklayarak temanızın kod editörüne giriş yapın.
Yedek almayı unutmayın.
Daha sonra, CTRL+F kombinasyonu ile </body>kodunu aratın ve aşağıdaki kodu bu kodun üstüne ekleyin.
<div class='Switchbtn'>
<span class='nightly'>Night Mode</span> <input class='togglenight togglenight-switch' id='nightmode' type='checkbox'/>
<label class='togglenight-btn' for='nightmode'/></div>
<script type='text/javascript'>
//<![CDATA[
// Night Mode
$("#nightmode").click(function(){$("body").toggleClass("nightmode")}),$("body").toggleClass(localStorage.toggled),$("#nightmode").click(function(){"nightmode"!=localStorage.toggled?($("body").toggleClass("nightmode",!0),localStorage.toggled="nightmode"):($("body").toggleClass("nightmode",!1),localStorage.toggled="")});
//]]>
</script>Daha sonra aşağıda bulunan kodu </head> kodunun hemen üzerine ekleyin.
<style type='text/css'>
/* Night Mode */
.nightly{color:#999;font-size:13px}
.Switchbtn{position:fixed;text-align:center;display:inline-block;align-items:center;z-index:100;right:20px;top:20px}
.togglenight{display:none;}
.togglenight + .togglenight-btn{outline:0;display:inline-block;width:45px;height:10px;position:relative;cursor:pointer;margin-left:5px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
.togglenight + .togglenight-btn:after,.togglenight + .togglenight-btn:before{position:relative;display:block;content:"";width:50%;height:100%}
.togglenight-switch + .togglenight-btn{background:#d5d2fc;border-radius:99em;transition:all .4s ease}
.togglenight-switch + .togglenight-btn:after{content:'';border-radius:100px;background:#887fff;transition:left 0.3s cubic-bezier(0.175,0.885,0.32,1.275),padding 0.3s ease,margin 0.3s ease;position:absolute;width:20px;height:20px;top:-5px;left:0;box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23)}
.togglenight-switch:checked + .togglenight-btn{background:rgba(255,255,255,.15)}
.togglenight:checked + .togglenight-btn:after{content:'';left:55%;background:#ff9f43}
.nightmode{background:#202124;color:rgba(255,255,255,.7)}
.nightmode a{color:rgba(255,255,255,.7)!important}
.nightmode a:hover{color:rgba(255,255,255,.4)!important}
.nightmode .class-baru{}
.nightmode .class-baru{}
</style>Yapmanız gereken bütün işlem bu kadar kolay. Eğer aç/kapa tuşunun yerinden rahatsızsanız, aşağıdaki kodu bularak ve çeşitli düzenlemeler yaparak sitenize uygun hâle getirebilirsiniz. Tüm işlemleri bitirdikten sonra temayı kaydedin ve yeni sitenize göz atın.
.Switchbtn{position:fixed;text-align:center;display:inline-block;align-items:center;z-index:100;right:20px;top:20px}