Сворачивание категорий
Добавлено: 09 янв 2013, 22:28
Сворачивание категорий на форуме при помощи JavaScript, с запоминанием в браузере. В примере используются только стандартные и чистые шаблоны prosilver и subsilver.
Prosilver
Скачиваем архив, закачиваем файлы к себе на форум.
Открываем overall_header.html, перед закрывающим тегом </head> ставим:
Сворачивание категорий для prosilver'a используется на jQuery, поэтому если у вас уже подключена её библиотека, то:
можно не ставить.
Так же не забудьте указать пути до скриптов.
Далее открываем forumlist_body.html, в самое начало шаблона ставим:
Чуть ниже, находим:
Меняем на:
Т.е. добавляем после </ul> тег </div>.
Далее находим:
Перед найденным ставим:
В самый конец шаблона ставим:
Открываем тему вашего стиля, в конец добавляем:
Пользуемся.
Subsilver2
Скачиваем архив, закачиваем файлы к себе на форум.
Открываем overall_header.html, перед закрывающим тегом </head> ставим:
Далее открываем forumlist_body.html, находим:
Меняем на:
Находим:
Перед найденным ставим:
Не забудьте указать пути к кнопкам и скрипту.
Если вы всё сделали правильно, то у вас появится возможность сворачивать категории форумов.
Оригинал
http://cabinetadmina.ru/viewtopic.php?p=62417#p62417
Prosilver
Скачиваем архив, закачиваем файлы к себе на форум.
Открываем overall_header.html, перед закрывающим тегом </head> ставим:
- Код: Выделить всё
<script type="text/javascript" src="ваш сайт/jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="ваш сайт/jquery.cookie.js"></script>
<script type="text/javascript" src="ваш сайт/jquery.collapse.js"></script>
Сворачивание категорий для prosilver'a используется на jQuery, поэтому если у вас уже подключена её библиотека, то:
- Код: Выделить всё
<script type="text/javascript" src=" ваш сайт /jquery-1.5.2.min.js"></script>
можно не ставить.
Так же не забудьте указать пути до скриптов.
Далее открываем forumlist_body.html, в самое начало шаблона ставим:
- Код: Выделить всё
<div class="forumlist">
Чуть ниже, находим:
- Код: Выделить всё
<!-- IF (forumrow.S_IS_CAT and not forumrow.S_FIRST_ROW) or forumrow.S_NO_CAT -->
</ul>
<span class="corners-bottom"><span></span></span></div>
</div>
<!-- ENDIF -->
Меняем на:
- Код: Выделить всё
<!-- IF (forumrow.S_IS_CAT and not forumrow.S_FIRST_ROW) or forumrow.S_NO_CAT -->
</ul>
</div>
<span class="corners-bottom"><span></span></span></div>
</div>
<!-- ENDIF -->
Т.е. добавляем после </ul> тег </div>.
Далее находим:
- Код: Выделить всё
<ul class="topiclist forums">
<!-- ENDIF -->
Перед найденным ставим:
- Код: Выделить всё
<!-- IF SCRIPT_NAME eq 'index' --><div class="trigger active"></div><!-- ENDIF -->
<div class="collapsethis">
В самый конец шаблона ставим:
- Код: Выделить всё
</div>
<script type="text/javascript">
// <![CDATA[
$(".forumlist").collapse({show: function(){
this.animate({
opacity: 'toggle',
height: 'toggle'
}, 300);
},
hide : function() {
this.animate({
opacity: 'toggle',
height: 'toggle'
}, 300);
}
});
// ]]>
</script>
Открываем тему вашего стиля, в конец добавляем:
- Код: Выделить всё
/* Folding Categories */
.trigger {
background: url("ваш сайт/images/trigger.png") no-repeat;
width: 19px;
height: 20px;
cursor: pointer;
float: right;
position: relative;
z-index: 9998;
margin-top: -22px;
margin-right: 5px;
}
.active {background-position: right top;}
.inactive {background-position: left bottom;}
Пользуемся.
Subsilver2
Скачиваем архив, закачиваем файлы к себе на форум.
Открываем overall_header.html, перед закрывающим тегом </head> ставим:
- Код: Выделить всё
<script type="text/javascript" src="ваш сайт/scripts.js"></script>
Далее открываем forumlist_body.html, находим:
- Код: Выделить всё
<!-- BEGIN forumrow -->
<!-- IF forumrow.S_IS_CAT -->
<tr>
<td class="cat" colspan="2"><h4><a href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a></h4></td>
<td class="catdiv" colspan="3"> </td>
</tr>
<!-- ELSEIF forumrow.S_IS_LINK -->
Меняем на:
- Код: Выделить всё
<!-- BEGIN forumrow -->
<!-- IF forumrow.S_IS_CAT -->
<tbody id="f_{forumrow.FORUM_ID}_h" style="display: none;">
<tr>
<td class="cat" colspan="2"><h4><a href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a></h4></td>
<td class="catdiv" colspan="3"><img style="padding-top: 9px; padding-right: 6px; float: right; cursor: pointer;" src="ваш сайт/icon_maximize.gif" onclick="ShowHide('f_{forumrow.FORUM_ID}', 'f_{forumrow.FORUM_ID}_h', 'f_{forumrow.FORUM_ID}');" alt="{L_FORUM}" /></td>
</tr>
</tbody>
<tbody id="f_{forumrow.FORUM_ID}">
<script type="text/javascript">
<!--
tmp = 'f_{forumrow.FORUM_ID}';
if(GetCookie(tmp) == '2')
{
ShowHide('f_{forumrow.FORUM_ID}', 'f_{forumrow.FORUM_ID}_h', 'f_{forumrow.FORUM_ID}');
}
//-->
</script>
<tr>
<td class="cat" colspan="2"><h4><a href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a></h4></td>
<td class="catdiv" colspan="3"><img style="padding-top: 9px; padding-right: 6px; float: right; cursor: pointer;" src="ваш сайт/icon_minimize.gif" onclick="ShowHide('f_{forumrow.FORUM_ID}', 'f_{forumrow.FORUM_ID}_h', 'f_{forumrow.FORUM_ID}');" alt="{L_FORUM}" /></td>
</tr>
<!-- ELSEIF forumrow.S_IS_LINK -->
Находим:
- Код: Выделить всё
<!-- BEGINELSE -->
Перед найденным ставим:
- Код: Выделить всё
<!-- IF forumrow.S_LAST_ROW -->
</tbody>
<!-- ENDIF -->
Не забудьте указать пути к кнопкам и скрипту.
Если вы всё сделали правильно, то у вас появится возможность сворачивать категории форумов.
Оригинал
http://cabinetadmina.ru/viewtopic.php?p=62417#p62417