Konuyu Oyla:
  • Toplam: 0 Oy - Ortalama: 0
  • 1
  • 2
  • 3
  • 4
  • 5
MyBB açılır kapanır sağ blok (sidebar) [Modifikasyon]
#1
Lightbulb 
Bu modifikasyon sayesinde ana sayfaya açılır kapanır sağ blok(sidebar) eklenecektir. Diğer yapılan sağ bloklardan en önemli farkları; açılır kapanır olması, animasyonlu olması, sayfa yenilendikten sonra seçili ayarın hatırlanması ve plugine ihtiyaç duyulmaması.
Farklı bir sitede paylaşırken yapımcı ismi belirtmenizi rica ediyorum, örn: Modifikasyon Yapımcısı: Novruz.

Admin KP > Temalar ve şablonlar > Şablonlar > Kullandığınız temanın şablon seti > Ana sayfa şablonları > index aşağıdaki kodu bu bulun;
PHP Kod:
{$forums

aşağıdaki kod ile değiştirin.
PHP Kod:
<div class="layout">
        <
div class="layout_main">{$forums}</div>
         <
div class="layout_sidebar">
 
  <div class="layout_sidebar-inner">
             
             <
table border="0" cellspacing="0" cellpadding="5" class="tborder denemetb" id="denemetb">
<
thead>
<
tr>
<
td class="thead" colspan="5">
<
div class="expcolimage"><img src="{$theme['imgdir']}/collapse.png" id="cat_reklam_img" class="expander" alt="[-]" title="[-]" /></div>
<
div><strong>Reklam Alanı</strong></div>
</
td>
</
tr>
</
thead>
<
tbody style="" id="cat_reklam_e">
<
tr>
<
td class="trow1" align="center">
<
img src="http://lorempixel.com/90/90/" title="">
<
img src="http://lorempixel.com/90/90/" title="">
<
img src="http://lorempixel.com/90/90/" title="">
<
img src="http://lorempixel.com/90/90/" title="">
<
img src="http://lorempixel.com/90/90/" title="">
<
img src="http://lorempixel.com/90/90/" title=""></td>
</
tr>
</
tbody>
</
table>
</
div>
</
div>
</
div

Admin KP > Temalar ve şablonlar > Şablonlar > Kullandığınız temanın şablon seti > Ana sayfa şablonları > index > <body> tagının üstüne aşağıdaki kodu ekleyin.
PHP Kod:
    <script>
var 
indicator="";
        if(
document.cookie.indexOf("indicator")>-1){
                         
  indicator=document.cookie[document.cookie.indexOf("indicator")+10];
         
  }
var 
zaman=new Date();
zaman.setFullYear("2050");
var 
main document.getElementsByClassName("layout_main")[0];//forum
var sidebar document.getElementsByClassName("layout_sidebar")[0];//sidebar
function toggle(f){
    if(
indicator && indicator==1){
        
main.style.cssText="transition:none;width:100%";
        
sidebar.style.cssText="transition:none;width:0;opacity:0;"
    
}
    if(
f==&& indicator==){
        
main.style.cssText="width:75%;";
        
sidebar.style.cssText="width:24;opacity:1;";
        
document.cookie="indicator=2;expires="+zaman;
 
       indicator=document.cookie[document.cookie.indexOf("indicator")+10];
        return 
3;
    }
    if(
f==&& (indicator==|| !indicator)){
 
      console.log("indicator 2-dir");
 
      document.cookie="indicator=1;expires="+zaman;
        
main.style.cssText="width:100%;transition: width 500ms ease .5s;";
        
sidebar.style.cssText="width:0;opacity:0;transition: opacity .5s ease 0s, width .5s ease .5s";
 
       indicator=document.cookie[document.cookie.indexOf("indicator")+10];
    }
}
toggle();
    </
script


Admin KP > Temalar ve şablonlar > Kullandığınız tema > global.css > Gelişmiş düzenleme aşağıdaki kodları en alta ekleyin.
PHP Kod:
.layout {
    
displayflex;
    
justify-contentspace-between;
}

.
layout_main {
    
width75%;
    
transitionwidth 500ms ease 0s;
}

.
layout_sidebar {
    
width24%;
    
margin-bottom1.6%;
    
transitionopacity .5s ease .5swidth .5s ease 0s;
}

.
layout_sidebar-inner {
    
positionsticky;
    
top1%;


Aşağıdaki kod ise fonksiyonumuzu çalıştıracak butondur, Admin KP > Temalar ve şablonlar > Şablonlar > Kullandığınız temanın şablon seti > Ana sayfa şablonları > index şablonunda istediğiniz bölüme ekleye bilirsiniz.
PHP Kod:
<button type="button" onclick="toggle(3)">Sidebar aç/kapat</button

Önizleme;
GmVb2v.png
Ara
Cevapla PGM
#2
Eline sağlık.
Ara
Cevapla PGM
Teşekkür verenler:
#3
Emeğine sağlık başarılı
Ara
Cevapla PGM
Teşekkür verenler:
#4
Çerezlerin nasıl kullanılacağına dair detaylı anlatım yapan bir yer yada öneriniz var mı? Emeğinize sağlık hocam...
-ARCH
Lütfen "Rep Verbutonuna tıklayarak bizi değerlendirin.
Forum Organizatörü
Ara
Cevapla PGM
Teşekkür verenler:
#5
(23-04-2019 Saat: 12:59)NextWorld Nickli Kullanıcıdan Alıntı: Çerezlerin nasıl kullanılacağına dair detaylı anlatım yapan bir yer yada öneriniz var mı? Emeğinize sağlık hocam...

Teşekkürler, detaylı anlatım için kesin bir kaynak veremem fakat Udemy'de bir çok eğitim seti mevcut.
Ara
Cevapla PGM
Teşekkür verenler:
#6
Güncel.
Ara
Cevapla PGM
Teşekkür verenler:
#7
@Novruz üç tane div'i kapatmamışsın... şu ana kadar benden başka bu kodları kullanmaya girişen olmaması üzücü
Ara
Cevapla PGM
Teşekkür verenler:
#8
(25-08-2019 Saat: 17:46)Nihility Nickli Kullanıcıdan Alıntı: @Novruz üç tane div'i kapatmamışsın... şu ana kadar benden başka bu kodları kullanmaya girişen olmaması üzücü

Bildirdiğin için teşekkür ederim, bir zamanlar en çok aranan özellikti oysa.
1
Ara
Cevapla PGM
Teşekkür verenler:


Hızlı Menü:


Şu anda bu konuyu okuyanlar: 1 Ziyaretçi



***

Online Shopping App
Online Shopping - E-Commerce Platform
Online Shopping - E-Commerce Platform
Feinunze Schmuck Jewelery Online Shopping