Сворачивание категорий на форуме при помощи JavaScript, с запоминанием в браузере. В примере используются только стандартные и чистые шаблоны prosilver и subsilver.
Prosilver
Скачиваем архив, закачиваем файлы к себе на форум. Открываем
Сворачивание категорий для prosilver'a используется на jQuery, поэтому если у вас уже подключена её библиотека, то:
можно не ставить.
Так же не забудьте указать пути до скриптов.
Далее открываем
Чуть ниже, находим:
Меняем на:
Т.е. добавляем после
Далее находим:
Перед найденным ставим:
В самый конец шаблона ставим:
Открываем тему вашего стиля, в конец добавляем:
Пользуемся.
Subsilver2
Скачиваем архив, закачиваем файлы к себе на форум. Открываем
Далее открываем
Меняем на:
Находим:
Перед найденным ставим:
Не забудьте указать пути к кнопкам и скрипту.
Если вы всё сделали правильно, то у вас появится возможность сворачивать категории форумов.
Prosilver
Скачиваем архив, закачиваем файлы к себе на форум. Открываем
overall_header.html
, перед закрывающим тегом </head>
ставим:
Код: Выделить всё
<script type="text/javascript" src="ваш сайт/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="ваш сайт/jquery.cookie.js"></script>
<script type="text/javascript" src="ваш сайт/jquery.collapse.js"></script>
Код: Выделить всё
<script type="text/javascript" src=" ваш сайт /jquery-1.7.1.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 -->
Не забудьте указать пути к кнопкам и скрипту.
Если вы всё сделали правильно, то у вас появится возможность сворачивать категории форумов.
Комментарии: 14
Вот это супер!!!
с вашего позволения утащу
Есть еще модификация перемещения категорий с записью в куки
и категории как вкладки
с вашего позволения утащу
Есть еще модификация перемещения категорий с записью в куки
и категории как вкладки
- Bukovka_
- Сообщения: 165
- Зарегистрирован: 05 мар 2009, 13:01
- Пол: Жен
- Откуда: Киев
Вау, когда-то искала подобную функцию для своего форума, но так и не нашла. Супер!
Покумекаю над этим, насчёт subsilver'a не обещаю, попробую конечно.GoDFaTHeR писал(а):Есть еще модификация перемещения категорий с записью в куки
и категории как вкладки
А над тем как вкладки не понял? На подобие как разделы в админке сделаны?
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!
именноCabinetAdmin писал(а):А над тем как вкладки не понял? На подобие как разделы в админке сделаны?
Перенос категорий реализован на стиле supernova
А кто скажет, а как это прикрепить к чату . Чат вставлен на главной сайт вот таким образом, а как его можно сделать тоже сворачивающимся ???
Код: Выделить всё
<iframe src="/forum/chat/index.php" width="100%" height="250"></iframe>
Не проверял, но скорее всего как-то так:igorbond писал(а):его можно сделать тоже сворачивающимся ???
Код: Выделить всё
<table class="tablebg" cellspacing="1" width="100%">
<tbody id="f_{forumrow.FORUM_ID}_h" style="display: none;">
<tr>
<td class="cat" width="80%"><h4>{L_CHAT}</h4></td>
<td class="catdiv"><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" width="80%"><h4>{L_CHAT}</h4></td>
<td class="catdiv"><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>
<tr>
<td class="row1" colspan="2"><iframe src="/forum/chat/index.php" width="100%" height="250"></iframe></td>
</tr>
</tbody>
</table>
<table ...>
и </table>
не нужны...Если нет переменной
{L_CHAT}
, напишите просто - Чат
.Если есть чат на отдельной странице, то можно оформить в виде ссылки:
Код: Выделить всё
<a href="ссылка на страницу">{L_CHAT}</a>
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!
В инструкции в
Из скриптов, раз уж стоит сортировка, то хватит одного
forumlist_body.html
ставится скрипт, здесь его надо ставить не в этот шаблон, а в футер в самый конец, после:
Код: Выделить всё
<!-- EVENT overall_footer_body_after -->
jquery.collapse.js
и стоять он должен после сортировки:
Код: Выделить всё
<!-- INCLUDEJS jquery.collapse.js -->
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!
Еще вопрос про сворачивание спойлером.
Есть код карты со спутника. Хочу поставить под шапку, но что бы сворачивалась она. Т. к. она большая, как ее обернуть в спойлер? И что б по умолчанию она была свернута (я поставил размер 800Х200) . Кому надо открыл, пошастал и закрыл.
Спасибо.
Вот код карты [hide]<iframe src="http://wikimapia.org/#lat=56.424514&lon ... &ifr=1&m=b" width="322" height="322" frameborder="0"></iframe>[/hide]
Есть код карты со спутника. Хочу поставить под шапку, но что бы сворачивалась она. Т. к. она большая, как ее обернуть в спойлер? И что б по умолчанию она была свернута (я поставил размер 800Х200) . Кому надо открыл, пошастал и закрыл.
Спасибо.
Вот код карты [hide]<iframe src="http://wikimapia.org/#lat=56.424514&lon ... &ifr=1&m=b" width="322" height="322" frameborder="0"></iframe>[/hide]
Если хотите узнать глубину души человека, то плюньте ему в душу и считайте до тех пор,
пока не получите по морде.
пока не получите по морде.
По аналогии с чатом можно сделать, несколькими постами выше.
Примерно так:
Это на вскидку...
Примерно так:
Код: Выделить всё
<div id="m_1_h">
<div>
<div class="c-h-l"><div class="c-h-r"><div class="c-h-c"><img style="padding-top:13px;padding-right:8px;float:left;cursor:pointer;" src="{T_THEME_PATH}/images/maximize.png" onclick="javascript:ShowHide('m_1','m_1_h','m_1');" alt="maximize"><div class="c-h-title"><h4> Заголовок </h4></div></div></div></div>
<div class="c-f-l"><div class="c-f-r"><div class="c-f-c-2"></div></div></div>
</div>
<br /><br />
</div>
<div id="m_1" style="display:none;">
<script type="text/javascript">
<!--
tmp = 'm_1';
if(GetCookie(tmp) == '2')
{
ShowHide('m_1', 'm_1_h', 'm_1');
}
//-->
</script>
<div>
<div class="c-h-l"><div class="c-h-r"><div class="c-h-c"><img style="padding-top:13px;padding-right:8px;float:left;cursor:pointer;" src="{T_THEME_PATH}/images/minimize.png" onclick="javascript:ShowHide('m_1','m_1_h',m_1');" alt="minimize"><div class="c-h-title"><h4> Заголовок </h4></div></div></div></div>
<table class="tablebg" cellspacing="0" width="100%">
<tr>
<td class="row1">
<!-- Карта -->
</td>
</tr>
</table>
<div class="c-f-l"><div class="c-f-r"><div class="c-f-c"> </div></div></div>
</div>
<br /><br />
</div>
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!
Спасибо! Встало как надо. Но вот свертаться... в смысле сворачиваться обратно не хочет.
И еще - как то от приветственной строки отлипнуть ее можно? А проще говоря отступ сверху небольшой сделать.
А тут я не понял, если честно.CabinetAdmin писал(а): В инструкции в forumlist_body.html ставится скрипт, здесь его надо ставить не в этот шаблон, а в футер в самый конец, после:
КОД: ВЫДЕЛИТЬ ВСЁ
<!-- EVENT overall_footer_body_after -->
Из скриптов, раз уж стоит сортировка, то хватит одного jquery.collapse.js и стоять он должен после сортировки:
КОД: ВЫДЕЛИТЬ ВСЁ
<!-- INCLUDEJS jquery.collapse.js -->
И еще - как то от приветственной строки отлипнуть ее можно? А проще говоря отступ сверху небольшой сделать.
Если хотите узнать глубину души человека, то плюньте ему в душу и считайте до тех пор,
пока не получите по морде.
пока не получите по морде.
Можно добавить
перед
<br /><br />
после первого дива <div id="m_1_h">
.Ой, пропустил одну кавычку вот тут:
Код: Выделить всё
<img style="padding-top:13px;padding-right:8px;float:left;cursor:pointer;" src="{T_THEME_PATH}/images/minimize.png" onclick="javascript:ShowHide('m_1','m_1_h',m_1');" alt="minimize">
m_1
, вот так должно быть:
Код: Выделить всё
<img style="padding-top:13px;padding-right:8px;float:left;cursor:pointer;" src="{T_THEME_PATH}/images/minimize.png" onclick="javascript:ShowHide('m_1','m_1_h','m_1');" alt="minimize">
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!
Похожие темы
-
Расширение позволяющее добавить рекламу на форум phpBB.
Расширение можно скачать на официальном сайте phpbb -
Расширение с правками от...