Flying Squirrel Entertainment

The Lounge => Forum & Website => Topic started by: Skaenn on June 02, 2020, 12:38:46 pm

Title: BB Code Table Guide [Creating a proper thread]
Post by: Skaenn on June 02, 2020, 12:38:46 pm
(https://i.imgyukle.com/2020/06/03/yWzeB1.png)

• BB Code Table Guide •

* * *

Link to my Thread Workshop - Skaenn's Thread Workshop (https://www.fsegames.eu/forum/index.php?topic=43296.0).


Table of Contents
(Click the titles to go to the subjects)

1     Placing 2 columns next to each other (#post_tag1)
2     Creating a ranks/member list template (#post_tag2)
3     Full Regiment Thread Tutorial (#post_tag2)


Introduction

The BB Code Help (https://www.fsegames.eu/forum/index.php?topic=2930.0) thread is a really big help for basic bb code. Thank you Menelaos for your time to make this helpful page.
If you have no clue what BB code's about, I suggest taking a look at this page first before you get yourself into creating tables. It's a very helpful thread for those who have never used it before.

I made this thread because it goes more deep into making tables and how to get stuff placed how you want it. This comes from a guy who was always amazed by people building these amazing
threads and never knew how BB code worked. I have invested a lot of time into this and now I want to help the people who have want to learn it as well but don't know how it works.
I'm also making this guide for those who don't use the forums often or never really played around with BB code. If you are one of those people, then I hope this thread will be useful for you.

! Tables are the most important aspect of thread building !

If you have a problems with a thread, and you just can't get it right, feel free to PM me, or post on this thread so other people that have experience with Tables can help you.

Before you start building a thread I recommend you to take a sheet of paper and sketch your desired design.
This gives you a more clear view on how it is going to look like in the end.

Without further due, let's begin.


1     Placing 2 columns next to each other


Step 1

Let's start with something simple. Let's say, you want to have 2 columns of text next to each other.
On your sketch it would probably look like this:


(https://i.imgur.com/1xFeWzj.png)


To put these two columns next to each other we need to use a table.
If you click on the table icon (https://www.fsegames.eu/forum/Themes/Battle%20Cry%20of%20Freedom/images/bbc/table.gif), the BB code will already simulate a table for you.

It will look like this:


Code
[table]
[tr]
[td][/td]
[/tr]
[/table]
Now notice that it gives you only one row of    [ td ] [ /td ]. [ td ] [ /td ] is actually 1 column.


Step 2

So in this case you will need 2 lines, like this:

Code
[table]
[tr]
[td][/td]
[td][/td]
[/tr]
[/table]
Just simply copy paste one line of [ td ] [ /td ] in the code. Now you have 2 columns you can work with.


Step 3

Now we will use the code and actually put text in it.

For example:


Code
[table]
[tr]
[td]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam nec orci sit amet massa posuere finibus vitae quis justo.
Pellentesque pretium faucibus justo a eleifend. Vestibulum malesuada accumsan cursus. Phasellus vitae sem non mauris
efficitur pulvinar at a mauris. Sed facilisis lorem nec rhoncus tristique. Donec mattis congue semper. Morbi gravida, quam
vitae vulputate accumsan, sem erat ultrices lacus, sed consequat turpis ipsum non metus. Suspendisse vestibulum nibh sed
odio malesuada fringilla.[/td]

[td]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam nec orci sit amet massa posuere finibus vitae quis justo.
Pellentesque pretium faucibus justo a eleifend. Vestibulum malesuada accumsan cursus. Phasellus vitae sem non mauris
efficitur pulvinar at a mauris. Sed facilisis lorem nec rhoncus tristique. Donec mattis congue semper. Morbi gravida, quam
vitae vulputate accumsan, sem erat ultrices lacus, sed consequat turpis ipsum non metus. Suspendisse vestibulum nibh sed
odio malesuada fringilla.[/td]
[/tr]
[/table]

And voila, you have two columns of text next to each other.

Spoiler
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam nec orci sit amet massa posuere finibus vitae quis justo.
Pellentesque pretium faucibus justo a eleifend. Vestibulum malesuada accumsan cursus. Phasellus vitae sem non mauris
efficitur pulvinar at a mauris. Sed facilisis lorem nec rhoncus tristique. Donec mattis congue semper. Morbi gravida, quam
vitae vulputate accumsan, sem erat ultrices lacus, sed consequat turpis ipsum non metus. Suspendisse vestibulum nibh sed
odio malesuada fringilla.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam nec orci sit amet massa posuere finibus vitae quis justo.
Pellentesque pretium faucibus justo a eleifend. Vestibulum malesuada accumsan cursus. Phasellus vitae sem non mauris
efficitur pulvinar at a mauris. Sed facilisis lorem nec rhoncus tristique. Donec mattis congue semper. Morbi gravida, quam
vitae vulputate accumsan, sem erat ultrices lacus, sed consequat turpis ipsum non metus. Suspendisse vestibulum nibh sed
odio malesuada fringilla.
[close]


Step 4

The only problem now is that there is no space inbetween the columns. To put some space between them
simply put an empty [ td ] [ /td ] line inbetween like this:


Code
[table]
[tr]
[td]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam nec orci sit amet massa posuere finibus vitae quis justo.
Pellentesque pretium faucibus justo a eleifend. Vestibulum malesuada accumsan cursus. Phasellus vitae sem non mauris
efficitur pulvinar at a mauris. Sed facilisis lorem nec rhoncus tristique. Donec mattis congue semper. Morbi gravida, quam
vitae vulputate accumsan, sem erat ultrices lacus, sed consequat turpis ipsum non metus. Suspendisse vestibulum nibh sed
odio malesuada fringilla.[/td]

[td]                    [/td]

[td]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam nec orci sit amet massa posuere finibus vitae quis justo.
Pellentesque pretium faucibus justo a eleifend. Vestibulum malesuada accumsan cursus. Phasellus vitae sem non mauris
efficitur pulvinar at a mauris. Sed facilisis lorem nec rhoncus tristique. Donec mattis congue semper. Morbi gravida, quam
vitae vulputate accumsan, sem erat ultrices lacus, sed consequat turpis ipsum non metus. Suspendisse vestibulum nibh sed
odio malesuada fringilla.[/td]
[/tr]
[/table]

Spoiler
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam nec orci sit amet massa posuere finibus vitae quis justo.
Pellentesque pretium faucibus justo a eleifend. Vestibulum malesuada accumsan cursus. Phasellus vitae sem non mauris
efficitur pulvinar at a mauris. Sed facilisis lorem nec rhoncus tristique. Donec mattis congue semper. Morbi gravida, quam
vitae vulputate accumsan, sem erat ultrices lacus, sed consequat turpis ipsum non metus. Suspendisse vestibulum nibh sed
odio malesuada fringilla.
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam nec orci sit amet massa posuere finibus vitae quis justo.
Pellentesque pretium faucibus justo a eleifend. Vestibulum malesuada accumsan cursus. Phasellus vitae sem non mauris
efficitur pulvinar at a mauris. Sed facilisis lorem nec rhoncus tristique. Donec mattis congue semper. Morbi gravida, quam
vitae vulputate accumsan, sem erat ultrices lacus, sed consequat turpis ipsum non metus. Suspendisse vestibulum nibh sed
odio malesuada fringilla.
[close]

The more spaces between [ td ] [ /td ] will ofcourse give more space inbetween the objects/text.
If you want even more space, then you can also shorten the rules of the paragraph by placing multiple enters.


Click to go back to top (#post_tag0)


2     Creating a ranks/member list template

Ranks/member lists come in all different kind of shapes and sizes. You can choose to put them on the thread vertically next to some text
or you could provide a whole section for it with maybe a picture to the side. The choice is yours.
I will show you a few ways on what I find the most convenient to do.


Variant 1 - Ranks/members list next to columns of text
WIP
[close]
Variant 2 - Section dedicated to ranks/members list with a picture next to it
WIP
[close]


3     Full Regiment Thread Tutorial

Final result of the tutorial
(https://imgyukle.com/f/2021/07/23/Y5fSj.png)



* * *


ABOUT
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pellentesque leo vel aliquet dapibus. Suspendisse ipsum risus,
suscipit ac vulputate vitae, pretium ac mi. Aliquam finibus cursus rhoncus. Suspendisse semper rhoncus vehicula. Maecenas id massa
eu quam imperdiet interdum. Curabitur iaculis felis nisi, at vehicula felis suscipit at. Morbi sem sem, ornare sit amet pellentesque non,
sodales id quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.

Interested in joining? Add one of the officers on steam, or send a personal message on the forums.


* * *


HISTORY OF THE REGIMENT
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pellentesque leo vel aliquet dapibus. Suspendisse ipsum risus,
suscipit ac vulputate vitae, pretium ac mi. Aliquam finibus cursus rhoncus. Suspendisse semper rhoncus vehicula. Maecenas id massa
eu quam imperdiet interdum. Curabitur iaculis felis nisi, at vehicula felis suscipit at. Morbi sem sem, ornare sit amet pellentesque non,
sodales id quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.


(https://imgyukle.com/f/2021/07/23/YIYfq.png)   
The Peninsular War
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse quis eros sed dolor dignissim eleifend. Nulla faucibus vel leo a efficitur.
Sed suscipit tellus sed massa dictum interdum. Ut dictum sapien mi, porttitor tristique lacus eleifend at. In orci dui, consectetur ac maximus nec,
vestibulum sagittis metus. Vestibulum at eros ligula. Mauris posuere finibus vestibulum. In et sollicitudin elit. Integer ut euismod urna. Suspendisse
mattis accumsan leo, sit amet fringilla velit vulputate quis. In tempus libero eget mollis porttitor. Etiam lobortis elit vel rutrum malesuada. Donec
vulputate pellentesque dolor, at pharetra elit aliquam nec.

Ut luctus ultrices risus, ac convallis orci consequat ac. Donec nec placerat nulla, at dictum eros. Etiam quis ex leo. Orci varius natoque penatibus et
magnis dis parturient montes, nascetur ridiculus mus. Mauris maximus rhoncus velit non condimentum. Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Etiam non turpis sem. Fusce pellentesque volutpat vehicula. Praesent in aliquam quam, vel sodales libero. Suspendisse potenti.



Battle of Borodino
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse quis eros sed dolor dignissim eleifend. Nulla faucibus vel leo a efficitur.
Sed suscipit tellus sed massa dictum interdum. Ut dictum sapien mi, porttitor tristique lacus eleifend at. In orci dui, consectetur ac maximus nec,
vestibulum sagittis metus. Vestibulum at eros ligula. Mauris posuere finibus vestibulum. In et sollicitudin elit. Integer ut euismod urna. Suspendisse
mattis accumsan leo, sit amet fringilla velit vulputate quis. In tempus libero eget mollis porttitor. Etiam lobortis elit vel rutrum malesuada. Donec
vulputate pellentesque dolor, at pharetra elit aliquam nec.

Ut luctus ultrices risus, ac convallis orci consequat ac. Donec nec placerat nulla, at dictum eros. Etiam quis ex leo. Orci varius natoque penatibus et
magnis dis parturient montes, nascetur ridiculus mus. Mauris maximus rhoncus velit non condimentum. Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Etiam non turpis sem. Fusce pellentesque volutpat vehicula. Praesent in aliquam quam, vel sodales libero. Suspendisse potenti.
    (https://imgyukle.com/f/2021/07/23/YIYfq.png)


* * *


MUSTER ROLL



Commissioned Officers [2]
(https://imgyukle.com/f/2021/07/23/YTy5n.png)  Colonel Peter Griffin
(https://imgyukle.com/f/2021/07/23/YTy5n.png)  Lieutenant Colonel Cleveland Brown
                         
Non-Commissioned Officers [3]
(https://imgyukle.com/f/2021/07/23/YTy5n.png)  Serjeant Major Stewie Griffin
(https://imgyukle.com/f/2021/07/23/YTy5n.png)  Serjeant Brian Griffin
(https://imgyukle.com/f/2021/07/23/YTy5n.png)  Corporal Chris Griffin
                         
Enlisted [11]
(https://imgyukle.com/f/2021/07/23/YTy5n.png)  Lance Corporal Joe Swanson

(https://imgyukle.com/f/2021/07/23/YTy5n.png)  Grenadier Adam West
(https://imgyukle.com/f/2021/07/23/YTy5n.png)  Grenadier Cleveland Brown Jr.

(https://imgyukle.com/f/2021/07/23/YTy5n.png)  Private Glenn Quagmire
(https://imgyukle.com/f/2021/07/23/YTy5n.png)  Private Tom Tucker
(https://imgyukle.com/f/2021/07/23/YTy5n.png)  Private Jonathan Weed
(https://imgyukle.com/f/2021/07/23/YTy5n.png)  Private Jake Tucker
(https://imgyukle.com/f/2021/07/23/YTy5n.png)  Private Carter Pewterschmidt
(https://imgyukle.com/f/2021/07/23/YTy5n.png)  Private Elmer Hartman
(https://imgyukle.com/f/2021/07/23/YTy5n.png)  Private Jim Caplan
(https://imgyukle.com/f/2021/07/23/YTy5n.png)  Private Neil Goldman
[close]


We are going to make a regiment thread for the 153e Régiment d'Infanterie de Ligne.

In the spoiler above you can see the result of what we are working towards. A very basic, but an organized thread. Like above, I will explain it step by step.

Please, don't just copy-paste blindly without looking. Try to read the codes and practice with them.
I know, it takes a bit of time but once you get the hang of it, you can go to town with any design in your head.

Let's begin.



Step 1

It's very important to have a good header on your thread. A good header will immediately catch the eye. Try to look out for highly detailed pictures.
If they are too big, you can always crop them. If you don't have enough money, or you don't want to spend money for a program to do just this,
you can download paint.NET (Click here - Download page) (https://www.getpaint.net/download.html) for free. It's basically a lite version of photoshop.

You can also use paint.NET to remove any backgrounds. What I suggest is taking a soft brush. Put the size on 10 and the hardness on 20 and go around the
edges of the soldiers and/or objects that you want to cut out. The 20% hardness will make sure your edges won't look pixelated. I'm not going in full depth
talking about Graphics Design as this tutorial will only go about the actual layout of this regiment thread.
But, if you want me to make a tutorial on my take on headers, just let me know.

Important note; after each step, you can also click the 'view' option before posting. This way you can see what you are doing.

I have made myself a header which I will use.


Spoiler
(https://imgyukle.com/f/2021/07/23/Y5fSj.png)
[close]

You always want to center your headers obviously.  Click in your text editor on the align button that centers your text.
We will also need the image tag (https://www.fsegames.eu/forum/Themes/Battle%20Cry%20of%20Freedom/images/bbc/img.gif).

Your code will look like this:


Code
[center][img]https://imgyukle.com/f/2021/07/23/Y5fSj.png[/img][/center]


Step 2

Now, we will put 3 enters under the header. After you have done that we will make a spacer. A spacer can be useful to have some space
between text and objects. Your thread will look less sloppy when you use them right. I have chosen 3 asterisk's as I think it looks a bit authentic

To make the spacer, we will have to center it. After that, choose a font for the asterisk's that you like. I have chosen the font 'Garamond'. I have
gone with font size 18 as the Garamond font is standard a little smaller than some other fonts.
When you have completed step 2, your code will look like this:


Code
[center][img]https://imgyukle.com/f/2021/07/23/Y5fSj.png[/img][/center]



[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]


Step 3

In this part, we will add an About section. Here you can write about what your regiment is about, and who you are as a community.

First things first, this part will also be centered. After that, we will need a table. The reason behind this is because we will use
horizontal lines. When you don't put a horizontal line in a table, it will take the whole width of the thread. When you want the
horizontal line to be only as long as the title, you will have to put them into a table.

In the first chapter of this guide, we have seen how to insert a table. However, you can also create a table without clicking on
the table icon. You can also just type [ td ] [ /td ] and after that, it will simulate a table for you. Of course, don't put these spaces
between "td" and the brackets. I have done this because otherwise, you wouldn't be able to see it written.

When you have completed this, your code will look like this:


Code
[center][img]https://imgyukle.com/f/2021/07/23/Y5fSj.png[/img][/center]



[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[center][td]ABOUT[/td][/center]


Step 3.1

Now we will add the horizontal lines. To do this is very simple. Left of the Spoiler icon you will see a
horizontal line with arrows pointing outwards. That is the button you have to press. An other way
in inserting them is by typing [ hr ], also keep in mind again, no spaces between text and the brackets.

Place them within your table, when this is done, your code will look like this:


Code
[center][img]https://imgyukle.com/f/2021/07/23/Y5fSj.png[/img][/center]



[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[center][td][hr]ABOUT[hr][/td][/center]


Step 3.2

The rest of this step is very simple. Now select only the text of 'ABOUT' or your preferred title and
choose a font and font size that you like. Also, I would advise making your titles bold as they will
stand out a little bit more. I have gone with Garamond, size 18pt's.

Also an important note; for some reason when you put text into tables, the text will turn into a gray
color. If you don't mind that you can keep it this way, but if you want your text to be black then go to
the right of the font size option and choose the color black.

If you have completed all of this, your code will look like this:


Code
[center][img]https://imgyukle.com/f/2021/07/23/Y5fSj.png[/img][/center]



[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[center][td][hr][font=Garamond][size=16pt][b][color=black]ABOUT[/color][/b][/size][/font][hr][/td][/center]


Step 3.3

What we have to do now is just put a paragraph of text in. Place your paragraph right under your title. The horizontal
lines already create a bit of space above and under them. When you have done that, choose again a font and font size
for the main text of your preference. I have gone again with Garamond and 11pt's of size.

Now notice that your text goes straight through the whole width of the thread. In order to have a smaller paragraph just
hit a few enters to cut off lines of text to let them start in a new rule. It will make the thread also look less sloppy.

I have also put an "Add a person to join" text rule as it is helpful for people who do want to join.
I have also put this in cursive. But it's a matter of preference.

When you finished all of this, your code should look like this:

Note: If you don't see [ table ] [ tr ] etc, don't worry. It's because we didn't click on the table button.
After you posted or viewed the thread before posting they will pop up.


Code
[center][img]https://imgyukle.com/f/2021/07/23/Y5fSj.png[/img][/center]



[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[center][table][tr][td][hr][font=Garamond][size=16pt][b][color=black]ABOUT[/color][/b][/size][/font][hr][/td][/tr][/table][/center]
[center][font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pellentesque leo vel aliquet dapibus. Suspendisse ipsum risus,
suscipit ac vulputate vitae, pretium ac mi. Aliquam finibus cursus rhoncus. Suspendisse semper rhoncus vehicula. Maecenas id massa
eu quam imperdiet interdum. Curabitur iaculis felis nisi, at vehicula felis suscipit at. Morbi sem sem, ornare sit amet pellentesque non,
sodales id quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.

[i]Interested in joining? Add one of the officers on steam, or send a personal message on the forums.[/i][/size][/font][/center]


Step 4

We will create another spacer. Place two enters under the paragraph of text. And copy-paste the
spacer we used before.

Note: Don't worry about the cursive text in the code. I believe it's a bug. On your thread, it should be alright.

When you have done that your code will look like this:


Code
[center][img]https://imgyukle.com/f/2021/07/23/Y5fSj.png[/img][/center]



[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[center][table][tr][td][hr][font=Garamond][size=16pt][b][color=black]ABOUT[/color][/b][/size][/font][hr][/td][/tr][/table][/center]
[center][font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pellentesque leo vel aliquet dapibus. Suspendisse ipsum risus,
suscipit ac vulputate vitae, pretium ac mi. Aliquam finibus cursus rhoncus. Suspendisse semper rhoncus vehicula. Maecenas id massa
eu quam imperdiet interdum. Curabitur iaculis felis nisi, at vehicula felis suscipit at. Morbi sem sem, ornare sit amet pellentesque non,
sodales id quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.

[i]Interested in joining? Add one of the officers on steam, or send a personal message on the forums.[/i][/size][/font][/center]


[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]


Step 5

Now for the fifth step, we are going to create the history section. Place one enter under the spacer we made above.
What I want you to do now is copy-paste the whole 'ABOUT' section and place it under the spacer. After that delete
the text within the 'ABOUT' section and put in a paragraph of the regiment's history. Also, of course, replace the title.

When you have done that, your code should look like this:


Code
[center][img]https://imgyukle.com/f/2021/07/23/Y5fSj.png[/img][/center]



[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[center][table][tr][td][hr][font=Garamond][size=16pt][b][color=black]ABOUT[/color][/b][/size][/font][hr][/td][/tr][/table][/center]
[center][font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pellentesque leo vel aliquet dapibus. Suspendisse ipsum risus,
suscipit ac vulputate vitae, pretium ac mi. Aliquam finibus cursus rhoncus. Suspendisse semper rhoncus vehicula. Maecenas id massa
eu quam imperdiet interdum. Curabitur iaculis felis nisi, at vehicula felis suscipit at. Morbi sem sem, ornare sit amet pellentesque non,
sodales id quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.

[i]Interested in joining? Add one of the officers on steam, or send a personal message on the forums.[/i][/size][/font][/center]


[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[center][table][tr][td][hr][font=Garamond][size=16pt][b][color=black]HISTORY OF THE REGIMENT[/color][/b][/size][/font][hr][/td][/tr][/table][/center]
[center][font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pellentesque leo vel aliquet dapibus. Suspendisse ipsum risus,
suscipit ac vulputate vitae, pretium ac mi. Aliquam finibus cursus rhoncus. Suspendisse semper rhoncus vehicula. Maecenas id massa
eu quam imperdiet interdum. Curabitur iaculis felis nisi, at vehicula felis suscipit at. Morbi sem sem, ornare sit amet pellentesque non,
sodales id quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.[/size][/font][/center]


Step 5.1

We are not done yet with the history section. It would look a little boring, having a thread with only text paragraphs.

What we are going to do now is make a table. A table including a picture on the left and a text paragraph on the right.
Above the paragraph, we are also going to put a title with horizontal lines above and under it.

Make sure to have two empty rules under the history text paragraph. After that make a table with 3 [ td ] rules.

Like this:


Code
[td][/td]

[td][/td]

[td][/td]


Step 5.1.1

When you have done that, place your cursor in the middle [ td ] rule and press the spacebar 4 times.

It should look like this:


Code
[td][/td]

[td]    [/td]

[td][/td]


Step 5.1.2

Now it's time to put an image in the upper rule. Keep in mind that you take high-definition pictures and a big enough
size so that the text won't go under them. It takes a bit of time sometimes cropping the image to get it as high as the
paragraph. Trust me, if you take this time, it's gonna look a lot better.

When you have placed your image, your code should look like this:


Code
[center][img]https://imgyukle.com/f/2021/07/23/Y5fSj.png[/img][/center]



[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[center][table][tr][td][hr][font=Garamond][size=16pt][b][color=black]ABOUT[/color][/b][/size][/font][hr][/td][/tr][/table][/center]
[center][font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pellentesque leo vel aliquet dapibus. Suspendisse ipsum risus,
suscipit ac vulputate vitae, pretium ac mi. Aliquam finibus cursus rhoncus. Suspendisse semper rhoncus vehicula. Maecenas id massa
eu quam imperdiet interdum. Curabitur iaculis felis nisi, at vehicula felis suscipit at. Morbi sem sem, ornare sit amet pellentesque non,
sodales id quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.

[i]Interested in joining? Add one of the officers on steam, or send a personal message on the forums.[/i][/size][/font][/center]


[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[center][table][tr][td][hr][font=Garamond][size=16pt][b][color=black]HISTORY OF THE REGIMENT[/color][/b][/size][/font][hr][/td][/tr][/table][/center]
[center][font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pellentesque leo vel aliquet dapibus. Suspendisse ipsum risus,
suscipit ac vulputate vitae, pretium ac mi. Aliquam finibus cursus rhoncus. Suspendisse semper rhoncus vehicula. Maecenas id massa
eu quam imperdiet interdum. Curabitur iaculis felis nisi, at vehicula felis suscipit at. Morbi sem sem, ornare sit amet pellentesque non,
sodales id quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.[/size][/font][/center]


[td][img]https://imgyukle.com/f/2021/07/23/YIYfq.png[/img][/td]

[td]    [/td]

[td][/td]


Step 5.1.3

Now for the title, it's very simple. Just create two horizontal lines in the bottom [ td ] rule.
Also, try to stick with the fonts and font sizes you have used before for titles and text.

I made the title a little bit smaller, as it is a subtitle. I have used Garamond with 14 pt's.

When you have done this, your code should look like this:


Code
[center][img]https://imgyukle.com/f/2021/07/23/Y5fSj.png[/img][/center]



[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[center][table][tr][td][hr][font=Garamond][size=16pt][b][color=black]ABOUT[/color][/b][/size][/font][hr][/td][/tr][/table][/center]
[center][font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pellentesque leo vel aliquet dapibus. Suspendisse ipsum risus,
suscipit ac vulputate vitae, pretium ac mi. Aliquam finibus cursus rhoncus. Suspendisse semper rhoncus vehicula. Maecenas id massa
eu quam imperdiet interdum. Curabitur iaculis felis nisi, at vehicula felis suscipit at. Morbi sem sem, ornare sit amet pellentesque non,
sodales id quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.

[i]Interested in joining? Add one of the officers on steam, or send a personal message on the forums.[/i][/size][/font][/center]


[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[center][table][tr][td][hr][font=Garamond][size=16pt][b][color=black]HISTORY OF THE REGIMENT[/color][/b][/size][/font][hr][/td][/tr][/table][/center]
[center][font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pellentesque leo vel aliquet dapibus. Suspendisse ipsum risus,
suscipit ac vulputate vitae, pretium ac mi. Aliquam finibus cursus rhoncus. Suspendisse semper rhoncus vehicula. Maecenas id massa
eu quam imperdiet interdum. Curabitur iaculis felis nisi, at vehicula felis suscipit at. Morbi sem sem, ornare sit amet pellentesque non,
sodales id quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.[/size][/font][/center]


[table][tr][td][img]https://imgyukle.com/f/2021/07/23/YIYfq.png[/img][/td]

[td]    [/td]

[td][hr][font=Garamond][size=14pt][b][color=black]The Peninsular War[/color][/b][/size][/font][hr][/td]


Step 5.1.4

At the end of your sub-title rule, you will see a closing table code. [ /td ]

Before the first bracket, hit enter because we are going to place text in the same table under the title.

When you have done that, place your paragraph of history text that you want to use.
Remember to cut off the text so that the text and image won't cover the whole
width of the thread. Also make sure you selected your font and font size again.

When you have done that, your code should look like this:


Code
[center][img]https://imgyukle.com/f/2021/07/23/Y5fSj.png[/img][/center]



[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[center][table][tr][td][hr][font=Garamond][size=16pt][b][color=black]ABOUT[/color][/b][/size][/font][hr][/td][/tr][/table][/center]
[center][font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pellentesque leo vel aliquet dapibus. Suspendisse ipsum risus,
suscipit ac vulputate vitae, pretium ac mi. Aliquam finibus cursus rhoncus. Suspendisse semper rhoncus vehicula. Maecenas id massa
eu quam imperdiet interdum. Curabitur iaculis felis nisi, at vehicula felis suscipit at. Morbi sem sem, ornare sit amet pellentesque non,
sodales id quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.

[i]Interested in joining? Add one of the officers on steam, or send a personal message on the forums.[/i][/size][/font][/center]


[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[center][table][tr][td][hr][font=Garamond][size=16pt][b][color=black]HISTORY OF THE REGIMENT[/color][/b][/size][/font][hr][/td][/tr][/table][/center]
[center][font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pellentesque leo vel aliquet dapibus. Suspendisse ipsum risus,
suscipit ac vulputate vitae, pretium ac mi. Aliquam finibus cursus rhoncus. Suspendisse semper rhoncus vehicula. Maecenas id massa
eu quam imperdiet interdum. Curabitur iaculis felis nisi, at vehicula felis suscipit at. Morbi sem sem, ornare sit amet pellentesque non,
sodales id quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.[/size][/font][/center]


[table][tr][td][img]https://imgyukle.com/f/2021/07/23/YIYfq.png[/img][/td]

[td]    [/td]

[td][hr][font=Garamond][size=14pt][b][color=black]The Peninsular War[/color][/b][/size][/font][hr]
[font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse quis eros sed dolor dignissim eleifend. Nulla faucibus vel leo a efficitur.
Sed suscipit tellus sed massa dictum interdum. Ut dictum sapien mi, porttitor tristique lacus eleifend at. In orci dui, consectetur ac maximus nec,
vestibulum sagittis metus. Vestibulum at eros ligula. Mauris posuere finibus vestibulum. In et sollicitudin elit. Integer ut euismod urna. Suspendisse
mattis accumsan leo, sit amet fringilla velit vulputate quis. In tempus libero eget mollis porttitor. Etiam lobortis elit vel rutrum malesuada. Donec
vulputate pellentesque dolor, at pharetra elit aliquam nec.

Ut luctus ultrices risus, ac convallis orci consequat ac. Donec nec placerat nulla, at dictum eros. Etiam quis ex leo. Orci varius natoque penatibus et
magnis dis parturient montes, nascetur ridiculus mus. Mauris maximus rhoncus velit non condimentum. Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Etiam non turpis sem. Fusce pellentesque volutpat vehicula. Praesent in aliquam quam, vel sodales libero. Suspendisse potenti. [/size][/font][/td]


Step 5.1.5

Now make sure to have two empty rules under your history text paragraph.
Be aware to put your cursor behind the codes and not just the text.

We are going to make another table. The very same like we did now. But
for now we are going to place the text on the left and the image on the right.

If you are smart, just copy paste the entire table and replace the image with
a paragraph and the paragraph with an image.

When you have done that, your code should look like this:


Code
[center][img]https://imgyukle.com/f/2021/07/23/Y5fSj.png[/img][/center]



[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[center][table][tr][td][hr][font=Garamond][size=16pt][b][color=black]ABOUT[/color][/b][/size][/font][hr][/td][/tr][/table][/center]
[center][font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pellentesque leo vel aliquet dapibus. Suspendisse ipsum risus,
suscipit ac vulputate vitae, pretium ac mi. Aliquam finibus cursus rhoncus. Suspendisse semper rhoncus vehicula. Maecenas id massa
eu quam imperdiet interdum. Curabitur iaculis felis nisi, at vehicula felis suscipit at. Morbi sem sem, ornare sit amet pellentesque non,
sodales id quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.

[i]Interested in joining? Add one of the officers on steam, or send a personal message on the forums.[/i][/size][/font][/center]


[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[center][table][tr][td][hr][font=Garamond][size=16pt][b][color=black]HISTORY OF THE REGIMENT[/color][/b][/size][/font][hr][/td][/tr][/table][/center]
[center][font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pellentesque leo vel aliquet dapibus. Suspendisse ipsum risus,
suscipit ac vulputate vitae, pretium ac mi. Aliquam finibus cursus rhoncus. Suspendisse semper rhoncus vehicula. Maecenas id massa
eu quam imperdiet interdum. Curabitur iaculis felis nisi, at vehicula felis suscipit at. Morbi sem sem, ornare sit amet pellentesque non,
sodales id quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.[/size][/font][/center]


[table][tr][td][img]https://imgyukle.com/f/2021/07/23/YIYfq.png[/img][/td]

[td]    [/td]

[td][hr][font=Garamond][size=14pt][b][color=black]The Peninsular War[/color][/b][/size][/font][hr]
[font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse quis eros sed dolor dignissim eleifend. Nulla faucibus vel leo a efficitur.
Sed suscipit tellus sed massa dictum interdum. Ut dictum sapien mi, porttitor tristique lacus eleifend at. In orci dui, consectetur ac maximus nec,
vestibulum sagittis metus. Vestibulum at eros ligula. Mauris posuere finibus vestibulum. In et sollicitudin elit. Integer ut euismod urna. Suspendisse
mattis accumsan leo, sit amet fringilla velit vulputate quis. In tempus libero eget mollis porttitor. Etiam lobortis elit vel rutrum malesuada. Donec
vulputate pellentesque dolor, at pharetra elit aliquam nec.

Ut luctus ultrices risus, ac convallis orci consequat ac. Donec nec placerat nulla, at dictum eros. Etiam quis ex leo. Orci varius natoque penatibus et
magnis dis parturient montes, nascetur ridiculus mus. Mauris maximus rhoncus velit non condimentum. Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Etiam non turpis sem. Fusce pellentesque volutpat vehicula. Praesent in aliquam quam, vel sodales libero. Suspendisse potenti. [/size][/font][/td][/tr][/table]


[table][tr][td][hr][font=Garamond][size=14pt][b][color=black]Battle of Borodino[/color][/b][/size][/font][hr]
[font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse quis eros sed dolor dignissim eleifend. Nulla faucibus vel leo a efficitur.
Sed suscipit tellus sed massa dictum interdum. Ut dictum sapien mi, porttitor tristique lacus eleifend at. In orci dui, consectetur ac maximus nec,
vestibulum sagittis metus. Vestibulum at eros ligula. Mauris posuere finibus vestibulum. In et sollicitudin elit. Integer ut euismod urna. Suspendisse
mattis accumsan leo, sit amet fringilla velit vulputate quis. In tempus libero eget mollis porttitor. Etiam lobortis elit vel rutrum malesuada. Donec
vulputate pellentesque dolor, at pharetra elit aliquam nec.

Ut luctus ultrices risus, ac convallis orci consequat ac. Donec nec placerat nulla, at dictum eros. Etiam quis ex leo. Orci varius natoque penatibus et
magnis dis parturient montes, nascetur ridiculus mus. Mauris maximus rhoncus velit non condimentum. Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Etiam non turpis sem. Fusce pellentesque volutpat vehicula. Praesent in aliquam quam, vel sodales libero. Suspendisse potenti.[/size][/font][/td]

[td]    [/td]

[td][img]https://imgyukle.com/f/2021/07/23/YIYfq.png[/img][/td][/tr][/table]


Step 6

Now the final part. The roster. When you have come this far, this will be a piece of cake.
Rosters can have different layouts. But for this tutorial, we are going to keep it simple.

Before the roster use a spacer again to give it  a bit of space. Just copy and paste the spacer from earlier.
After that, copy the 'ABOUT' title code and paste it. Change 'ABOUT' to Muster Roll or anything you like.

We are going to need a table again. But this time with 5 [ td ] rules.

Like this:


Code
[td][/td]

[td][/td]

[td][/td]

[td][/td]

[td][/td]

When that is done, make sure to hit the spacebar 25 times in the 2nd from the
top and 2nd from the bottom [ td ] rules.

Like this:


Code
[td][/td]

[td]                         [/td]

[td][/td]

[td]                         [/td]

[td][/td]

Now to fill in these tables, all you need is to add the horizontal lines again. Put them in
each of the [ td ] rules. After that, you use the same font as you have always used as well
as a proper font size for sub-titles. When you have done that you can fill in the roster.

Officers and NCOs can just be written under each other, except for the enlisted. Try to leave an
enter of space between each rank. It will give a cleaner look.

You can also put country flags before each player. Just use the image tag and press it 2 times on
the spacebar to give a little space between the flag and the text.

I am going to let you try this one out.

When you have done that, your whole thread code should look like this:


Code
[center][img]https://imgyukle.com/f/2021/07/23/Y5fSj.png[/img][/center]



[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[center][table][tr][td][hr][font=Garamond][size=16pt][b][color=black]ABOUT[/color][/b][/size][/font][hr][/td][/tr][/table][/center]
[center][font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pellentesque leo vel aliquet dapibus. Suspendisse ipsum risus,
suscipit ac vulputate vitae, pretium ac mi. Aliquam finibus cursus rhoncus. Suspendisse semper rhoncus vehicula. Maecenas id massa
eu quam imperdiet interdum. Curabitur iaculis felis nisi, at vehicula felis suscipit at. Morbi sem sem, ornare sit amet pellentesque non,
sodales id quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.

[i]Interested in joining? Add one of the officers on steam, or send a personal message on the forums.[/i][/size][/font][/center]


[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[center][table][tr][td][hr][font=Garamond][size=16pt][b][color=black]HISTORY OF THE REGIMENT[/color][/b][/size][/font][hr][/td][/tr][/table][/center]
[center][font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pellentesque leo vel aliquet dapibus. Suspendisse ipsum risus,
suscipit ac vulputate vitae, pretium ac mi. Aliquam finibus cursus rhoncus. Suspendisse semper rhoncus vehicula. Maecenas id massa
eu quam imperdiet interdum. Curabitur iaculis felis nisi, at vehicula felis suscipit at. Morbi sem sem, ornare sit amet pellentesque non,
sodales id quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.[/size][/font][/center]


[table][tr][td][img]https://imgyukle.com/f/2021/07/23/YIYfq.png[/img][/td]

[td]    [/td]

[td][hr][font=Garamond][size=14pt][b][color=black]The Peninsular War[/color][/b][/size][/font][hr]
[font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse quis eros sed dolor dignissim eleifend. Nulla faucibus vel leo a efficitur.
Sed suscipit tellus sed massa dictum interdum. Ut dictum sapien mi, porttitor tristique lacus eleifend at. In orci dui, consectetur ac maximus nec,
vestibulum sagittis metus. Vestibulum at eros ligula. Mauris posuere finibus vestibulum. In et sollicitudin elit. Integer ut euismod urna. Suspendisse
mattis accumsan leo, sit amet fringilla velit vulputate quis. In tempus libero eget mollis porttitor. Etiam lobortis elit vel rutrum malesuada. Donec
vulputate pellentesque dolor, at pharetra elit aliquam nec.

Ut luctus ultrices risus, ac convallis orci consequat ac. Donec nec placerat nulla, at dictum eros. Etiam quis ex leo. Orci varius natoque penatibus et
magnis dis parturient montes, nascetur ridiculus mus. Mauris maximus rhoncus velit non condimentum. Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Etiam non turpis sem. Fusce pellentesque volutpat vehicula. Praesent in aliquam quam, vel sodales libero. Suspendisse potenti. [/size][/font][/td][/tr][/table]


[table][tr][td][hr][font=Garamond][size=14pt][b][color=black]Battle of Borodino[/color][/b][/size][/font][hr]
[font=Garamond][size=11pt]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse quis eros sed dolor dignissim eleifend. Nulla faucibus vel leo a efficitur.
Sed suscipit tellus sed massa dictum interdum. Ut dictum sapien mi, porttitor tristique lacus eleifend at. In orci dui, consectetur ac maximus nec,
vestibulum sagittis metus. Vestibulum at eros ligula. Mauris posuere finibus vestibulum. In et sollicitudin elit. Integer ut euismod urna. Suspendisse
mattis accumsan leo, sit amet fringilla velit vulputate quis. In tempus libero eget mollis porttitor. Etiam lobortis elit vel rutrum malesuada. Donec
vulputate pellentesque dolor, at pharetra elit aliquam nec.

Ut luctus ultrices risus, ac convallis orci consequat ac. Donec nec placerat nulla, at dictum eros. Etiam quis ex leo. Orci varius natoque penatibus et
magnis dis parturient montes, nascetur ridiculus mus. Mauris maximus rhoncus velit non condimentum. Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Etiam non turpis sem. Fusce pellentesque volutpat vehicula. Praesent in aliquam quam, vel sodales libero. Suspendisse potenti.[/size][/font][/td]

[td]    [/td]

[td][img]https://imgyukle.com/f/2021/07/23/YIYfq.png[/img][/td][/tr][/table]


[center][font=Garamond][size=18pt][color=black]* * *[/color][/size][/font][center]

[table][tr][td][hr][font=Garamond][size=16pt][b][color=black]MUSTER ROLL[/color][/b][/size][/font][hr][/td][/tr][/table]


[table][tr][td][hr][font=Garamond][size=13pt][b][color=black]Commissioned Officers [2][/color][/b][/size][/font][hr]
[font=Garamond][size=11pt][img]https://imgyukle.com/f/2021/07/23/YTy5n.png[/img]  Colonel Peter Griffin
[img]https://imgyukle.com/f/2021/07/23/YTy5n.png[/img]  Lieutenant Colonel Cleveland Brown[/size][/font][/td]

[td]                         [/td]

[td][hr][font=Garamond][size=13pt][b][color=black]Non-Commissioned Officers [3][/color][/b][/size][/font][hr]
[font=Garamond][size=11pt][img]https://imgyukle.com/f/2021/07/23/YTy5n.png[/img]  Serjeant Major Stewie Griffin
[img]https://imgyukle.com/f/2021/07/23/YTy5n.png[/img]  Serjeant Brian Griffin
[img]https://imgyukle.com/f/2021/07/23/YTy5n.png[/img]  Corporal Chris Griffin[/size][/font][/td]

[td]                         [/td]

[td][hr][font=Garamond][size=13pt][b][color=black]Enlisted [11][/color][/b][/size][/font][hr]
[font=Garamond][size=11pt][img]https://imgyukle.com/f/2021/07/23/YTy5n.png[/img]  Lance Corporal Joe Swanson

[img]https://imgyukle.com/f/2021/07/23/YTy5n.png[/img]  Grenadier Adam West
[img]https://imgyukle.com/f/2021/07/23/YTy5n.png[/img]  Grenadier Cleveland Brown Jr.

[img]https://imgyukle.com/f/2021/07/23/YTy5n.png[/img]  Private Glenn Quagmire
[img]https://imgyukle.com/f/2021/07/23/YTy5n.png[/img]  Private Tom Tucker
[img]https://imgyukle.com/f/2021/07/23/YTy5n.png[/img]  Private Jonathan Weed
[img]https://imgyukle.com/f/2021/07/23/YTy5n.png[/img]  Private Jake Tucker
[img]https://imgyukle.com/f/2021/07/23/YTy5n.png[/img]  Private Carter Pewterschmidt
[img]https://imgyukle.com/f/2021/07/23/YTy5n.png[/img]  Private Elmer Hartman
[img]https://imgyukle.com/f/2021/07/23/YTy5n.png[/img]  Private Jim Caplan
[img]https://imgyukle.com/f/2021/07/23/YTy5n.png[/img]  Private Neil Goldman
[/size][/font][/td][/tr][/table]

I hope you guys found this useful. I know it can be a lot to take in when you have never
used it before. Therefore, if you are working on your page and there is something you don't
understand feel free to contact me. I'm pretty active on here.






Click to go back to top (#post_tag0)








Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Skaenn on June 02, 2020, 12:45:06 pm
reserved space

Please don't spam unnecessary comments. This makes things easier to help people who are needing it.
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Astoria on June 02, 2020, 05:34:20 pm
good luck gardaşım ♥
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Skaenn on June 02, 2020, 05:44:42 pm
good luck gardaşım ♥
Thanks gardes
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Radulf on June 02, 2020, 06:04:08 pm
Good work as usual
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Tardet on June 02, 2020, 06:05:04 pm
Quality thread. Thank you for taking the time to help people out with BB code.
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Golden. on June 02, 2020, 06:22:57 pm
Dont need this just steal it from other good threads  ;D ;D
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Skaenn on June 02, 2020, 06:24:41 pm
I appreciate it Zeyden and Tardet. Thanks :) Hopefully this will be useful indeed.

@Golden, I guess at your own risk ;p
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Kraz on June 02, 2020, 06:33:21 pm
very good work man !
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Skaenn on June 02, 2020, 07:04:55 pm
Thanks friend!
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Giles on June 02, 2020, 11:23:20 pm
Excellent work, kardeşim.  8)
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Skaenn on June 03, 2020, 08:19:56 am
Excellent work, kardeşim.  8)
Thanks Giles!

Tutorial for a rank/member roster and full regiment/clan thread coming soon.
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Skaenn on July 18, 2021, 01:29:31 pm
Whilst my Workshop is open again I decided to have a go at this one again as well. Hopefully, this can be of use to some people. If you stumble upon a problem in your thread, you can always post here and I'll take a look at it to fix it. Feel free to post suggestions on what layout to include in this guide as well. Will be updated through the weeks.
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: ~Midnight~ on July 21, 2021, 10:13:11 pm
All of the threads pls
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Scottish Unicorn on July 21, 2021, 11:25:20 pm
Skaenns threads are always amazing looking. What a king.

I would love to have an ounce of his creativity and skill!
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Skaenn on July 23, 2021, 11:31:50 pm
Skaenns threads are always amazing looking. What a king.

I would love to have an ounce of his creativity and skill!
Trust me, anyone can do this. It is very simple to learn. If you know how tables work it is basically “ez pz”. Just have to put some time into it. If you make a lay out like drawing boxes, you can even do it in paint, it might be easier to have a clear view on what you are working towards.

But thanks I appreciate it as it takes quite some time to build one.



If I have time tomorrow I’ll finish the other two tutorials after work. Worst case scenario this weekend.



Edit; I have decided to make a basic full thread tutorial as I think it's more fun to follow. Please do note, don't just copy everything without actually looking at it. Try to carefully
read the codes as well the steps to get the result. You can of course use this lay-out for your regiment/groupfighting team thread. It's all BB Code so I don't have any
rights on this.

The template we will be working out will be the following;

Spoiler
(https://imgyukle.com/f/2021/07/22/T871t.png)
[close]

I'll try to finish it this evening.



Edit 2; Tutorial for a regiment thread is finished.
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: MarxeiL on July 25, 2021, 07:18:39 pm
Good shit man
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Skaenn on July 25, 2021, 07:24:18 pm
Good shit man
Thanks, much appreciated.
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: ~NickCole~ on July 26, 2021, 12:55:36 pm
This is really dope dude. I have always struggled with coding tables on FSE but glad there is another thread like yours that helps my 2 brain cells learn how to make a thread without asking you.  :-*
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Skaenn on July 27, 2021, 09:53:38 am
This is really dope dude. I have always struggled with coding tables on FSE but glad there is another thread like yours that helps my 2 brain cells learn how to make a thread without asking you.  :-*
It took quite some time to make this guide, so I am glad that it actually helps people. Thanks for the nice feedback. I'm also planning to make the thread a bit more appealing over time.

Edit; since all the votes were positive, I'll do a tutorial of how I make my headers. Should be up either today or tomorrow.
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Saxon on September 01, 2021, 04:19:17 pm
I'm trying to get a roster next to a record (groupfighting thread) and everytime I do it it just throws all my shit off

Skaen send help
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: ~Midnight~ on September 01, 2021, 04:24:15 pm
Help him Skaen-wan Kenobi. You're his only hope :'(
Title: Re: BB Code Table Guide [Creating a proper thread]
Post by: Skaenn on September 16, 2021, 07:37:21 pm
I'll be updating the thread soon with the new image host. The one I used before seems to be bugged. Let me know if there are any suggestions for a lay-out or troubles in your code.