BBCode представляет собой разделённое по смыслу сообщение, заключённое в разные блоки, открывающиеся по клику на соответствующий заголовок. Принцип как в личном разделе или при создании сообщения через форму ответа.
Далее представлен новый вариант двойного ббкода, старый, если вдруг он вам нужен, можно найти под спойлером в конце поста.
Табы состоят из двух ббкодов.
1 bbcode [tabs]
Использование BBCode:
Код: Выделить всё
[tabs]{TEXT}[/tabs]
Код: Выделить всё
<div class="tabs_block">
<div id="tabs" class="tabs">
<ul>
{TEXT}
<li class="tab" style="float: right;" onclick="this.closest('.tabs_block').querySelector('.tabs_cont').innerHTML=' ';" title="Закрыть" data-skip-responsive="true"><a href="#" onclick="return false"><span>×</span></a></li>
</ul>
</div>
<div class="tabs_cont panel"> </div>
</div>
Код: Выделить всё
Контейнер [tabs][tab=Заголовок]Содержимое[/tab][/tabs]
2 bbcode [tabs=]
Использование BBCode:
Код: Выделить всё
[tab={TEXT1}]{TEXT2}[/tab]
Код: Выделить всё
<li class="tab" onclick="this.closest('.tabs_block').querySelector('.tabs_cont').innerHTML=this.querySelector('.tab-html').innerHTML;">
<a href="#" onclick="return false"><span>{TEXT1}</span></a>
<div class="tab-html" style="display: none;">{TEXT2}</div>
</li>
Код: Выделить всё
[tab=Заголовок]Содержимое[/tab]
Чтобы наш bbcode правильно отображался в сообщении, при его составлении не должно быть пробелов между:
Код: Выделить всё
[tab=][/tab][tab=][/tab]
Код: Выделить всё
[tabs][tab=Заголовок 1]Содержимое[/tab][tab=Заголовок 2]Содержимое в котором могут быть
переносы слов, изображения и всё что вы захотите[/tab][tab=Заголовок 3]Содержимое[/tab][/tabs]
Стили.
В новой модификации практически все стили стандартные, но есть несколько элементов для стилизации.
Код: Выделить всё
.tabs_block {
max-width: 95%;
margin: 2px auto;
}
.tabs_block .tabs_cont {
padding: 8px 10px;
}
.tabs_block .tabs_cont {
- это фон блоков. По умолчанию в качестве фона используется цвет класса panel
. Если нужно, сюда можно задать собственный цвет.Так же можно совсем не добавлять стили и обойтись стандартными форумными.
При открытии страницы все вкладки по умолчанию скрыты, показывается пустое поле, чтобы добавить туда свой текст в первом bbcode
[tabs]
найдите:
Код: Выделить всё
<div class="tabs_cont"> </div>
Отличия от старого ббкода.
- Стилизация ббкода подогнана под стиль. Табы имеют стили других табов используемых на форуме.
- Вложенность других ббкодов. В любой таб можно добавлять другие ббкоды (за исключением конечно Tabs BBCode): спойлеры, стилизованные блоки и тп.
- Ббкод одинаково работает на всех версиях phpbb. В новых версиях табы так же сворачиваются, но не открываются с тех, что находятся во всплывающем окне (возможно позже починю, если будет нужно).
+Старый вариант ббкода
Комментарии: 42
А если написать в таком виде, то содержимое вкладок не отображается
[/tab]Содержимое
[/tabs][/code]
Добавлен ббкод code. У меня с ббкодом code не отображает содержимое вкладок.
Код: Выделить всё
[tabs][tab=Заголовок 1]Содержимое[/tab][tab=Заголовок 2][code]Содержимое в котором могут быть
переносы слов, изображения и всё что вы захотите
Добавлен ббкод code. У меня с ббкодом code не отображает содержимое вкладок.
Хм... Скопировал пример, попробовал, работает. Возможно не работает из-за каких-то особенностей стиля!?...BOJIK писал(а):А если написать в таком виде, то содержимое вкладок не отображается
зы. пробовал разные варианты, не захотел работать с цитатой внутри... Время появится, надо будет разобраться почему...
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!
- Golden Year
- Сообщения: 2
- Зарегистрирован: 20 авг 2012, 17:38
- Пол: Я ещё не определился
[quote="CabinetAdmin"]зы. пробовал разные варианты, не захотел работать с цитатой внутри... Время появится, надо будет разобраться почему...[/quote]
Здравствуйте.
Хотелось бы, чтобы Вы посмотрели ещё раз. Если вставлять во вкладки некоторые бб-коды (видео), то вкладки не работают.
Здравствуйте.
Хотелось бы, чтобы Вы посмотрели ещё раз. Если вставлять во вкладки некоторые бб-коды (видео), то вкладки не работают.
На самом деле, очень полезный код. С удовольствием установила и используем. Большое спасибо!
Форум Science-Леди www.scienceclub.listbb.ru
- Bukovka_
- Сообщения: 165
- Зарегистрирован: 05 мар 2009, 13:01
- Пол: Жен
- Откуда: Киев
CabinetAdmin
а количество вкладок ограничено?
а количество вкладок ограничено?
Как раз в раздумьях, для чего он мне сильно нужен.Uzanka » 04 сен 2013, 18:54 писал(а):С удовольствием установила и используем
- Bukovka_
- Сообщения: 165
- Зарегистрирован: 05 мар 2009, 13:01
- Пол: Жен
- Откуда: Киев
А у меня совсем не работает. Наверное потому, что у меня шаблон на дивах.
Я только на четырёх пробовал. По сути, скорее всего, не должно быть ограничений, только ограничение ширины страницы, которое визуально поломает порядок вкладок.
У меня только с цитатой не захотел работать. То есть если вкладывать только текст да картинки, то код отлично работает и его можно использовать.
У меня только с цитатой не захотел работать. То есть если вкладывать только текст да картинки, то код отлично работает и его можно использовать.
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!
Bukovka_
у меня есть каталоги полезных ссылок, например, по поиску конференций. Очень удобно разбить их еще по категориям. И место сокращаетBukovka_ писал(а):Как раз в раздумьях, для чего он мне сильно нужен.
Форум Science-Леди www.scienceclub.listbb.ru
- Bukovka_
- Сообщения: 165
- Зарегистрирован: 05 мар 2009, 13:01
- Пол: Жен
- Откуда: Киев
Uzanka » Сегодня, 13:41 писал(а):Очень удобно разбить их еще по категориям. И место сокращает Tabs BBCode. Вкладки в сообщении.
У меня он не работает вообще. Т.е. даже ничего не вставляя.CabinetAdmin » Сегодня, 13:08 писал(а):То есть если вкладывать только текст да картинки, то код отлично работает и его можно использовать.
Похожие темы
-
Не могли бы подсказать как можно исправить этот мод, чтобы при нажатии на мод сами категории не двигались, а только цвет фона менялся?
-
Приветствую!
Можно как то соорудить для phpBB Тег ?
То есть сделать в виде ббкода на подобии комментария HTML тега для сообщений, чтобы в сообщениях... -
Здравствуйте.
Нужен простой ббкод для вставки youtube. Искал на просторах все не рабочие может у кого есть в наличии поделитесь пожалуйста.
Версия... -
CabinetAdmin , приветствую!
Использование BBCode
{TEXT}
Замена HTML
Spoiler :
{TEXT}
Подсказка
Spoiler с паролем: СООБЩЕНИЕ... -
{TEXT2}
{TEXT2} | + {TEXT1}
Стандартный BBcode скрытого текста. Хочу использовать его в качестве примечаний в тексте поста. То есть, во-первых...