BBCodeガイド

はじめに

BBCode とは?
BBCode はユーザーの利便性・システムの安全性のためにシステム側が用意した簡単なマークアップ言語です。BBCode を使用できるか否かは掲示板の設定によります。BBCode を使用できる場合でも投稿時に投稿画面で BBCode を無効にできます。 BBCode はマークアップ言語である点で HTML と似ていますが、タグは < > ではなく角カッコ [ ] で括られます。BBCode を使用することによって文章の見栄えをコントロールしたり画像やリンクを文章に挿入したりできるようになります。掲示板のスタイルによりますが、テキストエリアの真上に BBCode ボタンがずらりと並んでいるはずです。これらのボタンをクリックすれば簡単に BBCode をテキストエリア内に挿入できます。 BBCode をさらに詳しく知るには以下のガイドをご覧ください。
ページトップ

テキストの書式

ボールド（太字）、イタリック（斜体）、アンダーライン（下線）の作成方法
文字のスタイルを変更する BBCode です。スタイルの変更について：
  • ボールド（太字）で表すには [b][/b] で囲みます。

    [b]Hello[/b]

    は Hello となります。
  • アンダーライン（下線）を引くには [u][/u] で囲みます。

    [u]Good Morning[/u]

    は Good Morning となります。
  • イタリック（斜体）で表すには [i][/i] で囲みます。

    This is [i]Great![/i]

    は This is Great! となります。
