Discuss Scratch

nXIII
Scratcher
1000+ posts

iTopic - BBCode Help

BBCode Help
BBCode allows you to add formatting to your posts on this forum. It uses tags (marked by square brackets), which you can type by hand or add using the toolbar at the top of the post editor. This guide offers a short introduction as well as a reference source for BBCode on the Scratch Forums.

Text
These tags allow you to change the color and style of text.

[b] — bold text (Ctrl+B)
Makes text bold. Often used to add emphasis or make small headings.
[b]example phrase[/b] —> example phrase

[i] — italic text (Ctrl+I)
Makes text italic. Often used to add emphasis or mark the titles of books or other works.
[i]example phrase[/i] —> example phrase

[u] — underlined text (Ctrl+U)
Adds a line below text. Use sparingly, as underlined text can often be confused with links.
[u]example phrase[/u] —> example phrase

[color=color] — colored text
Changes the color of text. See here for a full list of color names, and here for a color picker that will generate color codes for you.
[color=red]example phrase[/color] —> example phrase
[color=blue]example phrase[/color] —> example phrase
[color=#a5d]example phrase[/color] —> example phrase

[s] — struck-through text (Ctrl+S)
Adds a line through text. Often used to mark deletions or alterations in posts.
[s]example phrase[/s] —> example phrase

[big] — big text
Makes text big. Often used for headers. Use sparingly, as a lot of large text can be annoying.
[big]example phrase[/big] —> example phrase

[small] — small text
Makes text small. Often used in signatures.
[small]example phrase[/small] —> example phrase

Links
Most links will automatically be hyperlinked. For example, http://www.google.com/ —> http://www.google.com/. You can also use the [url] tag or a shortcut link tag (like [wiki] or [dict]).

Note: If you are new to the forums (a New Scratcher), you may not be able to post links and images. If you are active on the main site and the forums for a while you will become a Scratcher and be able to post links and images.

[url] — link (Ctrl+L)
Adds a link. You can specify a link location or use the text of the link.
[url]http://www.google.com/[/url] —> http://www.google.com/
[url=http://www.google.com/]Google[/url] —> Google

[wiki] — Scratch Wiki article link
Adds a link to a Scratch Wiki article.
[wiki]Scratch (programming language)[/wiki] —> Scratch (programming language)

[wp] — Wikipedia article link
Adds a link to a wikipedia article.
[wp]Scratch (programming language)[/wp] —> Scratch (programming language)

[google] — Google search link
Adds a link to a Google search for a term.
[google]Scratch[/google] —> Scratch

[dictionary] — dictionary link
Adds a link to a dictionary definition of a word.
[dictionary]imagine[/dictionary] —> imagine

Tip: You can use [dict] as a shortcut for [dictionary]
[dict]share[/dict] —> share

Images
Note: If you are new to the forums (a New Scratcher), you may not be able to post links and images. If you are active on the main site and the forums for a while you will become a Scratcher and be able to post links and images.

[img] — image (Ctrl+P)
Adds an image. Images must be hosted on one of the following sites:
  • cubeupload.com
  • imageshack.us
  • photobucket.com
  • scratch-dach.info
  • wikipedia.org
  • wikimedia.org
  • Any .edu domain
  • tinypic.com (kept for old posts - NOT recommended for new posts because of malware and ads)
[img]http://scratch.mit.edu/scratchr2/static/images/logo_sm.png[/img] —>

Lists
These tags allow you to add both ordered (marked with 1, 2, 3…) and unordered (marked with a bullet “•” or other character) lists to your posts.

[list] — unordered list
Adds an unordered list.

[list]
[*]imagine
[*]program
[*]share
[/list]

Produces:

  • imagine
  • program
  • share

[list=symbol] — ordered list
Adds an ordered list. Symbol specifies the starting symbol (1 or a).

[list=1]
[*]lather
[*]rinse
[*]repeat
[/list]

Produces:

  1. lather
  2. rinse
  3. repeat

[list=a]
[*]10
[*]10,000
[*]10,000,000
[/list]

Produces:

  1. 10
  2. 10,000
  3. 10,000,000

Smilies
Some emoticons will be automatically be converted to images.

:) —>
:| —>
:( —>
:D —>
:o —>
;) —>
:/ —>
:P —>
:lol: —>
:mad: —>
:rolleyes: —>
:cool: —>

Quotes
You can click the Quote button on any post to automatically add the quote BBCode to your post, or manually add the quote using the [quote] tag.

[quote] — quote box
Adds a quote box. You can specify an author with [quote=author].
[quote]Example quote[/quote] —>
Example quote
[quote=Someone]Example quote[/quote] —>

Someone wrote:

Example quote

Code
You can use the [code] tag to display sections of code in a monospaced font. Tags within the [code] tag (other than [/code]) will not have any effect.

[code] — source code
Adds block of code.
[code]example[/code] —>
example

[code=language] — source code
Adds block of code with syntax highlighting. You can use any of the languages supported by pygments. See here for a full list.

[code=javascript]alert('imagine, program, share!');[/code] —>
alert('imagine, program, share!');

Tips
Text in brackets will confuse the BBCode parser—it thinks it's a tag. You can put [] inside the brackets to prevent this from happening:
some [example] text —> some text
some [[]example] text —> some [example] text

You can nest tags to apply more than one kind of formatting to a region of text.
[b][i]example phrase[/i][/b] —> example phrase

The editor has a few keyboard shortcuts that will add tags around the text you have selected. The keyboard shortcuts are listed after to their corresponding command in this help. For example, pressing Ctrl+B will add [b][/b] around your selection, or insert it around the caret if your selection is empty.

Last edited by Paddle2See (Dec. 8, 2014 03:15:38)


nXIII · GitHub
lightnin100
Scratcher
14 posts

iTopic - BBCode Help

This is awesome!
Hardmath123
Scratcher
1000+ posts

iTopic - BBCode Help

Wow… all those link shortcuts are great! I'd suggest adding in the list of languages supported by the code tag.

Your ordered lists didn't seem to be numbered.
EDIT: the list-style properties seem to be messing up WebKit rendering…
EDIT2: http://alpha.scratch.mit.edu/forums/topic/999/

Last edited by Hardmath123 (Jan. 20, 2013 05:05:07)

veggieman001
Scratcher
1000+ posts

iTopic - BBCode Help

Nothing is permanent.

Last edited by veggieman001 (July 16, 2013 23:47:03)


nXIII
Scratcher
1000+ posts

iTopic - BBCode Help

veggieman001
Now it just looks like you're unsure about all of your examples
Yep?

nXIII · GitHub
LS97
Scratcher
100+ posts

iTopic - BBCode Help

nXIII
veggieman001
Now it just looks like you're unsure about all of your examples
Yep?


====
I didn't know all these tags existed. Maybe wiki should point to the scratch wiki instead (edit: oh.)

Last edited by LS97 (Jan. 20, 2013 12:06:49)


Retired Scratcher • Aspiring information systems engineer
scimonster
Scratcher
1000+ posts

iTopic - BBCode Help

I stickied this because it's so useful. Thanks for writing this up, nXIII!

Retired Community Moderator
BTW, i run Google Chrome 41.0.2272.101 on a Linux system - Ubuntu 14.04. NEW: iPad 4th gen. w/retina.

418 I'm a teapot (original - to be read by bored computer geeks)
THE GAME (you just lost)
; THE SEMICOLON LIVES ON IN OUR SIGS
nXIII
Scratcher
1000+ posts

iTopic - BBCode Help

No problem

nXIII · GitHub
Hardmath123
Scratcher
1000+ posts

iTopic - BBCode Help

You know you can codify BBcode?
[b]This[/b] [i]is[/i] [u]weird[/u], [color=blue]right?[/color]
nXIII
Scratcher
1000+ posts

iTopic - BBCode Help

Hardmath123
You know you can codify BBcode?
[b]This[/b] [i]is[/i] [u]weird[/u], [color=blue]right?[/color]
Yep

I wanted the examples inline, but once we get unified quote/code boxes I might switch all of them to [code] tags. (Right now it just looks weird )

Last edited by nXIII (Jan. 21, 2013 13:15:52)


nXIII · GitHub
Hardmath123
Scratcher
1000+ posts

iTopic - BBCode Help

Unified quote/code boxes? What does that mean? Anyway, it does indeed look weird (maybe because I was always against having bold/italics in syntax highlighting—colors are enough).
nXIII
Scratcher
1000+ posts

iTopic - BBCode Help

Hardmath123
Unified quote/code boxes? What does that mean?
The code boxes and quote boxes look really different; they should have the same borders and stuff.

Anyway, it does indeed look weird (maybe because I was always against having bold/italics in syntax highlighting—colors are enough).
Yeah, if you use a nice font like Menlo or Consolas it looks much better without additional font weight.


Sublime Text 2 <3

EDIT: Gah, no love for Unicode hearts

Last edited by nXIII (Jan. 22, 2013 01:39:11)


nXIII · GitHub
Hardmath123
Scratcher
1000+ posts

iTopic - BBCode Help

Xcode? I do like Menlo, though, it's quite nice and easy to read.
nXIII
Scratcher
1000+ posts

iTopic - BBCode Help

Hardmath123
Xcode? I do like Menlo, though, it's quite nice and easy to read.
That's a screenshot of Sublime Text 2. I don't like Xcode's text editor very much.

nXIII · GitHub
barndawg
Scratcher
37 posts

iTopic - BBCode Help

I never knew that there was a code BBcode tag!
@echo off
echo Cool!

Last edited by barndawg (Jan. 23, 2013 16:58:55)


Self-proclaimed geek, obsessed with good design & pens, who plays the Guitar & Theremin between coding in JavaScript & Scratch and battles in Robocraft!
Hardmath123
Scratcher
1000+ posts

iTopic - BBCode Help

For some reason URLs aren't working anymore. They don't seem to be recognized:

http://scratchexp.media.mit.edu/issues/426

And an explicit url= with a gdocs link failed, too.

Did you change anything?
nXIII
Scratcher
1000+ posts

iTopic - BBCode Help

http://beta.scratch.mit.edu/forums/topic/1057/

It's a permissions issue, and we're working on it.

nXIII · GitHub
Devloper123
Scratcher
58 posts

iTopic - BBCode Help

Yey 2.0 Beta's out
maxamillion321
Scratcher
100+ posts

iTopic - BBCode Help

Why not imgur for a image host? It was on 1.4.
MrFlash67
Scratcher
500+ posts

iTopic - BBCode Help

SMALL CAPS ARE EPIC!
S[small]MALL CAPS ARE EPIC[/small]!

PS1='C:${PWD//\//\\\}>'

Powered by DjangoBB

Standard | Mobile