MyCode Reference

This is a list of custom MyCodes that work on the forum.

---

Shorthands

“Quotes used for speech”

Copy[q]Quotes used for speech[/q]

“Quotes used for speech”

Copy[q=#FF0000]Quotes used for speech[/q]

Link to a profile

Copy[p=3]Link to a profile[/p]

Link to a thread

Copy[t=250]Link to a thread[/t]

— By Zina Wow Cool Attribution

Copy[attr]By Zina Wow Cool Attribution[/attr]

— can be — used — to — do— pauses

Copy[mdash]

middots · are · cool · bro

Copy[middot]

---

Formatting

 Indenting is neat.
It can give your post natural,
 or unnatural,
breaks.

Copy[indent]Indenting is neat.
It can give your post natural,
[indent]or unnatural,
breaks.

Aligns text either left, right, or center.

Copy[align=right]Aligns text either left, right, or center.[/align]

Small text is smol.

Copy[small]Small text is smol.[/small]

Large text is lorg

Copy[large]Large text is lorg[/large]

Specific sizing
The size tag uses rem units rather than points or pixels. The standard font size on Canis is 16px. Rems are a multiplier of the standard font size. You can read more about them here, or you can remember that 2rems on Canis is 16 pixels * 2, or 32 pixels.
Limits: Minimum 0.85, maximum 10.

ex. Slightly big text

Copy[size=1.2]Slightly big text[/size]

Fonts
There is no such thing as a standard web font. Fonts will display differently depending on the system, browser, and even monitor. You can find a list of "safe" fonts for use with web here, but keep in mind that fonts will only display if users have them installed on their system.

Additionally, Canis has exactly two custom fonts hosted on Google Fonts: 'Quicksand' and 'Roboto' (the standard font)
ex. Look I am in Times New Roman!

Copy[font=Times]Look I am in Times New Roman![/font]

This is small caps. It can't be used with the small tag

Copy[smallcaps]This is small caps. It can't be used with the small tag[/smallcaps]

Blockquotes are useful for really long quoted pieces of text, such as songs or even snippets of other posts!

Copy[blockquote]Blockquotes are useful for really long quoted pieces of text, such as songs or even snippets of other posts![/blockquote]

Word Wrapping Images
You can use wrap left or right to word wrap images or boxes.

Copy[wrap left][img]https://placekitten.com/100/100[/img][b]Word Wrapping Images[/b]
You can use wrap [b]left[/b] or [b]right[/b] to word wrap images or boxes.[/wrap]

Page Components

Narrow

Make your text in a fancy narrow box. You can specify a width optionally - default is 500px. Cannot be less than 400px

Copy[narrow width=400]Make your text in a fancy narrow box. You can specify a width optionally - default is 500px.[/narrow]

Out of Character Box

This is me saying things out of character!

---

Copy[ooc]This is me saying things out of character![/ooc]

Note Box

---

This is me putting a note on a post!

Copy[note]This is me saying things out of character![/note]

hr

Creates a horizontal line. Usually defines an important thematic break in text.

---

Copy[hr]

Also takes a width optionally:

---

Copy[hr width=200]

Headings

Headings create title text in multiple levels, from number 1 to 6. Headings of sizes 3 and 4 have been used in this very post!

Copy[h3]This h3 tag is likely the largest tag you should use.[/h3]

Images

Standard MyBB supports the [img]URL[/img] tag. We also support the following with the special [image]URL[/image] tag:

• width: constrains the width
  
• align: aligns the image to left, right, or center
  
• circle: creates a rounded image

Copy[image width=200]https://placebear.com/640/360[/image]

Copy[image circle]https://placebear.com/640/360[/image]

Copy[image align=right]https://placebear.com/100/100[/image]

You can also force images to be perfect circles:

Perfect Circle

Copy[image perfect-circle]https://loremflickr.com/300/400[/image]

Perfect Circle with constrained width

Copy[image perfect-circle width=200]https://loremflickr.com/300/400[/image]

Box

Wow a box

The header is optional! Boxes are not available in IC forums.

Copy[box header="Wow a box"]The header is optional![/box]

Row/Column

By using [row] and [col=#] tags, you can achieve more complex layouts. Each row is split into 12 units, and each column can be between 1 and 12 units. Thus, for an even two column layout:

Whoa

Another box!

Copy[row][col=6][box]Whoa[/box][/col][col=6][box]Another box![/box][/col][/row]

The columns can be any combination as long as they add up to twelve.

beep

boop

bop

Copy[row][col=2][box]beep[/box][/col][col=3][box]boop[/box][/col][col=7][box]bop[/box][/col][/row]

And, if you wrap them in table tags, you can get lines between each row:

One row

Two row

Three rows!

Copy[table][row][col=12]One row[/col][/row]
[row][col=12]Two row[/col][/row]
[row][col=12]Three rows![/col][/row][/table]

and with borders:

One row

Two row

Three rows!

Copy[table border][row][col=12]One row[/col][/row]
[row][col=12]Two row[/col][/row]
[row][col=12]Three rows![/col][/row][/table]

---

Extra functionality

Hoverable Text
Often used for characters who speak different languages.
Click me to show! — Some hidden text :O

Copy[hover=Some hidden text :O]Click me to show![/hover]

FontAwesome Icons
We use font awesome icons like this one:
Visit the Font Awesome Icons page for a list of every icon.

Copy[icon=bed]

Text Fades
Wow a text fade!
This one goes to the left!

Copy[fade from=#ff0000 to=orange]Wow a text fade![/fade]
[fade from=magenta to=purple dir=left]This one goes to the left![/fade]

Progress Bars

progress

Copy[progress value=10 max=40]progress[/progress]

Colour Swatch
Color swatches will automatically adjust their background when they aren't readable with the current color scheme. You can force dark color swatches to display with the -dark suffix.

red

#44fe98

orange

Copy[swatch=red][swatch=#44fe98][swatch-dark=orange]

Badges
Shows a badge with an optional context colour.
Plain Secondary Info Warning Danger Success

Copy[badge]Plain[/badge] [badge secondary]Secondary[/badge] [badge info]Info[/badge] [badge warning]Warning[/badge] [badge danger]Danger[/badge] [badge success]Success[/badge]

Collapse Button
Shows content when clicked
Click me!

And all will be revealed

Copy[collapse text="Click me!"]And all will be revealed[/collapse]

---

Vertical Alignment within Columns

You can vertically align items within columns or a post itself with this.
Options:

• center
  
• start
  
• end

I'm in the middle of the row!

Copy[row][col=6]Left column[col=6][valign=center][box]I'm in the middle of the row![/box][/valign][/col][/row]

---

Spotify

Copy[spotify]https://open.spotify.com/album/4RuzGKLG99XctuBMBkFFOC[/spotify]

Youtube

To embed youtube videos, you will need the embed URL. Visit Google Support for more details.

Copy[youtube]https://www.youtube.com/embed/videoseries?list=PL21-a4V5mwwuPOf1rbK4VLm_g4w_5ALXP[/youtube]

the staff team luvs u

This is a list of custom shortcodes made for easy mobile use that work on the forum.

---

Shortcodes

“Quotes used for speech”

Copy::Quotes used for speech::

bold text

Copy**bold text**

italicize text

Copy!!italicize text!!

LEFT Align text

Copy~~LEFT Align text~~

CENTER Align text

Copy##CENTER Align text##

RIGHT Align text

Copy++RIGHT Align text++

^^JUSTIFY text^^

Copy^^JUSTIFY text^^

the staff team luvs u