16 Apr 24, 13:53 pm » Welcome, Guest. Please login or register.
Did you miss your activation email?


Netheril : Age of Magic

Please login or register.



Author Topic: ▶ Guide: Forum Post Customisation!  (Read 30506 times)

Ritu

  • Hero
  • ****
  • Posts: 351
  • Discord: Ritulienka#3945
    • View Profile
▶ Guide: Forum Post Customisation!
« on: September 04, 2020, 01:09:33 pm »
_____Forum Post Customisation Guide
by Ritulienka

This thread contains chaptered guides on variety of basic customisation for things like letters, posters, character bios and more!
All of these work on the Netheril forums.
BBcode is versatile albeit a bit clunky, so don't expect miracles from it!


Chapters of this guide:
1. Color Code List
2. Formatting Codes
3. Tables - Perfect for Character Bios


I hope you find it helpful!
                        - Ritu
______
« Last Edit: September 04, 2020, 01:15:57 pm by Ritu »
۞Iskvaeri Mai Traahen
☼Oxana Vulpeti
♫Charlotte Von Krall
♛Artemis Aurelia

Ritu

  • Hero
  • ****
  • Posts: 351
  • Discord: Ritulienka#3945
    • View Profile
Re: Guide: Forum Post Customisation!
« Reply #1 on: September 04, 2020, 01:11:19 pm »
1. Color Code List
These are the named colors the BBcode of the forums supports. You can also replace the color name with a HEX color code to get that exact shade.

Useful Tools:
HEX Color Code online picker
BBcode Text Gradient Generator

