- Это расширение подключено на ФЭНДОМЕ по умолчанию.
Табуляция — это возможность создавать на странице вкладки. Для этого используется тег <tabber>
.
Тег <tabber>[]
С помощью тега tabber
можно создавать вкладки со свободным содержимым.
Внутри кода используется формат: Заголовок=Текст
Вкладки разделяются с помощью: «|-|
»
- Пример
<tabber> Сериал = 1 серия, 2 сезона |-| Ссылки = [http://www.google.com Google]<br/>[http://www.cnn.com CNN]<br/> |-| Обсудить = Обсуждение </tabber>
В результате вы получите:
Вы можете добавить на вкладки любой контент, включая шаблоны и изображения.
- Заголовки верхнего уровня
Заголовки H2 и H3 отключены в этом теге. Вы можете включить их, добавив на страницу MediaWiki:Wikia.css следующий код:
.tabberlive .tabbertab h2, .tabberlive .tabbertab h3 { display:block !important; }
Табуляция в шаблонах[]
Вы можете использовать табуляцию в шаблонах с помощью тега {{#tag:tabber|...}}
и {{!}}-{{!}}
.
{{#tag:tabber| Вкладка1 = {{{1|Текст 1 вкладки как параметр}}} {{!}}-{{!}} Вкладка2 = {{{2|Текст 2 вкладки как параметр}}} }}
Тег <tabview>[]
С помощью тега tabview
можно добавить на вкладки содержимое других страниц вашей вики.
- В рамках платформы UCP использование
tabview
ограничено только теми вики, где этот тег использовался раньше, поскольку Фэндом намеревается прекратить поддержку этого расширения. Настоятельно рекомендуется отказаться от использования этого тега.
Настройка внешнего вида[]
Следующий код позволит настроить внешний вид закладок:
/*** Основные классы Tabber ***/
.tabber.wds-tabber {
/* стиль контейнера */
}
.tabber .wds-tab__content {
/* стиль содержимого вкладок */
}
.tabber .wds-tab__content.wds-is-current {
/* стиль содержимого активной вкладки */
}
.tabber .wds-tabs {
/* список вкладок */
}
.tabber .wds-tabs__tab {
/* стиль вкладок */
}
.tabber .wds-tabs__tab:hover {
/* закладка при наведении мыши */
}
.tabber .wds-tabs__tab a:focus {
/* закладка после щелчка мыши */
}
.tabber .wds-tabs__tab.wds-is-current {
/* стиль активной вкладки */
}
.tabber .wds-tabs__tab.wds-is-current:hover {
/* выбранная вкладка при наведении мыши */
}
Примеры[]
.tabber .wds-tabs {
justify-content: center; /* выравнивание вкладок по центру */
}
.tabber .wds-tabs__tab {
background-color: rgba(var(--theme-accent-color--rgb),0.2); /* фон для всех вкладок */
}
.tabber .wds-tabs__tab.wds-is-current {
background-color: var(--theme-accent-color); /* фон активной вкладки */
color: #fff; /* цвет текста активной вкладки */
}
.tabber .wds-tabs__tab a:focus {
color: #fff; /* цвет текста при нажатии на вкладку */
text-decoration: none; /* убираем подчёркивание ссылки */
}
См. также[]
- Extension:Tabber на MediaWiki.org (англ.)