Back

Guides

Community created guides, helpful strategies, and more.
TOPIC | Super Beginners Guide to BBcode!
[center][i][b]The Super Easy Beginners Guide to BBcode![/b][/i][/center] Hello hello! Loki here, and if you don’t know much about coding, neither do I! I’m one of those people that likes to figure things out, but it’s difficult, and sometimes you need help! I had to ask for help for my Signature! And take a look at it, I’m so proud! I got my Adoption and Hatchery logo into mine. If you do need help, but want to do your signature by yourself, this is a simplified guide on how to get your Signature looking good and working great! Up first… [u][b]Basics of BBcode[/b][/u] BBcode is what FR uses to make your forum posts pop, it’s what makes your letters look good. First off, BBcode is always activated by brackets with a code word placed inside. They look like this: [word]. That is the opening code brackets. The closing code brackets contain a forward slash, and a code word. That is how the code knows it is to run. The closing code brackets look like this: [/word]. To display the coding, I will replace ‘word’ with ‘code.’ [b]Simple BBcodes for every use:[/b] [b]Bold:[/b] This one is actually rather simple as there’s a shortcut in the toolbar. It looks like this:[b]B[/b] However, if you need to know how to code it, here’s how: [code][b]These words are in bold![/b][/code] When applied, it looks like this: [b]These words are in bold![/b] [i]Italics:[/i] This one is actually rather simple as there’s a shortcut in the toolbar. It looks like this: [i]I[/i] Just in case you need it though, here’s how to code that! [code][i]These words are in italics![/i][/code] When applied, it looks like this: [i]These words are in italics![/i] [u]Underline:[/u] This one has a toolbar shortcut as well, it looks like this: [u]U[/u] You can code this by doing this: [code][u]These words are underlined![/u][/code] It looks like this when applied: [u]These words are underlined![/u] [indent]Indent:[/indent] This one can be found at the fourth button in. It can be coded by: [code][indent]These words are indented![/indent][/code] It looks like this: [indent]These words are indented![/indent] [left]Text Orientation Left[/left] This makes your text appear from left to right, closer to the left side, which is the way this post is set up. The shortcut is the fifth button in. This can be coded by: [code][left]This text is on the left![/left][/code] It looks like this: [left]This text is on the left![/left] [center]Text Orientation Center[/center] This makes your text appear in the center of your page. Shortcut is the sixth button in. This can be coded by: [code][center]This text is on the center![/center][/code] It looks like: [center]This text is in the center![/center] [right]Text Orientation Right[/right] This makes your text appear on the right side of your page. It is the seventh button in. You can code this by: [code][right]This text is on the right![/right][/code] It looks like: [right]This text is on the right![/right] [u]URL and Links[/u] There are a couple versions of this one, the simplest with the shortcut on the eighth button. This simpler version can be coded by: [code][url] https://www1.flightrising.com/[/url][/code] It will look like this: [url]https://www1.flightrising.com[/url] The second version isn’t too difficult either, it sort of just has another step! For this one, instead of seeing an ugly link, you can label the link. This can be coded by: [code][url=https://www1.flightrising.com/]Flight Rising Main[/url][/code] It will look like this: [url=https://www1.flightrising.com/]Flight Rising Main[/url] [u]Images:[/u] Images were super difficult for me to get coded, which is one of the reasons that I am making this super simple guide. Of you look up any post, it will only tell you the code, and I would use the code, only to find that my image didn’t load in. It took me asking for answers to find that for an image to work, it HAS to end in ‘.png’ in the link. Yes, I said link. The best way to get a ‘.png’ link is to go to discord, send the image in a channel, (make sure the image isn’t deleted as that could cause link problems), click on the image, hit share, and THEN copy the link. You will then add the image BBcodes. The image code should look something like this: [code][img]https://media.discordapp.net/attachments/1110634159145234482/1110635620692398201/IMG_0263.png[/img][/code] This is what your should get after doing that: (This is my Hatchery Logo, made by me) [img]https://media.discordapp.net/attachments/1110634159145234482/1110635620692398201/IMG_0263.png[/img] **You can also post images of your dragons! Go to your dragon’s profile, hit the share button, copy the WIDGET. The widget is pre-coded and can just be pasted directly to your forum. Example Widget using Dappleclaw from my clan: [code][url=https://www1.flightrising.com/dragon/65131699][img]https://www1.flightrising.com/rendern/350/651317/65131699_350.png[/img][/url][/code] It will look something like this: [url=https://www1.flightrising.com/dragon/65131699][img]https://www1.flightrising.com/rendern/350/651317/65131699_350.png[/img][/url] Fun fact about the dragon Widgets, the widget links update with your dragon! So if you add or take off apparel, the Widget image updates too! It’s also a direct link to that dragon in your lair. [u]Flight Rising Emojis:[/u] This can be found in the 10th button! There isn’t much coding to it, but you can change the size of an emoji by changing the number value. [code][emoji=name size=1][/code] You can change that number, and it slightly increases/decreases in size! [u]Numbers and Bullets:[/u] These are both used for list purposes, and can be found in the buttons above. Buttons 11 (numbers) and 12 (bullets). This can be coded by: [code][LIST=1] [*]This [*]is [*]a [*]numbered [*]list! [/LIST][/code] It will look like this: [LIST=1] [*]This [*]is [*]a [*]numbered [*]list! [/LIST] OR [code][LIST] [*]This [*]is [*]a [*]bulleted [*]list! [/LIST][/code] It’ll look like this: [LIST] [*]This [*]is [*]a [*]bulleted [*]list! [/LIST] [u]Quotes:[/u] This can be done by pinging the person you’re quoting and copying a line/post. Remember the brackets from earlier that I said I was putting the word ‘code’ into? It’s the same thing, but with the word ‘quote’ instead. [quote]This is a quote example.[/quote] Strikethrough: This can be found up in the toolbar: [s]S[/s] Coding is simple: [code][s]This sentence has strikethrough.[/s][/code] It will look like this: [s]This sentence has strikethrough.[/s] There are several more things to know but these are the basics! I will update this post as I learn more as well, so bookmark this to know when to come back for more BBcode Lessons! [center][u][i]This post was made by Loki![/i][/u][/center]
The Super Easy Beginners Guide to BBcode!