Colors:
Code: [Select]
[color=COLOR OR #CODE]-your text-[/color]
(Unwrap the Spoiler below to see the full list of named colors)
Spoiler
[ A ]
█Your Text - aliceblue
█Your Text - antiquewhite
█Your Text - aqua
█Your Text - aquamarine
█Your Text - azure

[ B ]
█Your Text - beige
█Your Text - bisque
█Your Text - black
█Your Text - blanchedalmond
█Your Text - blue
█Your Text - blueviolet
█Your Text - brown
█Your Text - burlywood

[ C ]
█Your Text - cadetblue
█Your Text - chartreuse
█Your Text - chocolate
█Your Text - coral
█Your Text - cornflowerblue
█Your Text - cornsilk
█Your Text - crimson
█Your Text - cyan

[ D ]
█Your Text - darkblue
█Your Text - darkcyan
█Your Text - darkgoldenrod
█Your Text - darkgray
█Your Text - darkgreen
█Your Text - darkkhaki
█Your Text - darkmagenta
█Your Text - darkolivegreen
█Your Text - darkorange
█Your Text - darkorchid
█Your Text - darkred
█Your Text - darksalmon
█Your Text - darkseagreen
█Your Text - darkslateblue
█Your Text - darkslategray
█Your Text - darkslategrey
█Your Text - darkturquoise
█Your Text - darkviolet
█Your Text - deeppink
█Your Text - deepskyblue
█Your Text - dimgray
█Your Text - dimgrey
█Your Text - dodgerblue

[ F ]
█Your Text - firebrick
█Your Text - floralwhite
█Your Text - forestgreen
█Your Text - fuchsia

[ G ]
█Your Text - gainsboro
█Your Text - ghostwhite
█Your Text - gold
█Your Text - goldenrod
█Your Text - gray
█Your Text - grey
█Your Text - green
█Your Text - greenyellow

[ H ]
█Your Text - honeydew
█Your Text - hotpink

[ I ]
█Your Text - indianred
█Your Text - indigo
█Your Text - ivory

[ K ]
█Your Text - khaki

[ L ]
█Your Text - lavender
█Your Text - lavenderblush
█Your Text - lawngreen
█Your Text - lemonchiffon
█Your Text - lightblue
█Your Text - lightcoral
█Your Text - lightcyan
█Your Text - lightgoldenrodyellow
█Your Text - lightgray
█Your Text - lightgrey
█Your Text - lightgreen
█Your Text - lightpink
█Your Text - lightsalmon
█Your Text - lightseagreen
█Your Text - lightskyblue
█Your Text - lightslategray
█Your Text - lightslategrey
█Your Text - lightsteelblue
█Your Text - lightyellow
█Your Text - lime
█Your Text - limegreen
█Your Text - linen

[ M ]
█Your Text - magenta
█Your Text - maroon
█Your Text - mediumaquamarine
█Your Text - mediumblue
█Your Text - mediumorchid
█Your Text - mediumpurple
█Your Text - mediumseagreen
█Your Text - mediumslateblue
█Your Text - mediumspringgreen
█Your Text - mediumturquoise
█Your Text - mediumvioletred
█Your Text - midnightblue
█Your Text - mintcream
█Your Text - mistyrose
█Your Text - moccasin

[ N ]
█Your Text - navajowhite
█Your Text - navy

[ O ]
█Your Text - oldlace
█Your Text - olive
█Your Text - olivedrab
█Your Text - orange
█Your Text - orangered
█Your Text - orchid

[ P ]
█Your Text - palegoldenrod
█Your Text - palegreen
█Your Text - paleturquoise
█Your Text - palevioletred
█Your Text - papayawhip
█Your Text - peachpuff
█Your Text - peru
█Your Text - pink
█Your Text - plum
█Your Text - powderblue
█Your Text - purple

[ R ]
█Your Text - red
█Your Text - rosybrown
█Your Text - royalblue

[ S ]
█Your Text - saddlebrown
█Your Text - salmon
█Your Text - sandybrown
█Your Text - seagreen
█Your Text - seashell
█Your Text - sienna
█Your Text - silver
█Your Text - skyblue
█Your Text - slateblue
█Your Text - slategray
█Your Text - slategrey
█Your Text - snow
█Your Text - springgreen
█Your Text - steelblue

[ T ]
█Your Text - tan
█Your Text - teal
█Your Text - thistle
█Your Text - tomato
█Your Text - turquoise

[ V ]
█Your Text - violet

[ W ]
█Your Text - wheat
█Your Text - white
█Your Text - whitesmoke

[ Y ]
█Your Text - yellow
█Your Text - yellowgreen



۞Iskvaeri Mai Traahen
☼Oxana Vulpeti
♫Charlotte Von Krall
♛Artemis Aurelia

Ritu

  • Hero
  • ****
  • Posts: 351
  • Discord: Ritulienka#3945
    • View Profile
Re: Guide: Forum Post Customisation!
« Reply #2 on: September 04, 2020, 01:13:36 pm »
2. Formatting Codes
Tools for these are fortunately implemented in the forum post creation! I'm including them in order to have everything in one place, and for copypasting purposes if you decide to pre-write a forum post separately.
Most of the text formatting can be combined. If you do that, keep an eye on the tag order.

e.g. [b][i]text[/i][/b]  is correct   ->  text
      [i][b]text[/i][/b]  is incorrect and won't show up right  ->  text[/b]

Useful Tools:
Visual-Based BBcode editor

Text Formats:

(Unwrap the Spoiler below to see the full list of formats)
Spoiler

Bold text
[b] Text [/b]

Itallic text
[i] Text [/i]

Underlined text
[u] Text [/u]

Scratched-out text
[s] Text [/s]

Glowing text
[glow=COLOR,2,300] Glowing text [/glow]

The number in the "glow" code doesn't really do anything here, but without any number put in the code breaks.
"Glow" value set on 1 ->  Glowing text
"Glow" value set on 50,000 ->  Glowing text


Sizing of the text:
You can use pretty much any number for the numerical value of the text size.

   'Oh, don't talk about trouble!' said the Duchess.
[size=8pt] Text [/size]

   'Oh, don't talk about trouble!' said the Duchess.
[size=12pt] Text [/size]

   'Oh, don't talk about trouble!' said the Duchess.
[size=18pt] Text [/size]



URL Hyperlinking:
This is to create clickable links. There's three ways you can do this:

1) Paste the URL
Simply pasting a link works.
https://netheril.net/forums/index.php

2) Assign the URL to a text
CLICK ME
[url=link] Text [/url]
   + the link text can be further formatted
   CLICK ME

3) Assign the URL to an image

[url=link][img]image_link[/img][/url]


