HTML шаблоны 1 - Окно списке тегов.

Код:
<style type="text/css">
li {
    display:none;
}

#sos {
    display:none;
}

#navigation {
    margin-left:auto;
    margin-right:auto;
    text-align:center;
}
</style> 
<script type="text/javascript" src="http://igust4u.ru/chats/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){ 
  $("#kiss").click(function(){
    var e = document.getElementsByTagName("li");
    for(var i=0; i<e.length; i++) {
        e[i].style.display = "none";
    }
    var d = document.getElementById("sos");
    sos.style.display = "table-row";
    $(".q1").parent().parent().parent().parent().parent().parent().show();
  });
  $("#sex").click(function(){
    var e = document.getElementsByTagName("li");
    for(var i=0; i<e.length; i++) {
        e[i].style.display = "none";
    }
    var d = document.getElementById("sos");
    sos.style.display = "table-row";
    $(".q2").parent().parent().parent().parent().parent().parent().show();
  });
  $("#tux").click(function(){
    var e = document.getElementsByTagName("li");
    for(var i=0; i<e.length; i++) {
        e[i].style.display = "none";
    }
    var d = document.getElementById("sos");
    sos.style.display = "table-row";
    $(".q3").parent().parent().parent().parent().parent().parent().show();
  });
  $("#mix").click(function(){
    var e = document.getElementsByTagName("li");
    for(var i=0; i<e.length; i++) {
        e[i].style.display = "none";
    }
    var d = document.getElementById("sos");
    sos.style.display = "table-row";
    $(".q4").parent().parent().parent().parent().parent().parent().show();
  });
});
function alltogetheron() {
    var e = document.getElementsByTagName("li");
    for(var i=0; i<e.length; i++) {
        e[i].style.display = "block";
    }
    var d = document.getElementById("sos");
    sos.style.display = "table-row";
}
function alltogetheroff() {
    var e = document.getElementsByTagName("li");
    for(var i=0; i<e.length; i++) {
        e[i].style.display = "none";
    }
    var d = document.getElementById("sos");
    sos.style.display = "none";
}
</script>   
<table id="navigation">
<tr>
<td colspan="3">
                <button id="kiss">Первая</button>
                <button id="sex">Вторая</button>
                <button id="tux">Третья</button>
                <button id="mix">Четвёртая</button>
</td></tr>
<tr><td>↑</td>
<td>По категориям</td>
<td>↑</td>
</tr>
<tr>
<td>↓</td>
<td><a href="#_alltogether_on" onclick="alltogetheron();">или все сразу?</a></td>
<td>↓</td>
</tr>
<tr id="sos">
<td colspan="3"><a href="#_alltogether_off" onclick="alltogetheroff();">Спасти трафик!!!</a></td>
</tr>
</table>
%NICK = %?%USER('NICK')%%:%nick?%%
<center><h2>Тэги</h2></center>
<ul>
%CHAT('TAGS', '<li>/%TAG%<table cellspacing=0 cellpadding=0>%PHRASES%</table>', '<tr><td><b>%ACTION% %NICK% %PHRASE%</td></tr>')%
</ul>
<div align=right><a href="/help">помощь</a></div>

В данном шаблоне 4 категории, названия можите менять на свое.
Теперь расскажу вам как в эти 4 категории добавлять теги.
Заходим в админку в теги, и перед добавлением тега ставим этот код - <span class="q1">
q1 - первая категория, q2 - вторая, q3 - третья, q4 - четвертая.
Пример: тег будет называться 123.

Код:
<font size="4" color="#FF0000">ВСЕМ ПРИВЕТ!!!</font>

Мы ставим его д опустим в 4 категорию, и естественно добавляем перед тегом <span class="q4">

Код:
<span class="q4"><font size="4" color="#FF0000">ВСЕМ ПРИВЕТ!!!</font>

На этом примере добавляем теги в 1,2,3 итд категории.
Запомните что если перед тегом не будет добавления <span class="q4"> 4-номер категории, то этого тега в категориях не будет.

Теперь рассмотрим шаблон с добавлением категории.
Добавляем код.

Код:
$("#pop").click(function(){
    var e = document.getElementsByTagName("li");
    for(var i=0; i<e.length; i++) {
        e[i].style.display = "none";
    }
    var d = document.getElementById("sos");
    sos.style.display = "table-row";
    $(".q5").parent().parent().parent().parent().parent().parent().show();
  });

(c) Автор InfinitI