ヘルプ

このヘルプには更新、または翻訳されていないコンテンツがあります。どなたでも翻訳にご協力いただくことができます。
原文 : w:Help:Tabber

Tabberとは、コンテンツの節に複数のタブを追加することによってページをリロードすることなくコンテンツを切り替えることができる拡張機能です。

詳しい手順[編集 | ソースを編集]

  • 編集のため使いたいページを開き、ソースモードに切り替えます。
  • コピーし、エディターに次のコードを貼り付けます。
<tabber>1つ目のタブ=1つ目のタブのサンプルテキストです。
|-|2つ目のタブ=2つ目のタブのサンプルテキストはここに入ります。
|-|3つ目のタブ=3つ目のタブのサンプルテキストはここに入ります。
</tabber>

「プレビュー」をクリックします。するとこのように表示されます:

1つ目のタブのサンプルテキストです。

2つ目のタブのサンプルテキストはここに入ります。

3つ目のタブのサンプルテキストはここに入ります。

  • 「戻る」をクリックし、自分にあった内容に書きかえてください。
  • あなたのコミュニティにあるタイトルやコンテンツのテキストを置換してタブを編集してください。例えば、「1つ目のタブ」を「登場人物」に置換し、サンプルテキストを解説やお気に入りの登場人物の画像に置換します。コードを追加削除することによってタブの数を変更することもできます。

使用法情報[編集 | ソースを編集]

書式 : タブのタイトルは常に等号(「=」) で終わり、常にタブとタブと間をセパレータ (|-|) で区切ってください。

Wikiコード : タブにテンプレートや画像などのWikiコードを使用できます。

デザインを変更する[編集 | ソースを編集]

.tabberlive {
	/* tabber wrapper style */
}
.tabberlive > .tabbertab:not(.tabbertabhide) {
	/* tabber visible content */
}
.tabberlive > .tabbernav > li > a {
	/* tabber tabs */
}
.tabberlive > .tabbernav > li > a:hover {
	/* tabber tabs when being hovered */
}
.tabberlive > .tabbernav > li > a:active {
	/* tabber tabs when being clicked */
}
.tabberlive > .tabbernav > li.tabberactive > a {
	/* selected tabber tab */
}
.tabberlive > .tabbernav > li.tabberactive > a:hover {
	/* selected tabber tab when being hovered */
}
.tabberlive > .tabbernav > li.tabberactive > a:active {
	/* selected tabber tab when being clicked */
}

Issues[編集 | ソースを編集]

Broken mobile experience[編集 | ソースを編集]

A lot of the CSS and JavaScript that runs on your desktop/laptop cannot be applied on a mobile device. To counter this, Fandom has removed most of that code from the mobile skin - including the stuff that makes Tabber possible. As a result, mobile users won't see any of the visual cues that separate each set of information (The contents of the tabs will appear, just not separated into tabs).

There are problems with additional CSS and HTML hacks used as workarounds, which no amount of user-facing coding can solve. Therefore, that's a lot of effort for very little gain; you might as well use ordinary sections instead.

View/Edit tab content[編集 | ソースを編集]

Tabber does not provide a simple way to edit individual sections. This can be troublesome for inexperienced users that want to edit the content inside a tab. Additionally, people who use the VisualEditor will be unable to edit it without switching to source editor.

Infoboxes[編集 | ソースを編集]

Tabber does not always display properly when put within an infobox. To counter this, a gallery may be used within an infobox to provide the same effect as the Tabber. When using Fandom standard portable infoboxes, a gallery can be passed directly to an image field to create tabbed images. For tabbing other content, infobox panels can be used. For more information, see Help:Infoboxes.

関連情報[編集 | ソースを編集]

その他のヘルプとフィードバック[編集 | ソースを編集]

特に記載のない限り、コミュニティのコンテンツはCC-BY-SAライセンスの下で利用可能です。