Images:
Adding images in is very simple. They cannot be scaled though, so make sure they are of a correct size.

Unlinked image

[img]image_link[/img]

Linked image

[url=link][img]image_link[/img][/url]


Quoting:

Basic quote
Quote
Gossip text
[quote]Gossip text[/quote]

Marked quote
Quote from: Ritulienka
Gossip text
[quote=title/name]Gossip text[/quote]
[/color]


Lists:

Unordered List:
  • Text1
  • Text2
  • Text3
Code: [Select]
[list]
[*]Text1
[*]Text2
[*]Text3
[/list]


Ordered List:

  • Text1
  • Text2
  • Text3
Code: [Select]
[list type=decimal]
[li]Text1[/li]
[li]Text2[/li]
[li]Text3[/li]
[/list]

Horizontal line:


[hr]




« Last Edit: September 04, 2020, 01:26:07 pm by Ritu »
۞Iskvaeri Mai Traahen
☼Oxana Vulpeti
♫Charlotte Von Krall
♛Artemis Aurelia

Ritu

  • Hero
  • ****
  • Posts: 351
  • Discord: Ritulienka#3945
    • View Profile
Re: ▶ Guide: Forum Post Customisation!
« Reply #3 on: September 04, 2020, 01:14:53 pm »
3. Tables - Perfect for Character Bios
Tables are easy as long as you don't get disoriented in all the "tr"s and "td"s.
tr = table row
td = table data (columns of the row)

Useful Tools:
Online Table Generator Tool

Table:
There's no way to add either a border or a cell background.
A basic table of 2 rows and 2 columns would be this:

███C1 row1████ ██C2 row1███
████C1 row2██████ ███C2 row2████

As you can see, the cell widths adjust across the rows so for the best looks I do not recommend using more than 1 row per table.

You can create more single-row tables separately by pressing 'Enter' instead of creating a new row. What that does is that your table's contents are going to look much better and tidied up.
You can also create tables within tables if you'd like to divide the space even more.


Code for the multiple single-rows:
Code: [Select]
[table]
[tr]
[td]1st. table column1[/td]
[td]1st. table column2[/td]
[/tr]
[/table]
[table]
[tr]
[td]2nd. table column1[/td]
[td]2nd. table column2[/td]
[/tr]
[/table]


EXAMPLE: MULTIPLE ROWS:
Quote
Lorem ipsum
Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Vitae congue eu consequat ac felis donec et odio. Orci sagittis eu volutpat odio facilisis. Viverra nam libero justo laoreet. Maecenas ultricies mi eget mauris pharetra et ultrices neque ornare. Ut eu sem integer vitae. Lacus laoreet non curabitur gravida arcu ac tortor dignissim convallis. Egestas purus viverra accumsan in nisl nisi scelerisque eu. Eu mi bibendum neque egestas congue. Lectus sit amet est placerat in egestas erat imperdiet sed. Quis enim lobortis scelerisque fermentum dui faucibus.
Sit amet purus gravida quis blandit turpis cursus. Vulputate sapien nec sagittis aliquam malesuada bibendum arcu vitae. Quisque id diam vel quam elementum pulvinar. Semper viverra nam libero justo laoreet. Hendrerit dolor magna eget est lorem ipsum dolor sit amet. Accumsan in nisl nisi scelerisque eu ultrices.

Ultrices mi tempus imperdiet nulla malesuada. Sit amet aliquam id diam. In iaculis nunc sed augue lacus viverra vitae congue eu. In est ante in nibh mauris cursus mattis molestie a. Nec dui nunc mattis enim ut tellus. In hendrerit gravida rutrum quisque. Gravida arcu ac tortor dignissim convallis aenean et. Nisl nisi scelerisque eu ultrices vitae. Leo a diam sollicitudin tempor id eu nisl nunc mi. Sed viverra tellus in hac habitasse platea dictumst. Duis at consectetur lorem donec massa sapien faucibus. Urna porttitor rhoncus dolor purus non enim praesent elementum. Nulla malesuada pellentesque elit eget. Blandit volutpat maecenas volutpat blandit aliquam etiam erat. Urna cursus eget nunc scelerisque viverra mauris in aliquam sem. Augue lacus viverra vitae congue eu.