Hello hello! Loki here, and if you don’t know much about coding, neither do I! I’m one of those people that likes to figure things out, but it’s difficult, and sometimes you need help! I had to ask for help for my Signature! And take a look at it, I’m so proud! I got my Adoption and Hatchery logo into mine.

If you do need help, but want to do your signature by yourself, this is a simplified guide on how to get your Signature looking good and working great!

Up first…


Basics of BBcode

BBcode is what FR uses to make your forum posts pop, it’s what makes your letters look good. First off, BBcode is always activated by brackets with a code word placed inside. They look like this: [word]. That is the opening code brackets. The closing code brackets contain a forward slash, and a code word. That is how the code knows it is to run. The closing code brackets look like this: [/word]. To display the coding, I will replace ‘word’ with ‘code.’

Simple BBcodes for every use:

Bold:

This one is actually rather simple as there’s a shortcut in the toolbar. It looks like this:B
However, if you need to know how to code it, here’s how:
Code:
[b]These words are in bold![/b]
When applied, it looks like this:
These words are in bold!


Italics:

This one is actually rather simple as there’s a shortcut in the toolbar. It looks like this: I
Just in case you need it though, here’s how to code that!
Code:
[i]These words are in italics![/i]
When applied, it looks like this:
These words are in italics!


Underline:

This one has a toolbar shortcut as well, it looks like this: U
You can code this by doing this:
Code:
[u]These words are underlined![/u]
It looks like this when applied:
These words are underlined!

Indent:

This one can be found at the fourth button in.
It can be coded by:
Code:
[indent]These words are indented![/indent]
It looks like this:
These words are indented!

Text Orientation Left

This makes your text appear from left to right, closer to the left side, which is the way this post is set up. The shortcut is the fifth button in.
This can be coded by:
Code:
[left]This text is on the left![/left]
It looks like this:
This text is on the left!

