Tips for fancy bbcode toolbar - a reference and some examples
Posted: Sun Jan 02, 2022 6:39 pm
Another extension that the board supports is a fancy toolbar that looks like this
I never understood what bbcodes are besides the one for embebbing a url or img in a post. The toolbar is so you don't have to remember that actual bbcode. If you click on the images in the toolbar then it will generate the correct bbcode.
It is probably helpful to know a bit about them. I found this page explains what some of the bbcodes do.
If you don't understand what they are then read the above link and you should be able to make fancy posts. If you make it to the end of the bbcode page it even includes an entertaining embedded video of woman singing and crying about cats
Here are some examples of bbcodes on the toolbar.
In the first row the B turns the text bold.
The I italicizes the text
The U underlines the text
the next symbol is used for code so it does not indent or format the code within the code tags
The next 3 symbols are used to create bulleted lists
I am going to add more example of lists soon
img is used to embed an image
The next one is the classic one for a link - url
Link to orca
I am skipping the flash that is for a flash video. That is the lightning bolt.
. the next one is to embed a video. when you first click on it, a popup appears .
If you click on the dropdown where the 'Youtube' is then it gives you a list of sites that support video.
BTW - if you copy a video link directly into a post then it will do that same thing as this bbcode so you don't need to use this one
Copy text
Paste text
the last one on that line removes bbcodes
If you move across the lower row on the toolbar from left to right here is what clicking on the fancy images will do
Highlight the text. By default, highlights are yellow; you can change the color.
highlight this sentence.
strikethrough does this
NormalTextthis text is inside superscript tag
NormalTextThis text is inside the subscript tag
glow does this
blur blue does this
fade does this
shadow blue does this
dropshadow does this - turns the text blue
dir - reverses all the characters in between the tags
text direction does this - reverses all the characters in between the tags
The spoil tag hides the 'spoil - eye with the slash does this' text. If you click on 'Show Spoiler' then you can see the spoiler
The hidden tag only allows board members to see the text.
Guests will see a message will the following message. If the login then they can see the 'hidden' text
.
I guess that one is intended for moderators who edit/censure posts
the embedded video can be used to embedded video. it pops up something like below that you can use to embed a youtube video
the last item documents how you can create fancy tables . here is example that is provided if you click on chart of the far right
here is an example of a table that I created . You use pipes (vertical bar) to seperate the columns
I never understood what bbcodes are besides the one for embebbing a url or img in a post. The toolbar is so you don't have to remember that actual bbcode. If you click on the images in the toolbar then it will generate the correct bbcode.
It is probably helpful to know a bit about them. I found this page explains what some of the bbcodes do.
If you don't understand what they are then read the above link and you should be able to make fancy posts. If you make it to the end of the bbcode page it even includes an entertaining embedded video of woman singing and crying about cats
Here are some examples of bbcodes on the toolbar.
In the first row the B turns the text bold.
Code: Select all
[b]In the first row the B turns the text bold. [/b]
Code: Select all
[i]The I italicizes the text[/i]
Code: Select all
[u]The U underlines the text[/u]
The double quote creates a quote box
Code: Select all
[quote]The double quote creates a quote box[/quote]
Code: Select all
.e9EfHf {
font-family: Roboto,arial,sans-serif;
clear: both;
min-width: 833px;
margin-left: 0;
padding-top: 20px;
box-sizing: border-box;
position: relative;
min-height: 100vh;
}
The next 3 symbols are used to create bulleted lists
- bullet 1
- bullet 2
Code: Select all
[list]
[*]bullet 1
[*]bullet 2
[/list]
img is used to embed an image
Code: Select all
[img]https://www.phpbb.com/customise/db/download/188361?mode=view&thumb=1[/img]
Link to orca
Code: Select all
[url=https://orcaforum.kofo.mpg.de/app.php/help/bbcode]Link to orca[/url]
. the next one is to embed a video. when you first click on it, a popup appears .
If you click on the dropdown where the 'Youtube' is then it gives you a list of sites that support video.
BTW - if you copy a video link directly into a post then it will do that same thing as this bbcode so you don't need to use this one
Copy text
Paste text
the last one on that line removes bbcodes
If you move across the lower row on the toolbar from left to right here is what clicking on the fancy images will do
Highlight the text. By default, highlights are yellow; you can change the color.
highlight this sentence.
Code: Select all
[highlight=yellow]highlight this sentence.[/highlight]
preformatted does this
Code: Select all
[pre]preformatted does this [/pre]
strikethrough does this
Code: Select all
[s]strikethrough does this[/s]
NormalTextthis text is inside superscript tag
Code: Select all
NormalText[sup]this text is inside superscript tag[/sup]
NormalTextThis text is inside the subscript tag
Code: Select all
NormalText[sub]This text is inside the subscript tag[/sub
glow does this
Code: Select all
[glow=red]glow does this[/glow]
Code: Select all
[blur=blue]blur blue does this[/blur]
fade does this
Code: Select all
[fade]fade does this[/fade]
Code: Select all
[shadow=blue]shadow blue does this[/shadow]
Code: Select all
[dropshadow=blue]dropshadow does this - turns the text blue[/dropshadow]
align center does this
align left does this
align right does this
Code: Select all
[align=center]align center does this[/align]
[align=left]align left does this[/align]
[align=right]align right does this[/align]
dir - reverses all the characters in between the tags
text direction does this - reverses all the characters in between the tags
Code: Select all
[marq=left]marquee left will cause the text to move across the page :lol:[/marq]
[marq=right]:lol: marquee right will cause the text to move across the page towards the right :lol:[/marq]
► Show Spoiler
Code: Select all
[spoil]spoil - the eye with the slash does this[/spoil]
Code: Select all
[hidden]hidden - the lock - hides the text from guests[/hidden]
Guests will see a message will the following message. If the login then they can see the 'hidden' text
Off Topic
offtopic does this
Code: Select all
[offtopic]offtopic does this[/offtopic]
.
I guess that one is intended for moderators who edit/censure posts
nfo art does thisif the page is making a noise and it sounds like a tiger that is coming from the red cloud aka soundcloud. it is used for playing soundcloud audio url. The soonerscoop and some other Oklahoma football sites use soundcloud . If you find good podcasts on soundcloud then you can use the 'red cloud'.
Code: Select all
[soundcloud]https://soundcloud.com/soonerscoop/u40-alamo-bowl-preview-bob-stoops-was-the-hero-we-needed]
the last item documents how you can create fancy tables . here is example that is provided if you click on chart of the far right
here is an example of a table that I created . You use pipes (vertical bar) to seperate the columns
Season | AVG | GP | GS | AB | R | H | 2B | 3B | HR | RBI | SLG | BB | HBP | SO | OBP | SB | SBA | FLD% |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
2019 | .263 | 63 | 63 | 137 | 35 | 36 | 8 | 1 | 8 | 27 | .511 | 17 | 10 | 23 | .380 | 6 | 8 | .953 |
2020 | .370 | 24 | 24 | 73 | 22 | 27 | 7 | 0 | 5 | 23 | .671 | 9 | 3 | 6 | .448 | 4 | 5 | .950 |
2021 | .392 | 60 | 60 | 166 | 62 | 65 | 12 | 0 | 14 | 52 | .717 | 27 | 9 | 14 | .495 | 8 | 8 | .963 |
TOTAL | .340 | 147 | 147 | 376 | 119 | 128 | 27 | 1 | 27 | 102 | .633 | 53 | 22 | 43 | .444 | 18 | 21 | .956 |
Code: Select all
Season |AVG |GP |GS |AB |R |H |2B |3B |HR |RBI |SLG |BB |HBP |SO |OBP |SB |SBA |FLD%
----- |--- |-- |-- |-- |--|--|-- |-- |-- |----|----|-- |----|-- |----|-- |----|----
2019 |.263 |63 |63 |137 |35 |36 |8 |1 |8 |27 |.511 |17 |10 |23 |.380 |6 |8 |.953
2020 |.370 |24 |24 |73 |22 |27 |7 |0 |5 |23 |.671 |9 |3 |6 |.448 |4 |5 |.950
2021 |.392 |60 |60 |166 |62 |65 |12 |0 |14 |52 |.717 |27 |9 |14 |.495 |8 |8 |.963
TOTAL |.340 |147 |147 |376 |119 |128 |27 |1 |27 |102 |.633 |53 |22 |43 |.444 |18 |21 |.956