コミュニティセントラル

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

この拡張機能は、Fandomの初期状態では有効化されています

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 */
}

バグ[]

悪いモバイル体験[]

デスクトップやラップトップで動作するCSSやJavaScriptの多くは、モバイルデバイスでは適用できません。これに対抗するため、Fandomはモバイルのスキンからコードのほとんどを削除しました。その結果、モバイルユーザーには、各情報を区切る視覚的な合図は一切表示されません(タブの内容は表示されますが、タブに区切られていないだけです)。

回避策として使われる追加のCSSやHTMLハックには問題があり、いくらユーザーのコーディングを施しても解決できなってしまいました。そのため、ほとんど得るものがない割に労力がかかってしまいました。代わりに普通のセクションを使ったほうがいいです。

タブ内容の表示/編集[]

(進行中)

インフォボックス[]

(進行中)

関連情報[]

その他のヘルプとフィードバック[]