ページトップ
文字の色と大きさを変える方法
文字の色や大きさを変えるには以下のタグを使用します。どのように表示されるかはブラウザによって異なる場合がある点にご注意ください：
  • 文字の色を変えるには [color=][/color] で囲みます。色の特定は red, blue, yellow といった単語または十六進数（例: #F5CA09）で指定することができます：

    [color=red]Hello![/color]

    または

    [color=#FF0000]Hello![/color]

    は Hello! となります。
  • 文字の大きさを変えるには [size=][/size] で囲みます。掲示板のスタイルにもよりますが、お勧めの形式はテキストサイズを元の大きさのパーセント数値で指定する方法です。数値は 20 から 200 まで指定可能です：

    [size=50]SMALL[/size]

    は SMALL となります。

    同様に

    [size=200]HUGE![/size]

    は HUGE! となります。
ページトップ
タグを組み合わせることはできますか?
もちろんできます:

[size=150][color=red][b]LOOK AT ME![/b][/color][/size]

は LOOK AT ME! となります。

ただしあまりにもたくさんのタグを組み合わせることはお勧めしません。またタグの配置は正しく行ってください。次の例は間違ったタグの配置です:

[b][u]This is wrong[/b][/u]
ページトップ

引用と固定幅データの表示

文章を引用付きで返信する方法
文章を引用するには２つの方法があります。
  • 引用したい文章を [quote=""][/quote] で囲みます。"" の中には引用に関する情報（引用文章を書いた人物、引用した書籍など）を入力します。例えば Mr. Blobby が書いたテキストの一部を引用する場合、このように入力します：

    [quote="Mr. Blobby"]Mr. Blobby の文章[/quote]

    上記のようにすることで "Mr. Blobby さんが書きました:" が自動的に追加されます。名前を引用符 "" で必ず囲んでください。省略することはできません。
  • ２つ目の方法はただ単に文章を [quote][/quote] で囲みます。この場合、引用した文章が誰によるものなのかは判りません。
ページトップ
コードまたは整形済みデータの表示
プログラムのコード や タブ・スペースなどの固定幅を使用した整形済みデータ を表示するには、そのテキストを [code][/code] で囲みます：

[code]echo "これはプログラムのコードです";[/code]

[code][/code] で囲まれた部分が固定幅で表示されます。 [code=php][/code] とすると if(){} や while(){} などの PHP構文 をハイライト表示することができ、PHPコード が読みやすくなるのでお勧めです。
ページトップ

リストの作成

番号なしリストの作成方法
BBCode は 番号なしリスト と 番号付きリスト をサポートしています。BBCode のリストは HTML の <li> と同じように機能します。番号なしリストは各項目の先頭に丸い点が置かれます。番号なしリストを作成するには [list][/list] タグの中で [*] を使って各項目を指定します。例えば自分の好きな色をリスト表示するには次のようにします：

[list]
[*]Red
[*]Blue
[*]Yellow
[/list]

上記のようにすると次のリストが表示されます：
  • Red
  • Blue
  • Yellow

あるいは、[list=disc][/list], [list=circle][/list], or [list=square][/list] を使用してリストの箇条書きスタイルを指定することもできます。
ページトップ
番号付きリストの作成方法
番号付きリストを作成するには [list=1][/list] を用います。番号順の代わりにアルファベット順にしたい場合は [list=a][/list] を用います。番号なしリストと同様に各項目を指定するには [*] を使用します。簡単な例を紹介します：

[list=1]
[*]お店に行って
[*]パソコン買って
[*]故障したら悪態をつく
[/list]

上記のようにすると次のリストが表示されます:
  1. お店に行って
  2. パソコン買って
  3. 故障したら悪態をつく
次にアルファベット順リストの例を紹介します:

[list=a]
[*]第一候補
[*]第二候補
[*]第三候補
[/list]

上記のようにすると次のリストが表示されます：
  1. 第一候補
  2. 第二候補
  3. 第三候補

[list=A]
[*]第一候補
[*]第二候補
[*]第三候補
[/list]

上記のようにすると次のリストが表示されます：
  1. 第一候補
  2. 第二候補
  3. 第三候補

[list=i]
[*]第一候補
[*]第二候補
[*]第三候補
[/list]

上記のようにすると次のリストが表示されます：
  1. 第一候補
  2. 第二候補
  3. 第三候補

[list=I]
[*]第一候補
[*]第二候補
[*]第三候補
[/list]

上記のようにすると次のリストが表示されます：
  1. 第一候補
  2. 第二候補
  3. 第三候補
ページトップ

ハイパーリンクの作成

他サイトへのハイパーリンクの作成方法
BBCode は URI（niform Resource Indicators の略、URL と同義） を作成する方法をいくつかサポートしています。
  • リンクしたい文字を [url=][/url] で囲みます。 = の後にリンク先の URL を入力します。例えば phpBB.com へのリンクを作る場合は次のようにします:

    [url=https://www.phpbb.com/]Visit phpBB![/url]

    上記のようにすると Visit phpBB! と表示されます。リンククリック時に同じウィンドウで開くか新しいウィンドウで開くかはブラウザの設定に依存する点にご注意ください。
  • URL そのものをリンクにしたい場合は単純に次のようにします:

    [url]https://www.phpbb.com/[/url]

    上記のようにすれば https://www.phpbb.com/ と表示されます。
  • phpBB には マジックリンク と呼ばれる機能が備わっています。マジックリンクは構文的に正しい URL をタグなしで自動的にリンク化する機能です。https:// さえ不要です。例えば www.phpbb.com と入力すると自動的に www.phpbb.com と表示されます。
  • 同じ事がメールアドレスにも言えます：

    [email]no.one@domain.adr[/email]

    上記のようにすれば no.one@domain.adr と表示されます。そしてタグをつけずに no.one@domain.adr と入力するだけで自動的にリンク化されます。
URLタグ は [img][/img] （このタグについては次の項目をご参照ください）、[b][/b] など他の全ての BBCodeタグ を囲むことができます。複数のタグを使用する場合は開始タグと終了タグを正しく並べてください。次のタグの使い方は間違っている例です：

[url=https://www.phpbb.com/][img]https://www.phpbb.com/theme/images/logos/blue/160x52.png[/url][/img]

上記の例は誤った並べ方なのでご注意ください。
ページトップ

画像の表示

他サイトの画像を表示させる方法
BBCode には他サイトの画像を記事に表示させるタグが存在します。このタグを使用する上で大切なことが２つあります。１つ目は、大抵の人は画像を大量に表示させるページを嫌がる事です。２つ目は、表示する画像がインターネット上で常に利用可能である事です（ローカルコンピュータにのみ存在する画像を記事に表示させる事はできません。もしできるとすればそのコンピュータがウェブサーバである場合だけです！）。画像を記事に表示させるには画像の URL を [img][/img] で囲みます:

[img]https://www.phpbb.com/theme/images/logos/blue/160x52.png[/img]

画像にリンクを張るには上記を [url][/url] で囲みます：

[url=https://www.phpbb.com/][img]https://www.phpbb.com/theme/images/logos/blue/160x52.png[/img][/url]

は

となります。
ページトップ
添付画像を表示させる方法
記事に添付（アップロード）した画像を文章の中で表示（インライン表示）させるには [attachment=][/attachment] を用います。ただし管理人がファイルの添付機能を許可していて尚且つあなたにファイル添付のパーミッションが与えられている必要があります。記事に画像ファイルを添付すると、添付画像をインライン表示するためのドロップダウンボックス（または各添付画像のインライン表示ボタン）が投稿画面内に表示されます。
ページトップ

その他

独自の BBCodeタグ を追加できますか?
もしあなたが Adminユーザー で且つ BBCode作成 のパーミッションを与えられていれば、Adminコントロールパネル で新しい BBCode を追加できます。
ページトップ

Advanced BBCode Box BBCodes

フォント指定
[font=Comic Sans MS]テキスト[/font]

サンプル:
[font=Comic Sans MS]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/font]

結果:
クイックブラウンキツネは怠惰な犬の上を飛ぶ
ページトップ
ハイライトテキスト
[highlight=yellow]テキスト[/highlight] ※色名の他にRGB形式(#FF0000)も使用できます

サンプル:
[highlight=yellow]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/highlight]

結果:
クイックブラウンキツネは怠惰な犬の上を飛ぶ
ページトップ
テキストの位置揃え
[align=center|left|right|justify]テキスト[/align]

サンプル:
[align=center]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/align]

結果:
クイックブラウンキツネは怠惰な犬の上を飛ぶ
ページトップ
Floatテキスト
[float=left|right]テキスト[/float]

サンプル:
[float=right]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/float]

結果:
クイックブラウンキツネは怠惰な犬の上を飛ぶ
ページトップ
取り消し線テキスト
[s]テキスト[/s]

サンプル:
[s]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/s]