Egestas purus viverra accumsan in nisl nisi scelerisque. Tortor id aliquet lectus proin. Aenean vel elit scelerisque mauris pellentesque pulvinar pellentesque. At tempor commodo ullamcorper a lacus vestibulum. Enim lobortis scelerisque fermentum dui faucibus in. Nunc eget lorem dolor sed viverra ipsum nunc. Urna duis convallis convallis tellus id interdum. Maecenas sed enim ut sem viverra aliquet eget. Ac felis donec et odio pellentesque. Est lorem ipsum dolor sit amet consectetur adipiscing. Faucibus in ornare quam viverra orci sagittis. Elit duis tristique sollicitudin nibh sit amet commodo nulla. Adipiscing elit pellentesque habitant morbi. Egestas integer eget.



EXAMPLE: TWO SINGLE-ROWS:

Quote
Lorem ipsum
Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Vitae congue eu consequat ac felis donec et odio. Orci sagittis eu volutpat odio facilisis. Viverra nam libero justo laoreet. Maecenas ultricies mi eget mauris pharetra et ultrices neque ornare. Ut eu sem integer vitae. Lacus laoreet non curabitur gravida arcu ac tortor dignissim convallis. Egestas purus viverra accumsan in nisl nisi scelerisque eu. Eu mi bibendum neque egestas congue. Lectus sit amet est placerat in egestas erat imperdiet sed. Quis enim lobortis scelerisque fermentum dui faucibus.
Sit amet purus gravida quis blandit turpis cursus. Vulputate sapien nec sagittis aliquam malesuada bibendum arcu vitae. Quisque id diam vel quam elementum pulvinar. Semper viverra nam libero justo laoreet. Hendrerit dolor magna eget est lorem ipsum dolor sit amet. Accumsan in nisl nisi scelerisque eu ultrices.

____
_______Ultrices mi tempus imperdiet nulla malesuada. Sit amet aliquam id diam. In iaculis nunc sed augue lacus viverra vitae congue eu. In est ante in nibh mauris cursus mattis molestie a. Nec dui nunc mattis enim ut tellus. In hendrerit gravida rutrum quisque. Gravida arcu ac tortor dignissim convallis aenean et. Nisl nisi scelerisque eu ultrices vitae. Leo a diam sollicitudin tempor id eu nisl nunc mi. Sed viverra tellus in hac habitasse platea dictumst. Duis at consectetur lorem donec massa sapien faucibus. Urna porttitor rhoncus dolor purus non enim praesent elementum. Nulla malesuada pellentesque elit eget. Blandit volutpat maecenas volutpat blandit aliquam etiam erat. Urna cursus eget nunc scelerisque viverra mauris in aliquam sem. Augue lacus viverra vitae congue eu.

Egestas purus viverra accumsan in nisl nisi scelerisque. Tortor id aliquet lectus proin. Aenean vel elit scelerisque mauris pellentesque pulvinar pellentesque. At tempor commodo ullamcorper a lacus vestibulum. Enim lobortis scelerisque fermentum dui faucibus in. Nunc eget lorem dolor sed viverra ipsum nunc. Urna duis convallis convallis tellus id interdum. Maecenas sed enim ut sem viverra aliquet eget. Ac felis donec et odio pellentesque. Est lorem ipsum dolor sit amet consectetur adipiscing. Faucibus in ornare quam viverra orci sagittis. Elit duis tristique sollicitudin nibh sit amet commodo nulla. Adipiscing elit pellentesque habitant morbi. Egestas integer eget.

Code for the multiple single-rows:
Code: [Select]
[table]
[tr]
[td]1st. table column1[/td]
[td]1st. table column2[/td]
[/tr]
[/table]
[table]
[tr]
[td]2nd. table column1[/td]
[td]2nd. table column2[/td]
[/tr]
[/table]
*images used in the examples are under a CC0 - Creative Commons license, provided by "kisscc0.com"
« Last Edit: September 04, 2020, 01:28:36 pm by Ritu »
۞Iskvaeri Mai Traahen
☼Oxana Vulpeti
♫Charlotte Von Krall
♛Artemis Aurelia