FANDOM


Якщо на цій сторінці не видно приклади роботи тегів, перейдіть сюди.

Табуляция-це можливість створювати на сторінці вкладки. Для цього використовуються теги «tabber» і «tabview».


Tabber Редагувати

За допомогою тега tabber можна створювати вкладки з вільним вмістом.

Усередині коду використовується формат: Тема=Текст

Вкладки розділяються за допомогою: «|-|»

Приклад
<Tabber>
Серіал=1 серія, 2 сезону
|-|
Посилання=[http://www.google.com Google]<br/>[http://www.cnn.com CNN]<br/>
|-|
Обговорити=Обговорення
</Tabber>

В результаті, Ви отримаєте:

1 серія, 2 сезону

Обговорення

Ви можете додати на вкладки будь-який контент, включаючи шаблони і зображення.

Табуляция в шаблонах

Ви можете використовувати табуляцію в шаблонах за допомогою тега {{# tag:tabber| ...}} і |-|.

{{#tag:Tabber|Tab1=Param1 shows up{{{1|here}}}if passed.{{!}}-{{!}}
Tab2=Param2 shows up {{{2|here}}} if passed.
}}
Заголовки верхнього рівня

Заголовки H2 і H3 відключені в цьому тезі. Ви можете включити їх, додавши на сторінку MediaWiki:Wikia.css наступний код:

.tabberlive .tabbertab h2, .tabberlive .tabbertab h3 {
display:block! important;}

Tabview Редагувати

За допомогою тега tabview можна додати на вкладки вміст інших сторінок Вашої Вікі. Це можуть бути як звичайні сторінки, так і сторінки, спеціально створені для вкладок (наприклад, підсторінки поточної сторінки).

Усередині коду використовується формат: Текст|Тема. Нову вкладку пишемо з нового рядка.

Приклад
<Tabview>
Довідка:Helper|Helper
Довідка:Посилання сюди|Посилання сюди
Довідка:Звіт про тегах|Звіт про тегах
</Tabview>

В результаті, Ви отримаєте:


;Кеш

Якщо сторінка з вкладки часто оновлюється, то ви можете додати false, щоб вміст вкладки оновлювалося при кожному завантаженні сторінки.

<Tabview>
Довідка:Helper|Helper|false
Довідка:Посилання сюди|Посилання сюди
Довідка:Звіт про тегах|Звіт про тегах
</Tabview>
Відкриття потрібної вкладки

Щоб при завантаженні сторінки була відкрита не перша вкладка, а та, яку хочете Ви, використовуйте true. Зверніть увагу, що це ключове слово потрібно ставити після двох вертикальних рис, залишаючи місце для слова, оновлюючої кеш.

<Tabview>
Довідка:Helper|Helper
Довідка:Посилання сюди|Посилання сюди||true
Довідка:Звіт про тегах|Звіт про тегах
</Tabview>

Налаштування зовнішнього вигляду Редагувати

Наступний код дозволить налаштувати зовнішній вигляд закладок: Таббер с Warframe wiki

/*** Основні класи Tabber ***/
.tabberlive {
/* Стиль контейнера */
}
ul.tabbernav {
/* Список вкладок */
}
.tabberlive .tabbertab {
/* Стиль вмісту вкладок */
}
.tabberlive> .tabbertab:not(.tabbertabhide) {
/* Стиль повний вміст */
}
.tabberlive> .tabbernav> li> a {
/* Стиль закладок */
}
.tabberlive> .tabbernav> li> a:hover {
/* Закладка при наведенні миші */
}
.tabberlive> .tabbernav> li> a:active {
/* Закладка при натисканні миші */
}
.tabberlive> .tabbernav> li.tabberactive> a {
/* Вибрана закладка */
}
.tabberlive> .tabbernav> li.tabberactive> a:hover {
/* Вибрана закладка при наведенні миші */
}
.tabberlive> .tabbernav> li.tabberactive> a:active {
/* Вибрана закладка при натисканні миші */
}
/*** RuElderScrools Tabber ***/
.tabberlive .tabbertab { border:none! important;}
ul.tabbernav { font-size: 14px! important; background-color: rgba(28, 28, 28, 0.1); margin:-5px 0 0! important; padding-bottom:5px! important; border:none! important; text-align:center;}
ul.tabbernav li a /* поле закладок */ { background: none! important; border:none! important;}
ul.tabbernav li a:link /* колір тексту закладок */ { color:# 000! important;}
ul.tabbernav li a:hover /* при наведенні на закладку */ { border-bottom:2px solid # 000! important;}
ul.tabbernav li.tabberactive a /* активна закладка */ {
 background-color:rgba(229, 229, 229, 0.6)! important; border-bottom:2px solid # 000! important;}

/*** Основні класи TabView ***/
ul.tabs {/* список вкладок */}
ul.tabs> [data-tab="flytabs_00"] {/* перший вкладка */}
ul.tabs> [data-tab="flytabs_01"] {/* другу вкладка */}
...
ul.tabs li.selected {/* активна (обрана) вкладка */}
div.tabBody .selected {/* відображуване вміст */}
 /** Вміст **/
div[id $="content-wrapper"] {/* Стиль контейнера основного вмісту */}
div.tabbody selected {
/* Стиль контейнера повний вміст */
}
/*** Класи у разі використання id ***/
/** <Tabview id="Example"> дозволить створити унікальний стиль для окремого елемента **/
/* Id не повинні повторюватися, інакше відбудеться плутанина з правилами */
div # flytabs_Example {
/* Стиль контейнера вкладок */
}
div # flytabs_Example ul.tabs {/* список вкладок */}
div # flytabs_Example ul.tabs [data-tab="flytabs_Example0"] {/* перший вкладка */}
div # flytabs_Example ul.tabs [data-tab="flytabs_Example1"] {/* друга вкладка */}
...
div # flytabs_Example ul.tabs li.selected {/* активна (обрана) вкладка */} /** Вміст **/
div # flytabs_Example-content-wrapper {/* Стиль контейнера основного вмісту */} /* Контейнер вмісту першої/другої/т.д. вкладок */
div[data-tab-body="flytabs_Example0"], div[data-tab-body="flytabs_Example1"], ...
/*** Стилізований табвью (під стиль таббера з ElderScrollsWiki) для Варфрейм вікі ***/
/** Http://prntscr.com/5zn0pv ─ http://ru.test.wikia.com/wiki/Секретные_места **/
/* Стиль заданий для табвью з ідентифікатором "Secretplaces" (<tabview id="Secret places">)
 і не спрацює для інших елементів */

div # flytabs_Secretplaces> ul{ border-style: none;
 background-color: rgba(28, 28, 28, 0.1);
 font: bold 12px Verdana, sans-serif;
 text-align:center;}/* Tabs */
div # flytabs_Secretplaces> ul> li{ display:inline;
 float:none;
 line-height:20px;} 
/* Internal tabs style + default border fix */
div # flytabs_Secretplaces> ul> li> a{ color:black;
 padding:0px 0.5em;
 border-top-left-radius:0; /* Видалення заокруглень */
 border-top-right-radius:0; /* Верхніх кутів */}
/* Видалення підкреслення посилання при наведенні миші */
div # flytabs_Secretplaces> ul> li> a:hover {
 text-decoration: none! important
}
/* Стиль обраної закладки */
div # flytabs_Secretplaces> ul> li.selected> a {
 background-color:rgba(28, 28, 28, 0.1);
 border-bottom:2px solid # 000! important;
}

Див. Також Редагувати

Community content is available under CC-BY-SA unless otherwise noted.