Jako, że nie wszyscy potrafią zainstalować to poprawnie i mają problem z zastosowaniem tego dla wielu stylów, opiszę jak poprawnie zainstalować ową modyfikacje.
1. Pobieranie modyfikacji
wchodzimy, logujemy się i pobieramy: http://www.vbulletin.org/forum/showthread.php?t=175687
omówiona jest instalacja [AJAX] Tabbed Forum Home version 1.5.0 (BETA)
2. Instalacja
Wrzucamy na serwer pliki:
ajaxtabs.js - clientscript/tabs/
loading.gif - clientscript/tabs/
tabforumhome.php - /
ajaxtabs.css - clientscript/tabs/ - NIE WRZUCAMY
ACP>Style Manager> EDIT Template > FORUMHOME
Znajdz:
Przed dodaj:
Kod:
<!-- Tabbed Forum Home Header Code -->
<script type="text/javascript" src="/clientscript/tabs/ajaxtabs.js"> </script>
<!-- /Tabbed Forum Home Header Code -->
Znajdź:
Skopiuj wszystko między <!-- main --> a <!-- /main --> i zapisz w dowolnym edytorze.
Następnie to co skopiowałeś w FORUMHOME zamień na
Kod:
<!-- main -->
<!-- Tabbed Forum Home -->
<div id="ajaxTFH" class="TFHmenu2">
<ul>
<li class="selected"><a href="tabforumhome.php?tabcat[]=1" rel="ajaxTFHcontentarea">TAB 1 NAME</a></li>
<li><a href="tabforumhome.php?tabcat[]=1&tabcat[]=2" rel="ajaxTFHcontentarea">TAB 2 NAME</a></li>
<li><a href="tabforumhome.php?tabcat[]=1&tabcat[]=2&tabcat[]=3" rel="ajaxTFHcontentarea">TAB 3 NAME</a></li>
</ul>
</div>
<br style="clear: left" />
<div class="TFHmenu2line"></div>
<div id="ajaxTFHcontentarea" style="border:0px solid gray; width:100%; height: 100%; background-color: white; padding: 0px"></div>
<script type="text/javascript">
var mytabs=new ddajaxtabs("ajaxTFH", "ajaxTFHcontentarea")
mytabs.setpersist(true)
mytabs.setselectedClassTarget("link")
mytabs.init()
</script>
<!-- /Tabbed Forum Home -->
<!-- /main -->
Utwórz nowy Template: FORUMHOMETAB> Wklej to co wcześniej zapisałeś, czyli dla stylu default:
Kod:
<!-- main -->
<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
<thead>
<tr align="center">
<td class="thead"> </td>
<td class="thead" width="100%" align="$stylevar[left]">$vbphrase[forum]</td>
<td class="thead" width="175">$vbphrase[last_post]</td>
<td class="thead">$vbphrase[threads]</td>
<td class="thead">$vbphrase[posts]</td>
<if condition="$vboptions['showmoderatorcolumn']">
<td class="thead">$vbphrase[moderator]</td>
</if>
</tr>
</thead>
$forumbits
<tbody>
<tr>
<td class="tfoot" align="center" colspan="<if condition="$vboptions['showmoderatorcolumn']">6<else />5</if>"><div class="smallfont"><strong>
<a href="forumdisplay.php?$session[sessionurl]do=markread" rel="nofollow">$vbphrase[mark_forums_read]</a>
<if condition="$vboptions['forumleaders']">
<a href="showgroups.php$session[sessionurl_q]">$vbphrase[view_forum_leaders]</a></if>
</strong></div></td>
</tr>
</tbody>
</table>
$forumhome_markread_script
<!-- /main -->
Edytuj template: forumhome_forumbit_level1_post
Na początku kodu umieść:
Kod:
<if condition="(THIS_SCRIPT == 'tabforumhome' AND in_array($forum['forumid'], $GLOBALS[tabcats])) OR THIS_SCRIPT == 'forumdisplay'">
na końcu
Analogicznie dla template: forumhome_forumbit_level1_nopost
ACP>Style Manager>Main CSS: Additional CSS Definitions
Dodajemy, odpowiednio modyfikując kolory pod nasz styl(dla każdego stylu trzeba powtórzyć operacje):
Kod:
/* ######### CSS for Tabbed Forum Home ######### */
.TFHmenu2{
padding: 0;
width: 100%;
background: transparent;
voice-family: "\"}\"";
voice-family: inherit;
}
.TFHmenu2 ul{
margin:0;
margin-left: 0px; /*margin between first menu item and left browser edge*/
padding: 0;
list-style: none;
}
.TFHmenu2 li{
display: inline;
margin: 0 0 0 0;
padding: 0;
/*text-transform:uppercase;*/
}
.TFHmenu2 a{
float: left;
display: block;
font: 11px Arial;
color: white;
text-decoration: none;
margin: 0 1px 0 0; /*Margin between each menu item*/
padding: 5px 10px;
background: #5C7099;
border-top: 5px solid white;
}
.TFHmenu2 a:hover{
font: 11px Arial;
background-color: #869BBF;
color: Black;
}
.TFHmenu2 a.selected{
font: bold 13px Arial;
background-color: #869BBF;
color: white;
border-color: #869BBF;
}
.TFHmenu2line{
clear: both;
padding: 0;
width: 100%;
height: 8px;
line-height: 5px;
background: #869BBF;
}
3. Dostosowywanie
ACP>Style Manager>EDIT Template: FORUMHOME
Znajdź:
Kod:
<!-- Tabbed Forum Home -->
Zmień na swoje kategorie/nazwy/wyświetlane fora:
Kod:
<li class="selected"><a href="tabforumhome.php?tabcat[]=1" rel="ajaxTFHcontentarea">TAB 1 NAME</a></li>
<li><a href="tabforumhome.php?tabcat[]=1&tabcat[]=2" rel="ajaxTFHcontentarea">TAB 2 NAME</a></li>
<li><a href="tabforumhome.php?tabcat[]=1&tabcat[]=2&tabcat[]=3" rel="ajaxTFHcontentarea">TAB 3 NAME</a></li>
tabcat[]=x odpowiada za wyświetlanie się for
TAB x NAME nazwa zakładki
Jeśli chcesz by pod jedną zakładką była kilka for łączysz: tabcat[]=1&tabcat[]=2&tabcat[]=3 itd.
I chyba na tyle.