Using BBCode With Your Website

Pitchero now gives you more flexibility when adding content to your website with BBCode.

BBCode allows you to format text, and add links or images to your pages without any knowledge of HTML. To start using BBCode simply add a few extra tags when creating your content and formatting will be added automatically.

Tags are usually indicated by square brackets and looks something like this: [b]This text will be bold[/b]. Remember that every opening tag ([b]) should have a matching closing tag ([/b]) apart from when you are using the [line].

Examples and supported tags:

Example: Formatting text

Example 1
Before: You can make text [b]bold[/b] [i]italic[/i] or [s]crossed out[/s] by adding these short tags
After:
You can make text bold italic or crossed out by adding these short tags
Example 2
Before: You can also wrap text in more than one tag to [b][i]combine formatting[/i][/b].
After:
You can also wrap text in more than one tag to combine formatting.
Back To Top

Example: Resizing text

Example 1
Before: Some content can be made [size=large]larger[/size] or [size=small]smaller[/size] easily.
After:
Some content can be made larger or smaller easily.
Back To Top
Back To Top

Example: Email addresses

Example 1
Before: Linking to an email address is easy [email]anything@example.com[/email]
After:
Linking to an email address is easy anything@example.com
Example 2
Before: As with the [link] tag you can specify alternative clickable text [email=anything@example.com]Email Pitchero Support[/email]
After:
As with the [link] tag you can specify alternative clickable text Email Pitchero Support
Back To Top

Example: Horizontal lines

Example 1
Before: You can break up you content with a horizontal line
[line]
This content will apear after the line.
After:
You can break up you content with a horizontal line


This content will apear after the line.
Back To Top

Example: Images

Example 1
Before: You can add an image with its original dimmensions like this [img]http://www.pitchero.com/bbcode/image.jpg[/img]
After:
You can add an image with its original dimmensions like this
Example 2
Before: Or you can specify a width (in pixels) and the height will be calculated automatically [img=150]http://www.pitchero.com/bbcode/image.jpg[/img]
After:
Or you can specify a width (in pixels) and the height will be calculated automatically
Example 3
Before: Finally you can specify the width and height (respectively) if you want to squash the image [img=150x20]http://www.pitchero.com/bbcode/image.jpg[/img]
After:
Finally you can specify the width and height (respectively) if you want to squash the image
Back To Top

Example: Lists

Example 1
Before: Adding a list can make content more readable. For a standard bullet point list use the following:
[list]
[*]This is the first list item
[*]This is the second list item
[*]And so on - add as many as you like...
[/list]
After:
Adding a list can make content more readable. For a standard bullet point list use the following:
  • This is the first list item
  • This is the second list item
  • And so on - add as many as you like...
Example 2
Before: To make your list numbered simply add "numbered" to your list tag as follows:
[list=numbered]
[*]This is the first list item
[*]This is the second list item
[*]And so on - add as many as you like...
[/list]
After:
To make your list numbered simply add "numbered" to your list tag as follows:
  1. This is the first list item
  2. This is the second list item
  3. And so on - add as many as you like...
Back To Top

Example: Tables

Example 1
Before: To add a table you need to use 3 tags: table, row and cell. Cells go within rows and rows go within a table. A basic table works as follows:

[table]
[row][cell]Row 1, col 1[/cell][cell]Row 1, col 2[/cell][cell]Row 1, col 3[/cell][/row]
[row][cell]Row 2, col 1[/cell][cell]Row 2, col 2[/cell][cell]Row 2, col 3[/cell][/row]
[row][cell]Row 3, col 1[/cell][cell]Row 3, col 2[/cell][cell]Row 3, col 3[/cell][/row]
[/table]

You can add as many rows or columns as you like but note that there should always be the [b]same number of cells in each column[/b]
After:

To add a table you need to use 3 tags: table, row and cell. Cells go within rows and rows go within a table. A basic table works as follows:

Row 1, col 1Row 1, col 2Row 1, col 3
Row 2, col 1Row 2, col 2Row 2, col 3
Row 3, col 1Row 3, col 2Row 3, col 3

You can add as many rows or columns as you like but note that there should always be the same number of cells in each column

Example 2
Before: If you want to merge cells together you can also specify how many to merge:

[table]
[row][cell=2]Row 1, cols 1 & 2[/cell][cell]Row 3, col 3[/cell][/row]
[row][cell]Row 2, col 1[/cell][cell]Row 2, col 2[/cell][cell]Row 2, col 3[/cell][/row]
[row][cell]Row 3, col 1[/cell][cell=2]Row 3, cols 2 & 3[/cell][/row]
[row][cell=3]Row 4, cols 1, 2 & 3[/cell][/row]
[/table]

Once again make sure that all of your columns add up correctly or your table may not display as you would like.
After:

If you want to merge cells together you can also specify how many to merge:

Row 1, cols 1 & 2Row 3, col 3
Row 2, col 1Row 2, col 2Row 2, col 3
Row 3, col 1Row 3, cols 2 & 3
Row 4, cols 1, 2 & 3

Once again make sure that all of your columns add up correctly or your table may not display as you would like.

Back To Top

Example: Google

Example 1
Before: To add a Google Doc, you will need to publish the Google Doc to the web. To do this from the Google Doc you want to embed click 'File' then 'Publish to the web...'. Ensure Link is selected and click the button 'Publish'. Copy the URL and paste between [googledoc] and [/googledoc]
After:
To add a Google Doc, you will need to publish the Google Doc to the web. To do this from the Google Doc you want to embed click 'File' then 'Publish to the web...'. Ensure Link is selected and click the button 'Publish'. Copy the URL and paste between [googledoc] and [/googledoc]
Example 2
Before: To add a Google Sheet, you will need to publish the Google Sheet to the web. To do this from the Google Sheet you want to embed click 'File' then 'Publish to the web...'. Ensure Link is selected and choose either 'Entire Document' or the sheet you want to embed. Click the button 'Publish' and copy the URL and paste between [googlesheet] and [/googlesheet]
After:
To add a Google Sheet, you will need to publish the Google Sheet to the web. To do this from the Google Sheet you want to embed click 'File' then 'Publish to the web...'. Ensure Link is selected and choose either 'Entire Document' or the sheet you want to embed. Click the button 'Publish' and copy the URL and paste between [googlesheet] and [/googlesheet]
Example 3
Before: From the Google Form you want to embed click 'File' then 'Send form...'. Copy the URL and paste between [googleform] and [/googleform]
After:
From the Google Form you want to embed click 'File' then 'Send form...'. Copy the URL and paste between [googleform] and [/googleform]
Back To Top