В данной теме мы хотим Вам рассказать, как правильно встроить спойлер на свой форум. Речь пойдет о спойлере, описанном в теме
Собственный спойлер с плавным открытием и скрытием содержимого.
Данная тема является ответом на просьбу в комментариях, показать, как правильно это сделать.
Для начала идем на вкладку "
ББ Коды", где создаем новый
ББ Код.
В поле "
Регулярное выражение" помещаем следующий код:
Код:
\[spoiler\](.*?)\[/spoiler\]
В поле "
Замена" помещаем такой код:
Код:
<div>
<a href="" class="spoiler_links">Спойлер (кликните для показа/скрытия)</a>
<div class="spoiler_body">$1</div>
</div>
На этом работа с
ББ Кодом заканчивается.
Теперь нам необходимо перейти в "
Шаблоны", далее "
Низ страницы" (footer). Туда мы вставляем скрипт подключения jQuery и скрипт открытия/закрытия спойлера:
Код:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
jQuery.noConflict();
(function($){
$(document).ready(function(){
$('.spoiler_links').click(function(){
$(this).parent().children('div.spoiler_body').toggle('normal');
return false;
});
});
})(jQuery);
</script>
Обращаем Ваше внимание на то, что на многих форумах, скорее всего, ранее уже была подключена библиотека jQuery по умолчанию, поэтому первая строчка (где мы подключаем jQuery) может не понадобиться!!!
Для того чтобы спойлер изначально был закрыт, не забываем перейти в "
Шаблоны", далее "
Верх страницы" (header) и добавить стиль для спойлера:
Код:
<style>
.spoiler_body {display:none; cursor:pointer;}
</style>
Скажу сразу, что на нашем форуме jQuery конфликтует с какими-то внутренними скриптами, в результате чего пришлось использовать jQuery.noConflict();.