結果:
クイックブラウンキツネは怠惰な犬の上を飛ぶ
ページトップ
下付テキスト
[sub]テキスト[/sub]

サンプル:
[sub]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/sub] クイックブラウンキツネは怠惰な犬の上を飛ぶ

結果:
クイックブラウンキツネは怠惰な犬の上を飛ぶ クイックブラウンキツネは怠惰な犬の上を飛ぶ
ページトップ
上付テキスト
[sup]テキスト[/sup]

サンプル:
[sup]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/sup] クイックブラウンキツネは怠惰な犬の上を飛ぶ

結果:
クイックブラウンキツネは怠惰な犬の上を飛ぶ クイックブラウンキツネは怠惰な犬の上を飛ぶ
ページトップ
光るテキスト
[glow=color]テキスト[/glow]

サンプル:
[glow=red]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/glow]

結果:
クイックブラウンキツネは怠惰な犬の上を飛ぶ
ページトップ
影付きテキスト
[shadow=color]テキスト[/shadow]

サンプル:
[shadow=blue]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/shadow]

結果:
クイックブラウンキツネは怠惰な犬の上を飛ぶ
ページトップ
ドロップシャドウテキスト
[dropshadow=color]テキスト[/dropshadow]

サンプル:
[dropshadow=blue]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/dropshadow]

結果:
クイックブラウンキツネは怠惰な犬の上を飛ぶ
ページトップ
ブラーテキスト
[blur=color]テキスト[/blur]

サンプル:
[blur=blue]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/blur]

結果:
クイックブラウンキツネは怠惰な犬の上を飛ぶ
ページトップ
フェードテキスト
[fade]テキスト[/fade]

サンプル:
[fade]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/fade]

結果:
クイックブラウンキツネは怠惰な犬の上を飛ぶ
ページトップ
固定幅フォントを使用した整形済みテキスト
[pre]テキスト[/pre]

サンプル:
[pre]クイックブラウンキツネは怠惰な犬の上を飛ぶ クイックブラウンキツネは怠惰な犬の上を飛ぶ[/pre]

結果:
クイックブラウンキツネは怠惰な犬の上を飛ぶ
	クイックブラウンキツネは怠惰な犬の上を飛ぶ
ページトップ
テキスト方向
[dir=ltr|rtl]テキスト[/dir]

サンプル:
[dir=rtl]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/dir]

結果:
クイックブラウンキツネは怠惰な犬の上を飛ぶ
ページトップ
マーキーテキスト
[marq=up|down|left|right]テキスト[/marq]

サンプル:
[marq=left]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/marq]

結果:
クイックブラウンキツネは怠惰な犬の上を飛ぶ
ページトップ
スポイラーメッセージ
[spoil]テキスト[/spoil]

サンプル:
[spoil]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/spoil]

結果:
► スポイラーを表示
ページトップ
非ユーザーに見えないテキスト
[hidden]テキスト[/hidden]

サンプル:
[hidden]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/hidden]

結果:
非表示エリア
この非表示エリアを表示するには、登録し、ログインする必要があります。
ページトップ
アラートメッセージ
[mod=username]テキスト[/mod]

サンプル:
[mod="ユーザー名"]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/mod]

結果:
 ! メッセージ from: ユーザー名
クイックブラウンキツネは怠惰な犬の上を飛ぶ
ページトップ
オフトピックメッセージ
[offtopic]テキスト[/offtopic]

サンプル:
[offtopic]クイックブラウンキツネは怠惰な犬の上を飛ぶ[/offtopic]

結果:
オフトピック
クイックブラウンキツネは怠惰な犬の上を飛ぶ
ページトップ
NFOアスキーアートテキスト
[nfo]テキスト[/nfo]

サンプル:
[nfo]༼ つ ◕_◕ ༽つ ʕ•ᴥ•ʔ ¯\_(ツ)_/¯[/nfo]

結果:
༼ つ ◕_◕ ༽つ    ʕ•ᴥ•ʔ   ¯\_(ツ)_/¯
ページトップ
動画を埋め込む(外部サイトから)
[bbvideo]http://video_url[/bbvideo]

サンプル:
[bbvideo]http://www.youtube.com/watch?v=sP4NMoJcFd4[/bbvideo]

結果:
ページトップ