Text Orientation Center

This makes your text appear in the center of your page. Shortcut is the sixth button in.
This can be coded by:
Code:
[center]This text is on the center![/center]
It looks like:
This text is in the center!

Text Orientation Right

This makes your text appear on the right side of your page. It is the seventh button in.
You can code this by:
Code:
[right]This text is on the right![/right]
It looks like:
This text is on the right!


URL and Links

There are a couple versions of this one, the simplest with the shortcut on the eighth button.
This simpler version can be coded by:
Code:
[url] https://www1.flightrising.com/[/url]
It will look like this:
https://www1.flightrising.com

The second version isn’t too difficult either, it sort of just has another step! For this one, instead of seeing an ugly link, you can label the link.
This can be coded by:
Code:
[url=https://www1.flightrising.com/]Flight Rising Main[/url]
It will look like this:
Flight Rising Main


Images:

Images were super difficult for me to get coded, which is one of the reasons that I am making this super simple guide. Of you look up any post, it will only tell you the code, and I would use the code, only to find that my image didn’t load in. It took me asking for answers to find that for an image to work, it HAS to end in ‘.png’ in the link. Yes, I said link. The best way to get a ‘.png’ link is to go to discord, send the image in a channel, (make sure the image isn’t deleted as that could cause link problems), click on the image, hit share, and THEN copy the link. You will then add the image BBcodes.

The image code should look something like this:
Code:
[img]https://media.discordapp.net/attachments/1110634159145234482/1110635620692398201/IMG_0263.png[/img]
This is what your should get after doing that: (This is my Hatchery Logo, made by me)
IMG_0263.png

**You can also post images of your dragons! Go to your dragon’s profile, hit the share button, copy the WIDGET. The widget is pre-coded and can just be pasted directly to your forum.
Example Widget using Dappleclaw from my clan:
Code:
[url=https://www1.flightrising.com/dragon/65131699][img]https://www1.flightrising.com/rendern/350/651317/65131699_350.png[/img][/url]
It will look something like this:
65131699_350.png

Fun fact about the dragon Widgets, the widget links update with your dragon! So if you add or take off apparel, the Widget image updates too! It’s also a direct link to that dragon in your lair.


Flight Rising Emojis:

This can be found in the 10th button! There isn’t much coding to it, but you can change the size of an emoji by changing the number value.
Code:
[emoji=name size=1]
You can change that number, and it slightly increases/decreases in size!


Numbers and Bullets:

These are both used for list purposes, and can be found in the buttons above. Buttons 11 (numbers) and 12 (bullets).
This can be coded by:
Code:
[LIST=1] [*]This [*]is [*]a [*]numbered [*]list! [/LIST]
It will look like this:
  1. This
  2. is
  3. a
  4. numbered
  5. list!

OR
Code:
[LIST] [*]This [*]is [*]a [*]bulleted [*]list! [/LIST]
It’ll look like this:
  • This
  • is
  • a
  • bulleted
  • list!


Quotes:

This can be done by pinging the person you’re quoting and copying a line/post. Remember the brackets from earlier that I said I was putting the word ‘code’ into? It’s the same thing, but with the word ‘quote’ instead.
Quote:
This is a quote example.


Strikethrough:

This can be found up in the toolbar: S
Coding is simple:
Code:
[s]This sentence has strikethrough.[/s]
It will look like this:
This sentence has strikethrough.

There are several more things to know but these are the basics! I will update this post as I learn more as well, so bookmark this to know when to come back for more BBcode Lessons!

This post was made by Loki!
IMG_0294.png IMG_0283.png

IMG_0285.png

IMG_0284.png
IMG_0286.png

IMG_0288.png

IMG_0287.png

IMG_0306.png


IMG_0308.png IMG_0310.png
Dragon_Dance.gif
Wow! This is very similar to Java, I never knew! Thanks for the help! :)
Wow! This is very similar to Java, I never knew! Thanks for the help! :)
cFHVk5Q.png
FvfV2kD.png
XXtnCBB.png
hzM3Sr2.png
ImslzgR.png
bkPzSyW.png