Weaver BBcode Guide

This thread will lay out and explain all the BBcode tags that are available to a Weaver Forum base install.

[b]/[u]/[i]/[s] - Basic Formatting

[b], [u], [i], and [s] are some basic formatting tools you'll use constantly.

• Code:
  [b]Bold Text[/b]
[u]Underlined Text[/u]
[s]Struck Through Text[/s]
[i]Italic Text[/i]

• Examples:
  Bold Text
  Underlined Text
  Struck Through Text
  Italic Text

---

[color] - Adding Some Flair

[color] allows you to change the color of your text. You can give either a CSS color name (red, blue, green, etc) or a color hex code in the style of #fff or #ffffff.

• Code:
  [color=white]White text[/color]
[color=green]Green Text[/color]
[color=blue]Blue Text[/color]
[color=#FF6961]Pastel Red Text[/color]
[color=#7e7]Pastel Green Text[/color]
• Examples:
  White text
  Green Text
  Blue Text
  Pastel Red Text
  Pastel Green Text

---

[size] - Text Size

[size] allows you to change the size of your text. The size is given in pixels.

• Code:
  [size=30]Large text.[/size]
[size=10]Small text.[/size]
• Examples:
  Large text.
  Small text.

---

[center]/[right] - Justifying Your Text

[center] and [\right] allows you to center or right justify your text.

• Code:
  
[center]Center-justified text.[/center]
[right]Right-justified text.[/right]
• Examples:
  Center-justified text.
  
  Right-justified text.

---

[hr] - Horizontal Rule

[hr] allow you to create a horizontal rule that separates your posts.

• Code: [hr]
• Example:
  

  ---

---

[toc] - Table of Contents

[toc] allow you to automatically create a Table of Contents for your post that's generated from all the [tocanchor] tags that follow it.

• Code: [toc]
• Example: See the top of this post.

---

[tocanchor] - ToC Anchor Link

[tocanchor] allows you to create a mid-post link. This allows you link someone directly to a specific portion of your post. [tocanchor] also auto populates the table of contents, if there is one.

• Code: [tocanchor=exampletocanchor][b][tocanchor]'s[/b] Example[/tocanchor]
• Example: [tocanchor]'s Example

---

[anchor] - Anchor Link

[anchor] allows you to create a mid-post link. This allows you link someone directly to a specific portion of your post. [anchor], however, does NOT auto populates the table of contents, if there is one.

• Code: [anchor=exampleanchor][anchor]'s Example[/anchor]
• Example: [anchor]'s Example

---

[toclink] - Arbitrary ToC Link

[toclink] allows you to add arbitrary links to your table of contents. The URL within must start with http:// or https:// for safety. The link will be invisible within your post, and it will be positioned in your table of contents relative to any [tocanchor] or other [toclink]s before and after it.

• Code: [toclink=https://weaverforum.com][b][toclink]'s[/b] Example[/toclink]
• Example:

---

[pre] - Preformatted

[pre] preservers formatting, especially spaces.

• Code:

  [pre]start                       several spaces      away[/pre]

• Example:

  start                       several spaces      away

---

[sub]/[sup] - Subscript and Superscript

[sub] and [sup] allow you to add superscripts and subscripts to your post.

• Code: normal text | [sub]subscript text[/sub] | [sup]superscript text[/sup] | normal text
• Example: normal text | _{subscript text} | ^{superscript text} | normal text

---

[spoiler] - Spoiler Tag

[spoiler] allows you hide things behind a preview message that allows others to not be spoiled.

• Code: [spoiler=Citizen Kane]It was his sled.[/spoiler]
• Example:
  Spoiler: Citizen Kane

  It was his sled.

---

[toggle] - Toggle Large Sections

[toggle] is very similar to spoiler, but allows you to hide and show large sections of text easily.

• Code: [toggle=lorem ipsum...]Lorem ipsum dolor sit amet, consectetur adipiscing elit.[/toggle]
• Example:
  lorem ipsum...

  Lorem ipsum dolor sit amet, consectetur adipiscing elit.

---

[tooltip] - Text With a Tooltip

[tooltip] allows you to add hover text to your writings.

• Code: [tooltip=Weaver Forum Software]WFS[/tooltip]
• Example: WFS

---

[table] - Table (And Its Related Tags)

[table] allows you to create a simple table for your post.

• Code:
  [table][thead]
[tr]
[th]Header 1[/th]
[th]Header 2[/th]
[th]Header 3[/th]
[/tr]
[/thead][tbody]
[tr]
[td]Row 1, Column 1[/td]
[td]Row 1, Column 2[/td]
[td]Row 1, Column 3[/td]
[/tr][tr]
[td]Row 2, Column 1[/td]
[td]Row 2, Column 2[/td]
[td]Row 2, Column 3[/td]
[/tr]
[/tbody][/table]
• Example:
  

  Header 1	Header 2	Header 3
  Row 1, Column 1	Row 1, Column 2	Row 1, Column 3
  Row 2, Column 1	Row 2, Column 2	Row 2, Column 3

---

[code] - Display Code

[code] allows you to show code easily. BBcode is not parsed within a code tag.

• Code: [code][b]test[/b][/code]
• Example: [b]test[/b]
• Extra Formatting Tips: If you just need to show a BBcode without the formality of a [code] tag, you can place a backslash prior to the tag to show it, like so: \[tag]
• If you have a lot of code, you can wrap the [code] tag in [pre] tags to get a code block.

---

[url] - Linking to a Website

[url] lets you create a link to a website. Note that the link you give MUST start with either http:// or https://, this is for security reasons to keep you safe!

• Code: [url=https://google.com]Google Link[/url]
• Example: Google Link

---

[tabs]/[tab] - Creating Tabbed Content

[tabs] and [tab] allows you to create tabbed 'panes' that your readers can click through.

• Code:
  
[tabs]
[tab=First Tab]
First Tab content here. [b]BBcode is, of course, parsed here.[/b]
[/tab]
[tab=Second Tab]
Second Tab Content.
[/tab]
[/tabs]
• Example:
  
  
  First Tab

  
  First Tab content here. BBcode is, of course, parsed here.
  

  Second Tab

  
  Second Tab Content.
  

  
  

---

[img] - Adding Images

[img] adds an image to your post.

• Code: [img]https://i.imgur.com/6OA4EDB.png[/img]
• Example:
  

---

[youtube] - Emedding YouTube Videos

[youtube] embeds a YouTube video into your post. You'll need to ID of the youtube video, which is usually the collection of character at the end of the URL for the video.

• Code: [youtube=4ZX9T0kWb4Y]
• Example:
  

---

[quote] - Reference Another's Words

[quote] allows you to quote or reference something someone else said.

• Code: [quote=Gandalf]You shall not pass![/quote]
• Example:
  

  You shall not pass!
  -Gandalf

---

[list]/[li] - Creating a List of Items

[list] signals the start of a list. [li] indicates a list item.

• Code:
  [list]
[li] Item 1[/li]
[li] Item 2[/li]
[li] Item 3[/li]
[/list]

• Example:
  
  • Item 1
  • Item 2
  • Item 3

---

Hopefully this helps.

This thread will lay out and explain all the BBcode tags that are available to a Weaver Forum base install. [toc] [h3][tocanchor=formattingtag][b]\[b]/\[u]/\[i]/\[s][/b] - Basic Formatting[/tocanchor][/h3] \[b], \[u], \[i], and \[s] are some basic formatting tools you'll use constantly. [list] [li]Code: [code][b]Bold Text[/b] [u]Underlined Text[/u] [s]Struck Through Text[/s] [i]Italic Text[/i] [/code][/li] [li]Examples: [b]Bold Text[/b] [u]Underlined Text[/u] [s]Struck Through Text[/s] [i]Italic Text[/i][/li] [/list] [hr] [h3][tocanchor=colortags][b]\[color][/b] - Adding Some Flair[/tocanchor][/h3] \[color] allows you to change the color of your text. You can give either a CSS color name (red, blue, green, etc) or a color hex code in the style of #fff or #ffffff. [list] [li]Code: [code][color=white]White text[/color] [color=green]Green Text[/color] [color=blue]Blue Text[/color] [color=#FF6961]Pastel Red Text[/color] [color=#7e7]Pastel Green Text[/color][/code][/li] [li]Examples: [color=white]White text[/color] [color=green]Green Text[/color] [color=blue]Blue Text[/color] [color=#FF6961]Pastel Red Text[/color] [color=#7e7]Pastel Green Text[/color][/li] [/list] [hr] [h3][tocanchor=sizetag][b]\[size][/b] - Text Size[/tocanchor][/h3] \[size] allows you to change the size of your text. The size is given in pixels. [list] [li]Code: [code][size=30]Large text.[/size] [size=10]Small text.[/size][/code][/li] [li]Examples: [size=30]Large text.[/size] [size=10]Small text.[/size][/li] [/list] [hr] [h3][tocanchor=justifytags][b]\[center]/\[right][/b] - Justifying Your Text[/tocanchor][/h3] \[center] and [\right] allows you to center or right justify your text. [list] [li]Code: [code] [center]Center-justified text.[/center] [right]Right-justified text.[/right][/code][/li] [li]Examples: [center]Center-justified text.[/center] [right]Right-justified text.[/right][/li] [/list] [hr] [h3][tocanchor=hrtag][b]\[hr][/b] - Horizontal Rule[/tocanchor][/h3] \[hr] allow you to create a horizontal rule that separates your posts. [list] [li]Code: [code][hr][/code][/li] [li]Example: [hr][/li] [/list] [hr] [h3][tocanchor=toctag][b]\[toc][/b] - Table of Contents[/tocanchor][/h3] \[toc] allow you to automatically create a Table of Contents for your post that's generated from all the \[tocanchor] tags that follow it. [list] [li]Code: [code][toc][/code][/li] [li]Example: See the top of this post.[/li] [/list] [hr] [h3][tocanchor=tocanchortag][b]\[tocanchor][/b] - ToC Anchor Link[/tocanchor][/h3] \[tocanchor] allows you to create a mid-post link. This allows you link someone directly to a specific portion of your post. \[tocanchor] also auto populates the table of contents, if there is one. [list] [li]Code: [code][tocanchor=exampletocanchor][b]\[tocanchor]'s[/b] Example[/tocanchor][/code][/li] [li]Example: [tocanchor=exampletocanchor][b]\[tocanchor]'s[/b] Example[/tocanchor][/li] [/list] [hr] [h3][tocanchor=tocanchortag][b]\[anchor][/b] - Anchor Link[/tocanchor][/h3] \[anchor] allows you to create a mid-post link. This allows you link someone directly to a specific portion of your post. \[anchor], however, does NOT auto populates the table of contents, if there is one. [list] [li]Code: [code][anchor=exampleanchor]\[anchor]'s Example[/anchor][/code][/li] [li]Example: [anchor=exampleanchor]\[anchor]'s Example[/anchor][/li] [/list] [hr] [h3][tocanchor=tocanchortag][b]\[toclink][/b] - Arbitrary ToC Link[/tocanchor][/h3] \[toclink] allows you to add arbitrary links to your table of contents. The URL within must start with http:// or https:// for safety. The link will be invisible within your post, and it will be positioned in your table of contents relative to any \[tocanchor] or other \[toclink]s before and after it. [list] [li]Code: [code][toclink=https://weaverforum.com][b]\[toclink]'s[/b] Example[/toclink][/code][/li] [li]Example: [toclink=https://weaverforum.com][b]\[toclink]'s[/b] Example[/toclink][/li] [/list] [hr] [h3][tocanchor=pretag][b]\[pre][/b] - Preformatted[/tocanchor][/h3] \[pre] preservers formatting, especially spaces. [list] [li]Code: [pre][code]\[pre]start several spaces away\[/pre][/code][/pre][/li] [li]Example: [pre]start several spaces away[/pre][/li] [/list] [hr] [h3][tocanchor=subsuptag][b]\[sub][/b]/[b]\[sup][/b] - Subscript and Superscript[/tocanchor][/h3] \[sub] and \[sup] allow you to add superscripts and subscripts to your post. [list] [li]Code: [code]normal text | [sub]subscript text[/sub] | [sup]superscript text[/sup] | normal text[/code][/li] [li]Example: normal text | [sub]subscript text[/sub] | [sup]superscript text[/sup] | normal text[/li] [/list] [hr] [h3][tocanchor=spoilertag][b]\[spoiler][/b] - Spoiler Tag[/tocanchor][/h3] \[spoiler] allows you hide things behind a preview message that allows others to not be spoiled. [list] [li]Code: [code][spoiler=Citizen Kane]It was his sled.[/spoiler][/code][/li] [li]Example: [spoiler=Citizen Kane]It was his sled.[/spoiler][/li] [/list] [hr] [h3][tocanchor=toggletag][b]\[toggle][/b] - Toggle Large Sections[/tocanchor][/h3] \[toggle] is very similar to spoiler, but allows you to hide and show large sections of text easily. [list] [li]Code: [code][toggle=lorem ipsum...]Lorem ipsum dolor sit amet, consectetur adipiscing elit.[/toggle][/code][/li] [li]Example: [toggle=lorem ipsum...]Lorem ipsum dolor sit amet, consectetur adipiscing elit.[/toggle][/li] [/list] [hr] [h3][tocanchor=tooltiptag][b]\[tooltip][/b] - Text With a Tooltip[/tocanchor][/h3] \[tooltip] allows you to add hover text to your writings. [list] [li]Code: [code][tooltip=Weaver Forum Software]WFS[/tooltip][/code][/li] [li]Example: [tooltip=Weaver Forum Software]WFS[/tooltip][/li] [/list] [hr] [h3][tocanchor=tabletag][b]\[table][/b] - Table (And Its Related Tags)[/tocanchor][/h3] \[table] allows you to create a simple table for your post. [list] [li]Code: [code][table][thead] [tr] [th]Header 1[/th] [th]Header 2[/th] [th]Header 3[/th] [/tr] [/thead][tbody] [tr] [td]Row 1, Column 1[/td] [td]Row 1, Column 2[/td] [td]Row 1, Column 3[/td] [/tr][tr] [td]Row 2, Column 1[/td] [td]Row 2, Column 2[/td] [td]Row 2, Column 3[/td] [/tr] [/tbody][/table][/code][/li] [li]Example: [table][thead] [tr] [th]Header 1[/th] [th]Header 2[/th] [th]Header 3[/th] [/tr] [/thead][tbody] [tr] [td]Row 1, Column 1[/td] [td]Row 1, Column 2[/td] [td]Row 1, Column 3[/td] [/tr][tr] [td]Row 2, Column 1[/td] [td]Row 2, Column 2[/td] [td]Row 2, Column 3[/td] [/tr] [/tbody][/table][/li] [/list] [hr] [h3][tocanchor=codetag][b]\[code][/b] - Display Code[/tocanchor][/h3] \[code] allows you to show code easily. BBcode is not parsed within a code tag. [list] [li]Code: [code]\[code][b]test[/b]\[/code][/code][/li] [li]Example: [code][b]test[/b][/code][/li] [li]Extra Formatting Tips: If you just need to show a BBcode without the formality of a \[code] tag, you can place a backslash prior to the tag to show it, like so: \\[tag][/li] [li] If you have a lot of code, you can wrap the \[code] tag in \[pre] tags to get a code block.[/li] [/list] [hr] [h3][tocanchor=urltag][b]\[url][/b] - Linking to a Website[/tocanchor][/h3] \[url] lets you create a link to a website. Note that the link you give MUST start with either [code]http://[/code] or [code]https://[/code], this is for security reasons to keep you safe! [list] [li]Code: [code][url=https://google.com]Google Link[/url][/code][/li] [li]Example: [url=https://google.com]Google Link[/url][/li] [/list] [hr] [h3][tocanchor=tabtag][b]\[tabs]/\[tab][/b] - Creating Tabbed Content[/tocanchor][/h3] \[tabs] and \[tab] allows you to create tabbed 'panes' that your readers can click through. [list] [li]Code: [code] [tabs] [tab=First Tab] First Tab content here. [b]BBcode is, of course, parsed here.[/b] [/tab] [tab=Second Tab] Second Tab Content. [/tab] [/tabs][/code][/li] [li]Example: [tabs] [tab=First Tab] First Tab content here. [b]BBcode is, of course, parsed here.[/b] [/tab] [tab=Second Tab] Second Tab Content. [/tab][/tabs][/li] [/list] [hr] [h3][tocanchor=imgtag][b]\[img][/b] - Adding Images[/tocanchor][/h3] \[img] adds an image to your post. [list] [li]Code: [code][img]https://i.imgur.com/6OA4EDB.png[/img][/code][/li] [li]Example: [img]https://i.imgur.com/6OA4EDB.png[/img][/li] [/list] [hr] [h3][tocanchor=youtubetag][b]\[youtube][/b] - Emedding YouTube Videos[/tocanchor][/h3] \[youtube] embeds a YouTube video into your post. You'll need to ID of the youtube video, which is usually the collection of character at the end of the URL for the video. [list] [li]Code: [code][youtube=4ZX9T0kWb4Y][/code][/li] [li]Example: [youtube=4ZX9T0kWb4Y][/li] [/list] [hr] [h3][tocanchor=quotetag][b]\[quote][/b] - Reference Another's Words[/tocanchor][/h3] \[quote] allows you to quote or reference something someone else said. [list] [li]Code: [code][quote=Gandalf]You shall not pass![/quote][/code][/li] [li]Example: [quote=Gandalf]You shall not pass![/quote][/li] [/list] [hr] [h3][tocanchor=listtag][b]\[list]/\[li][/b] - Creating a List of Items[/tocanchor][/h3] \[list] signals the start of a list. \[li] indicates a list item. [list] [li]Code: [code]\[list] \[li] Item 1\[/li] \[li] Item 2\[/li] \[li] Item 3\[/li] \[/list] [/code][/li] [li]Example: [list] [li] Item 1[/li] [li] Item 2[/li] [li] Item 3[/li] [/list] [/li] [/list] [hr] Hopefully this helps.