MyBB Gece Modu Özelliği Yapma / MyBB Gece Modu Butonu Yapma
Bu Modifakasyon Sayesinde MyBB Sitenize gece modu özelliği yapabilirsiniz
Modifakasyon Yapımcısı ;Nevruz
İşlemlere geçelim
Admin KP » Temalar ve şablonlar » Şablonlar » Kullandığınız temanın şablon seti » Headerinclude - [Gruplandırılmamış] Şablonlar » headerinclude » Şablonunu açın..
Aşağıdaki kodu kodu bulun;
Bulduktan sonra hemen üst kısmına şu kodları ekleyin..
Buradaki işlem bu kadardır. Kaydedip kapatın sonraki işleme geçelim.
Admin KP » Temalar ve şablonlar » Kullandığınız tema » global.css » Gelişmiş düzenleme » dedikten sonra aşağıdaki kodları en alt kısıma ekleyin.
Buradaki işlemde bitti kaydedip kapatın. şimdi en son işelme kaldı Gece modu botonunu ekleyeceğiz..
Admin KP » Temalar ve şablonlar » Şablonlar » Kullandığınız temanın şablon seti » Header Şablonlar » header Şablonunu açın..
Şu kodu bulun;
bulduktan sonra altına ekleyin
Buradaki işlemde bu kadardır eğer bu Gece Modu botununu siz nerede görünmesini istiyorsanız orayada ekleyebilirsiniz size kalmış..
Son olarak eğer kullanıcılarınızın gece saatlerinde sitenizde otomatik olarak gece modunda kullanmasını istiyorsanız yukarıdaki headerinclude şablonuna eklediğiniz kodları aşağıdaki kodlarla değiştirin.
Bu Modifakasyon Sayesinde MyBB Sitenize gece modu özelliği yapabilirsiniz
Modifakasyon Yapımcısı ;Nevruz
İşlemlere geçelim
Admin KP » Temalar ve şablonlar » Şablonlar » Kullandığınız temanın şablon seti » Headerinclude - [Gruplandırılmamış] Şablonlar » headerinclude » Şablonunu açın..
Aşağıdaki kodu kodu bulun;
Kod:
{$stylesheets}Bulduktan sonra hemen üst kısmına şu kodları ekleyin..
Kod:
<script>(function(window, document, undefined) {
'use strict';
if (!('localStorage' in window)) return;
var nightMode = localStorage.getItem('gmtNightMode');
if (nightMode) {
document.documentElement.className += ' night-mode';
}
})(window, document);
document.addEventListener('DOMContentLoaded',function() {
'use strict';
// Feature test
if (!('localStorage' in window)) return;
var nightMode = document.querySelector('#night-mode');
if (!nightMode) return;
// When clicked, toggle night mode on or off
nightMode.addEventListener('click', function (event) {
event.preventDefault();
document.documentElement.classList.toggle('night-mode');
if ( document.documentElement.classList.contains('night-mode') ) {
localStorage.setItem('gmtNightMode', true);
return;
}
localStorage.removeItem('gmtNightMode');
}, false);
});</script>Buradaki işlem bu kadardır. Kaydedip kapatın sonraki işleme geçelim.
Admin KP » Temalar ve şablonlar » Kullandığınız tema » global.css » Gelişmiş düzenleme » dedikten sonra aşağıdaki kodları en alt kısıma ekleyin.
Kod:
night-mode body{
background-color: #14191e
}
.night-mode #content{
background-color: #14191e;
color: #eee
}
.night-mode #logo{
background-color:#14191e
}
.night-mode #logo a{
color:#eee
}
.night-mode .trow1, .night-mode .trow2{
background-color: #14191e;
border-color: #14191e;
color:#eee
}
.night-mode .trow1 a, .night-mode .trow2 a{
color: #eee
}Buradaki işlemde bitti kaydedip kapatın. şimdi en son işelme kaldı Gece modu botonunu ekleyeceğiz..
Admin KP » Temalar ve şablonlar » Şablonlar » Kullandığınız temanın şablon seti » Header Şablonlar » header Şablonunu açın..
Şu kodu bulun;
Kod:
{$awaitingusers}bulduktan sonra altına ekleyin
PHP Kod:
<button type="button" id="night-mode">Gece Modu</button>
Buradaki işlemde bu kadardır eğer bu Gece Modu botununu siz nerede görünmesini istiyorsanız orayada ekleyebilirsiniz size kalmış..
Son olarak eğer kullanıcılarınızın gece saatlerinde sitenizde otomatik olarak gece modunda kullanmasını istiyorsanız yukarıdaki headerinclude şablonuna eklediğiniz kodları aşağıdaki kodlarla değiştirin.
Kod:
<script>(function(window, document, undefined) {
'use strict';
if (!('localStorage' in window)) return;
var nightMode = localStorage.getItem('gmtNightMode');
if (nightMode) {
document.documentElement.className += ' night-mode';
}
})(window, document);
document.addEventListener('DOMContentLoaded',function() {
'use strict';
// Feature test
if (!('localStorage' in window)) return;
var nightMode = document.querySelector('#night-mode');
if (!nightMode) return;
// When clicked, toggle night mode on or off
nightMode.addEventListener('click', function (event) {
event.preventDefault();
document.documentElement.classList.toggle('night-mode');
if ( document.documentElement.classList.contains('night-mode') ) {
localStorage.setItem('gmtNightMode', true);
return;
}
localStorage.removeItem('gmtNightMode');
}, false);
});</script>
![[-]](https://www.forumteams.com/images/collapse.png)
