friendica-github/doc/BBCode.md
Hypolite Petovan 106f003447 bbcode documentation: BBCodes.md complete rewrite
- Switched to table display to put BBCodes and result side-by-side
- Added all missing BBCodes
2016-11-02 22:42:19 -04:00

16 KiB

Friendica BBCode tags reference

Inline

BBCode Result
[b]bold[/b] bold
[i]italic[/i] italic
[u]underlined[/u] underlined
[s]strike[/s] strike
[o]overline[/o] overline
[color=red]red[/color] red
[url=http://www.friendica.com]Friendica[/url] Friendica
[img]http://friendica.com/sites/default/files/friendika-32.png[/img] Immagine/foto
[img=64x32]http://friendica.com/sites/default/files/friendika-32.png[/img]

Note: provided height is simply discarded.
[size=xx-small]small text[/size] small text
[size=xx-large]big text[/size] big text
[size=20]exact size[/size] (size can be any number, in pixel) exact size
[font=serif]Serif font[/font] Serif font
BBCode Result
[url]http://friendica.com[/url] http://friendica.com
[url=http://friendica.com]Friendica[/url] Friendica
[bookmark]http://friendica.com[/bookmark]

#^[url]http://friendica.com[/url]

Friendica: http://friendica.com

[bookmark=http://friendica.com]Bookmark[/bookmark]

#^[url=http://friendica.com]Bookmark[/url]

#[url=http://friendica.com]^[/url][url=http://friendica.com]Bookmark[/url]

Friendica: Bookmark

[url=/posts/f16d77b0630f0134740c0cc47a0ea02a]Diaspora post with GUID[/url] Diaspora post with GUID
#Friendica #Friendica
@Mention @Mention
acct:account@friendica.host.com (WebFinger) acct:account@friendica.host.com
[mail]user@mail.example.com[/mail] user@mail.example.com
[mail=user@mail.example.com]Send an email to User[/mail] Send an email to User

Blocks

BBCode Result
[p]A paragraph of text[/p]

A paragraph of text

Inline [code]code[/code] in a paragraph Inline code in a paragraph
[code]Multi
line
code[/code]
Multi line code
[code=php]function text_highlight($s,$lang)[/code]
  1.  function text_highlight($s,$lang)
[quote]quote[/quote]
quote
[quote=Author]Author? Me? No, no, no...[/quote] Author wrote:
Author? Me? No, no, no...
[center]Centered text[/center]
Centered text
You should not read any further if you want to be surprised.[spoiler]There is a happy end.[/spoiler]
You should not read any further if you want to be surprised.
Click to open/close
There is a happy end.
[spoiler=Author]Spoiler quote[/spoiler]
Author wrote:
Click to open/close
Spoiler quote
[hr] (horizontal line)

Titles

BBCode Result
[h1]Title 1[/h1]

Title 1

[h2]Title 2[/h2]

Title 2

[h3]Title 3[/h3]

Title 3

[h4]Title 4[/h4]

Title 4

[h5]Title 5[/h5]
Title 5
[h6]Title 6[/h6]
Title 6

Tables

BBCode Result
[table]
  [tr]
    [th]Header 1[/th]
    [th]Header 2[/th]
    [th]Header 2[/th]
  [/tr]
  [tr]
    [td]Cell 1[/td]
    [td]Cell 2[/td]
    [td]Cell 3[/td]
  [/tr]
  [tr]
    [td]Cell 4[/td]
    [td]Cell 5[/td]
    [td]Cell 6[/td]
  [/tr]
[/table]
Header 1 Header 2 Header 3
Cell 1 Cell 2 Cell 3
Cell 4 Cell 5 Cell 6
[table border=0]
Header 1 Header 2 Header 3
Cell 1 Cell 2 Cell 3
Cell 4 Cell 5 Cell 6
[table border=1]
Header 1 Header 2 Header 3
Cell 1 Cell 2 Cell 3
Cell 4 Cell 5 Cell 6

Lists

BBCode Result
[ul]
  [li] First list element
  [li] Second list element
[/ul]
[list]
  [*] First list element
  [*] Second list element
[/list]
  • First list element
  • Second list element
[ol]
  [*] First list element
  [*] Second list element
[/ol]
[list=1]
  [*] First list element
  [*] Second list element
[/list]
  • First list element
  • Second list element
[list=]
  [*] First list element
  [*] Second list element
[/list]
  • First list element
  • Second list element
[list=i]
  [*] First list element
  [*] Second list element
[/list]
  • First list element
  • Second list element
[list=I]
  [*] First list element
  [*] Second list element
[/list]
  • First list element
  • Second list element
[list=a]
  [*] First list element
  [*] Second list element
[/list]
  • First list element
  • Second list element
[list=A]
  [*] First list element
  [*] Second list element
[/list]
  • First list element
  • Second list element

Embed

You can embed video, audio and more in a message.

BBCode Result
[video]url[/video] Where *url* can be an url to youtube, vimeo, soundcloud, or other sites wich supports oembed or opengraph specifications.
[video]Video file url[/video] [audio]Audio file url[/audio] Full URL to an ogg/ogv/oga/ogm/webm/mp4/mp3 file. An HTML5 player will be used to show it.
[youtube]Youtube URL[/youtube] Youtube video OEmbed display. May not embed an actual player.
[youtube]Youtube video ID[/youtube] Youtube player iframe embed.
[vimeo]Vimeo URL[/vimeo] Vimeo video OEmbed display. May not embed an actual player.
[vimeo]Vimeo video ID[/vimeo] Vimeo player iframe embed.
[iframe]URL[/iframe] General embed, iframe size is limited by the theme size for video players.
[url]*url*[/url] If *url* supports oembed or opengraph specifications the embedded object will be shown (eg, documents from scribd). Page title with a link to *url* will be shown.

Map

This require "openstreetmap" addon version 1.3 or newer. If the addon isn't activated, the raw coordinates are shown instead.

BBCode Result
[map]address[/map] Embeds a map centered on this address.
[map=lat,long] Embeds a map centered on those coordinates.
[map] Embeds a map centered on the post's location.

Abstract for longer posts

If you want to spread your post to several third party networks you can have the problem that these networks have a length limitation like on Twitter.

Friendica is using a semi intelligent mechanism to generate a fitting abstract. But it can be interesting to define a custom abstract that will only be displayed on the external network. This is done with the [abstract]-element.

BBCode Result
[abstract]Totally interesting! A must-see! Please click the link![/abstract]
I want to tell you a really boring story that you really never wanted to hear.
Twitter would display the text "Totally interesting! A must-see! Please click the link!". On Friendica you would only see the text after "I want to tell you a really ..."

It is even possible to define abstracts for separate networks:

BBCode Result
[abstract]Hi friends Here are my newest pictures![/abstract]
[abstract=twit]Hi my dear Twitter followers. Do you want to see my new pictures?[/abstract]
[abstract=apdn]Helly my dear followers on ADN. I made sone new pictures that I wanted to share with you.[/abstract]
Today I was in the woods and took some real cool pictures ...
For Twitter and App.net the system will use the defined abstracts.
For other networks (e.g. when you are using the "statusnet" connector that is used to post to GNU Social) the general abstract element will be used.

If you use (for example) the "buffer" connector to post to Facebook or Google+ you can use this element to define an abstract for a longer blogpost that you don't want to post completely to these networks.

Networks like Facebook or Google+ aren't length limited. For this reason the [abstract] element isn't used. Instead you have to name the explicit network:

BBCode Result
[abstract]These days I had a strange encounter...[/abstract]
[abstract=goog]Helly my dear Google+ followers. You have to read my newest blog post![/abstract]
[abstract=face]Hello my Facebook friends. These days happened something really cool.[/abstract]
While taking pictures in the woods I had a really strange encounter...
Google and Facebook will show the respective abstracts while the other networks will show the default one.

Meanwhile, Friendica won't show any of the abstracts.

The [abstract] element isn't working with the native OStatus connection or with connectors where we post the HTML like Tumblr, Wordpress or Pump.io.

Special

BBCode Result
If you need to put literal bbcode in a message, [noparse], [nobb] or [pre] are used to escape bbcode:
  • [noparse][b]bold[/b][/noparse]
  • [nobb][b]bold[/b][/nobb]
  • [pre][b]bold[/b][/pre]
[b]bold[/b]
[nosmile] is used to disable smilies on a post by post basis

[nosmile] ;-) :-O
;-) :-O
Custom inline styles

[style=text-shadow: 0 0 4px #CC0000;]You can change all the CSS properties of this block.[/style]
You can change all the CSS properties of this block.
Custom class block

[class=custom]If the class exists, this block will have the custom class style applied.[/class]
<span class="custom">If the class exists,
this block will have the custom class
style applied.</span>