Установка:
1. Заходим в ПУ => Таблица стилей CSS.
Вставляем куда угодно:
Code
/* TabContent */
.shadetabs{
padding: 3px 0;
margin-left: 0;
margin-top: 1px;
margin-bottom: 0;
font: bold 12px Verdana;
list-style-type: none;
text-align: left; /*set to left, center, or right to align the menu as desired*/
}
.shadetabs li{
display: inline;
margin: 0;
}
.shadetabs li a{
text-decoration: none;
position: relative;
z-index: 1;
padding: 3px 4px;
margin-right: 3px;
border: 1px solid #5d5d5d;
color: #828282;
background: white url(http://x-gaming.net.ru/images/4.11.png) top left repeat-x;
}
.shadetabs li a:visited{
color: #828282;
}
.shadetabs li a:hover{
background: repeat-x;
border: 1px solid #494949;
text-decoration: underline;
color: #5d5d5d;
}
.shadetabs li a.selected{ /*selected main tab style */
position: relative;
top: 1px;
}
.shadetabs li a.selected{
background-image: url(http://x-gaming.net.ru/images/4.1.png);
color: #2c2c2c;
border-bottom-color: #;
}
.shadetabs li a.selected:hover{ /*selected main tab style */
text-decoration: none;
}
.tabcontent{
display:none;
}
@media print {
.tabcontent {
display:block !important;
}
}
.modernbricksmenu2{
padding: 0;
width: 362px;
border-top: 5px solid #D25A0B; /*Brown color theme*/
background: transparent;
voice-family: "\"}\"";
voice-family: inherit;
}
.modernbricksmenu2 ul{
margin:0;
margin-left: 10px; /*margin between first menu item and left browser edge*/
padding: 0;
list-style: none;
}
.modernbricksmenu2 li{
display: inline;
margin: 0 2px 0 0;
padding: 0;
text-transform:uppercase;
}
.modernbricksmenu2 a{
float: left;
display: block;
font: bold 11px Arial;
color: white;
text-decoration: none;
margin: 0 1px 0 0; /*Margin between each menu item*/
padding: 5px 10px;
background-color: vlack; /*Brown color theme*/
border-top: 1px solid white;
}
.modernbricksmenu2 a:hover{
background-color: #D25A0B; /*Brown color theme*/
color: white;
}
.modernbricksmenu2 a.selected{ /*currently selected tab*/
background-color: #D25A0B; /*Brown color theme*/
color: white;
border-color: #D25A0B; /*Brown color theme*/
}
.tabcontent{
display:none;
}
@media print {
.tabcontent {
display:block !important;
}
}
.indentmenu{
font: bold 13px Arial;
width: 100%; /*leave this value as is in most cases*/
}
.indentmenu ul{
margin: 0;
padding: 0;
float: left;
/* width: 80%; width of menu*/
border-top: 1px solid navy; /*navy border*/
background: black url(http://x-gaming.net.ru/images/b.gif) center center repeat-x;
}
.indentmenu ul li{
display: inline;
}
.indentmenu ul li a{
float: left;
color: white; /*text color*/
padding: 5px 11px;
text-decoration: none;
border-right: 1px solid navy; /*navy divider between menu items*/
}
.indentmenu ul li a:visited{
color: white;
}
.indentmenu ul li a.selected{
color: white !important;
padding-top: 6px; /*shift text down 1px*/
padding-bottom: 4px;
background: black url(http://x-gaming.net.ru/images/b.gif) center center repeat-x;
}
.tabcontentstyle{ /*style of tab content oontainer*/
border: 1px solid gray;
width: 450px;
margin-bottom: 1em;
padding: 10px;
}
.tabcontent{
display:none;
}
@media print {
.tabcontent {
display:block !important;
}
}
.poloska-black {border-top: 1px solid #262626;border-bottom: 1px solid #262626; background: transparent url(/New_SG/Poloska.png) repeat scroll 0% 0%; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous;}
/* --------- */
Ставим в Верхнюю часть сайта в самый верх:
Code
<script type="text/javascript" src="http://sync-cs.ru/tabcontent.js"></script>
Листаем вниз страничку, видим там кнопку
Нажимаем на и в самый верх вставляем:
Code
<div id="reclama"><!-- Информер -->
<div class="border-radius">
<table border="0" width="100%" cellspacing="2" cellpadding="3">
<tr>
<TD class="bBlok2"><TABLE width="100%"><TBODY><TR><TD align="left">
<table style="width: 100%;"> <tbody> <tr> <td style="vertical-align: top;">
<table id="logo_fon" cellpadding="0" cellspacing="0" border="0" align="center" width="100%">
<tr>
<td align="center" valign="top" style="margin-top: 1px;">
<table cellpadding="0" cellspacing="0" border="0" align="up"><tr><td>
<table cellpadding="0" cellspacing="0"><tr><td id="tabcontent">
<table cellpadding="0" cellspacing="0"><tr><td align="center">
<ul id="countrytabs" class="shadetabs">
<li><a href="#" rel="link1">Реклама</a></li>
<li><a href="#" rel="link2">Форум</a></li>
<li><a href="#" rel="link3">Файлы</a></li>
<li><a href="#" rel="link4">Пользователи</a></li>
</ul>
</td></tr></table></table></table>
<br>
<div id="link1" class="tabcontent">
<div class="border-radius">
<table border="0" width="100%" cellspacing="2" cellpadding="3">
<tr>
<td class="poloska-black2"><CENTER><B><FONT color="#5d5d5d">Реклама</FONT></B></CENTER></td>
</tr>
<td class="bBlok2">
<center><br>
<script type="text/javascript" src="http://sync-cs.ru/rtr/1-1"></script><br><br>
<script type="text/javascript" src="http://sync-cs.ru/rtr/1-1"></script><br><br>
<script type="text/javascript" src="http://sync-cs.ru/rtr/1-1"></script><br><br>
<script type="text/javascript" src="http://sync-cs.ru/rtr/1-1"></script><br><br>
</center>
</td>
</tr>
</table></div></div>
<div id="link2" class="tabcontent">
<div class="border-radius">
<table border="0" width="100%" cellspacing="2" cellpadding="3">
<tr>
<td class="poloska-black2"><CENTER><B><FONT color="#5d5d5d">Новые темы</FONT></B></CENTER></td>
<td class="poloska-black2"><CENTER><B><FONT color="#5d5d5d">Популярные темы</FONT></B></CENTER></td>
</tr>
<tr>
<td class="bBlok2">
<center>
$MYINF_1$
</center>
</td>
<td class="bBlok2">
<center>
$MYINF_2$
</center>
</td>
</tr>
</table></div></div>
<div id="link3" class="tabcontent">
<div class="border-radius">
<table border="0" width="100%" cellspacing="2" cellpadding="3">
<tr>
<td class="poloska-black2"><CENTER><B><FONT color="#5d5d5d">Кол-во скачиваний</FONT></B></CENTER></td>
<td class="poloska-black2"><CENTER><B><FONT color="#5d5d5d">Дата добавления</FONT></B></CENTER></td>
</tr>
<tr>
<td class="bBlok2">
<center>
$MYINF_3$
</center>
</td>
<td class="bBlok2">
<center>
$MYINF_4$
</center>
</td>
</tr>
</table></div></div>
<div id="link4" class="tabcontent">
<div class="border-radius">
<table border="0" width="100%" cellspacing="2" cellpadding="3">
<tr>
<td class="poloska-black2"><CENTER><B><FONT color="#5d5d5d">Новые пользователи</FONT></B></CENTER></td>
<td class="poloska-black2"><CENTER><B><FONT color="#5d5d5d">Уважаемые пользователи</FONT></B></CENTER></td>
</tr>
<tr>
<td class="bBlok2">
<center>
$MYINF_5$
</center>
</td>
<td class="bBlok2">
<center>
$MYINF_6$
</center>
</td>
</tr>
</table></div></div>
</div></div><script type="text/javascript">
var countries=new ddtabcontent("countrytabs")
countries.setpersist(true)
countries.setselectedClassTarget("link") //"link" or "linkparent"
countries.init()
</script></td></td></td></td></table></table></table>
</table>
<!--/Информер --></div>
2. Создаем информеры!
1. Новые темы
[ Форум · Материалы · Последние обновленные темы · Материалы: 14 · Колонки: 1 · Длина заголовка: 28 ] - $MYINF_1$
Code
<table style="width:100%">
<tbody>
<tr>
<td style="vertical-align:top" ><p align=left><img border="0" align="absmiddle" src="http://sync-cs.ru/New_SG/8.gif"> <a href="$THREAD_URL$" title="$TITLE$"><font color="#818181">$THREAD_TITLE$</font></a></p></td>
<td style="vertical-align:top"><p align=right><font color="#818181">[$DATE$]</font></p></td>
</tr> </font>
</tbody>
</table>
2. Популярные темы
[ Форум · Материалы · Самые популярные темы · Материалы: 14 · Колонки: 1 · Длина заголовка: 30 ] - $MYINF_2$
Code
<table style="width:100%">
<tbody>
<tr>
<td style="vertical-align:top" ><p align=left><img border="0" align="absmiddle" src="http://sync-cs.ru/New_SG/8.gif"> <a href="$THREAD_URL$"><font color="#818181">$THREAD_TITLE$</font></a></p></td>
<td style="vertical-align:top"><p align=right><font color="#818181">[$REPLIES$]</font></p></td>
</tr> </font>
</tbody>
</table>
3. Новые файлы
[ Каталог файлов · Материалы · Дата добавления материала D · Материалы: 14 · Колонки: 1 · Длина заголовка: 30 ] - $MYINF_3$
Code
<table style="width:100%">
<tbody>
<tr>
<td style="vertical-align:top" ><p align=left><img border="0" align="absmiddle" src="http://sync-cs.ru/New_SG/8.gif"> <a href="$ENTRY_URL$"><font color="#818181">$TITLE$</font></a></p></td>
<td style="vertical-align:top"><p align=right><a href="$CATEGORY_URL$"><font color="#818181">[$DATE$]</font></a></p></td>
</tr> </font>
</tbody>
</table>
4. Лучшие файлы
[ Каталог файлов · Материалы · Количество загрузок D · Материалы: 14 · Колонки: 1 · Длина заголовка: 25 ] - $MYINF_4$
Code
<table style="width:100%">
<tbody>
<tr>
<td style="vertical-align:top" ><p align=left><img border="0" align="absmiddle" src="http://sync-cs.ru/New_SG/8.gif"> <a href="$ENTRY_URL$"><font color="#818181">$TITLE$</font></a></p></td>
<td style="vertical-align:top"><p align=right><a href="$CATEGORY_URL$"><font color="#818181">[$LOADS$]</font></a></p></td>
</tr> </font>
</tbody>
</table>
5. Новые юзеры
[ Пользователи · Материалы · Дата регистрации D · Материалы: 14 · Колонки: 1 ] - $MYINF_5$
Code
<table style="width:100%">
<tbody>
<tr>
<td style="vertical-align:top"><p align=left><img border="0" align="absmiddle" src="http://sync-cs.ru/New_SG/8.gif"> <a href="$PROFILE_URL$" target="_blank"><font color="#818181">$USERNAME$</font></a></p></td>
<td style="vertical-align:top"><p align=right><font color="#818181">[$REG_DATE$]</font></p></td>
</tr>
</tbody>
</table>
6. Лучшие юзеры
[ Пользователи · Материалы · Кол. сообщений в форуме · Материалы: 14 · Колонки: 1 ] - $MYINF_6$
Code
<table style="width:100%">
<tbody>
<tr>
<td style="vertical-align:top"><p align=left><img border="0" align="absmiddle" src="http://sync-cs.ru/New_SG/8.gif"> <a href="$PROFILE_URL$" target="_blank"><font color="#818181">$USERNAME$</font></a></p></td>
<td style="vertical-align:top"><p align=right><font color="#818181">[ $FORUM_POSTS$ ]</font></p></td>
</tr>
</tbody>
</table>
Все информеры заменяем на свои!