[LEARN] BBCode Lessons & Tutorials [+tutorial videos!]

[roslinpl]

Lesson 9: "Inside of tables": Image size

This is a quick lesson or perhaps just a quick tip.
Lesson 9 is not related with signatures but it's related with BBCode and it's good to know about it when you think about thread design improvements etc.

If you want to create a table and put some images inside of table rows your image will be visually resized (to smaller).
Adding width attribute to our image will not solve the problem.

Example:

150px x 150px Bitcoin logo But it's not 150x150...

150px x 150px Bitcoin logo Width=150 added. Still it's not 150x150..

Example code:

Code:

[quote][table]
[tr]
[td]
[img]https://i.imgur.com/OaJobp5.png[/img]
[/td]
[td]
150px x 150px Bitcoin logo
But it's not 150x150...
[/td]
[/tr]
[/table][/quote]

[quote][table]
[tr]
[td]
[img width=150]https://i.imgur.com/OaJobp5.png[/img]
[/td]
[td]
150px x 150px Bitcoin logo
Width=150 added. Still it's not 150x150..
[/td]
[/tr]
[/table][/quote]

How to solve the problem?
In a same row where the image is we need to type a random line of text which will be longer than image width.
And make it transparent. ( color=transparent ).

fffffffffffffffffffffffffffffff

150px x 150px Bitcoin logo Now without any width attribute it's displayed as 150px x 150px

Code:

Code:

[quote][table]
[tr]
[td]
[img]https://i.imgur.com/OaJobp5.png[/img]
[color=transparent]fffffffffffffffffffffffffffffff[/color]
[/td]
[td]
150px x 150px Bitcoin logo
Now without any width attribute it's displayed as 150px x 150px
[/td]
[/tr]
[/table][/quote]

Thank you very much man, this was a great tutorial, I am new here but from the begining I was interested about how to create bbcode signature. Don't forget that there are some people, which will like your work.

thank you for this awesome work

Hello,

You're welcome

Best wishes.

[1714861319]

1714861319

[1714861319]

1714861319

[1714861319]

1714861319

[roslinpl]

Hello,


I noticed that using 'monospace' font family for BBCode designs makes a design more compatible on different systems even Mac OSX.

Code:

[font=Monospace][size=2pt]██████[/size][/font]

But there is one problem, it doesn't look so well under Linux / Windows / Android.
But it looks "same" under ie. Windows Chrome & OSX Safari..

In some cases it may be better to draw BBCode designs with Monospace font. Especially for single color / black designs.

I will draw some examples to compare later on.


Have a great day and best wishes.

[monsanto]

Thanks for creating these lessons  

[Russlenat]

Thank you also for these thread. It help me a lot. now I know how to make beautiful threads...

[fitraok09]

Lesson 10 still coming soon 
I still learn from you... 

[Renji Abarai]

Impressive! Very informative and glad you have made this tutorial. I am searching this tutorial for a long time. It is timely that I have more free time now for an early vacation, now I can focus on this. Continue to make this informative tutorial, really help us to especially those aspiring campaign signature designer.

[roslinpl]

Thank you everyone!

Your opinions are like the honey to my heart

It's my pleasure to continue with tutorials, I just need time to write another proper lesson/tutorial which will take your skills to the another level

Keep an eye on this thread and soon it will bring the lesson 10 to all of you


Best wishes.

[roslinpl]

Hello,

Just a quick drop

If you need to draw a logo or an element which shape is a circle you can start from this template:

░░░░░░▄▄▄████████▄▄▄ ░░░░▄████████████████▄ ░░▄████████████████████▄ ░████████████████████████ ▐████████████████████████▌ ██████████████████████████ ██████████████████████████ ██████████████████████████ ▐████████████████████████▌ ░████████████████████████ ░░▀████████████████████▀ ░░░░▀████████████████▀ ░░░░░░▀▀▀████████▀▀▀

Code:

[table]
[tr]
[td]
[font=monospace][size=2pt][color=#000]
[color=transparent]░░░░░░[/color]▄▄▄████████▄▄▄
[color=transparent]░░░░[/color]▄████████████████▄
[color=transparent]░░[/color]▄████████████████████▄
[color=transparent]░[/color]████████████████████████
[color=transparent][/color]▐████████████████████████▌
[color=transparent][/color]██████████████████████████
[color=transparent][/color]██████████████████████████
[color=transparent][/color]██████████████████████████
[color=transparent][/color]▐████████████████████████▌
[color=transparent]░[/color]████████████████████████
[color=transparent]░░[/color]▀████████████████████▀
[color=transparent]░░░░[/color]▀████████████████▀
[color=transparent]░░░░░░[/color]▀▀▀████████▀▀▀
[/td]
[/tr]
[/table]

It's made with 'Monospace' font so it should looks the same on Linux, Android, Windows, iOS and OSX.



Lesson 10 will come I'm just really super busy with all the projects, orders and stuff
Lesson 10 is dedicated to 'Monospace' font, so let say the post above is a teaser



Best wishes.

[sir.humus]

Lesson 10 will come I'm just really super busy with all the projects, orders and stuff
Lesson 10 is dedicated to 'Monospace' font, so let say the post above is a teaser

Best wishes.

Can't wait for your next lesson...
I already tries to play with some of your examples and it's really cool.
I have a business idea, and when the day will come I hope to make a signature campaign, and design my own signature based on your lessons.

Thanks for your effort, we need more people like you in this forum.

[CHRISBIN702]

Great tutorial. Wish I'd known about this a month ago.
Wondering if you'd mind answering a question. I have made my signature that you can see below. I've just recently created a cool little character that I want to add either on the side/sides of the signature or right in the middle of the top line. (In between #1 and Bitcoin) How would I go about that? I'm self-taught and really racking my brain over this.

Here is the signature code for the one I'm using now.

Code:

[center][url=http://www.tinyurl.com/runcpaog][font=Arial Black][size=16pt]【[btc]〖[btc]【[btc]〖RunCPA #1 Bitcoin Affiliate Network〗[btc]】[btc]〗[btc]】[/size][/font][/url]
[color=#3333ff][size=2][font=Comic Sans MS]Tired of clicking faucets? Do you know how to use the internet? If you answered yes then you should be earning to your full potential with RunCPA[/font][/size][/color]

Which translates to:

【BTC〖BTC【BTC〖RunCPA #1 Bitcoin Affiliate Network〗BTC】BTC〗BTC】
Tired of clicking faucets? Do you know how to use the internet? If you answered yes then you should be earning to your full potential with RunCPA

Please, any advice would be greatly appreciated.

[roslinpl]

Great tutorial. Wish I'd known about this a month ago.
Wondering if you'd mind answering a question. I have made my signature that you can see below. I've just recently created a cool little character that I want to add either on the side/sides of the signature or right in the middle of the top line. (In between #1 and Bitcoin) How would I go about that? I'm self-taught and really racking my brain over this.

(...)

Please, any advice would be greatly appreciated.

Hello,

you won't be able to add a BBCode drawing in the middle of the top line because it will in same time split your bottom line.
Well it's kinda possible to do it but you will need to make it all in one [ td ]. All lines in one [ td ]. Kinda tricky but possible.


I'm here guys just for a second now to tell you that latest Chrome Browser update is pretty bad for BBCode artists xD ...

I sent report to Chrome Help Center ...
Look what they have done ! ██████████████████████████████████████████████████

If you are under Chrome  59.0.3071.86 you will notice: can you see the thin lines between each of █, all those lines are in different color since latest Chrome update xD eh ...

PS. Hmm..  it's pretty strange, I tried to downgrade Chrome but I still see those lines ... perhaps I would need to better clear up Chrome files. Eh.
PS2. Version 60.0.3112.50 (Official Build) beta (64-bit) doesn't fix the issue.

I hope they will fix that soon!

Best wishes.

[Batwingoz]

BB code is used to make signatures on this forum ?
I am interested in your content very much.

[yefi]

Great tuts man. Had no idea you could use transparent colour for fixing the table glitch. I'd been using non-breaking ASCII space (alt+255 or %A0), but that wasn't retained when editing posts.

[CHRISBIN702]

Great tuts man. Had no idea you could use transparent colour for fixing the table glitch. I'd been using non-breaking ASCII space (alt+255 or %A0), but that wasn't retained when editing posts.

This "table glitch"... Is it the reason that the face of my character is spaced out on some browsers and devices?

[roslinpl]

Lesson 10: "Advanced BBCode Drawing Techniques lvl.I"

I promised to say something more about drawing with 'Monospace' font.

The 'Monospace' seems to be the only font which will keep 'the same' character width, gap between two characters - so it basically will looks the 'same' under various operating systems.
(But surely not under all of them).

So even Mac users with older versions of Safari will see 'the same' drawing as let say latest Chrome Version. I added 'let say' because latest Chrome messed up a bit our designs
I posted about it few days ago.

Alright, so where's the catch?

So the only problem is that 'Monospace' drawings doesn't looks so solid as same drawing made with a default font.
But it has some important advantages.

It's not only that it will looks 'the same' under different browsers. But also! You can draw your designs with 1px, 1pt, 2px, 2pt and still it will looks the same under various browsers.
But! The same image created in different 'Monospace' font sizes will have different color saturation depending on the font size.

With the current versions of Chrome/Mozilla/Safari browsers I suggest using 2px Monospace font when drawing with BBCode.
As mentioned in lesson 10.

Example:

░░░░░░███ ░░░░█████ ░░░█████████ ░░░███████ ░░██████████ ░░███████████ ░███████████ ░░█████████ ░░░░██████ ░░░█████░░░░█ ░████████░░███ ██████████████ █████████████ ░██████████ ░░████████ ░░█████████░█ ░░███████████ ████████████ ██████░░░░█ ██ ░██ Size=2pt

░░░░░░███ ░░░░█████ ░░░█████████ ░░░███████ ░░██████████ ░░███████████ ░███████████ ░░█████████ ░░░░██████ ░░░█████░░░░█ ░████████░░███ ██████████████ █████████████ ░██████████ ░░████████ ░░█████████░█ ░░███████████ ████████████ ██████░░░░█ ██ ░██ Size=2px

░░░░░░███ ░░░░█████ ░░░█████████ ░░░███████ ░░██████████ ░░███████████ ░███████████ ░░█████████ ░░░░██████ ░░░█████░░░░█ ░████████░░███ ██████████████ █████████████ ░██████████ ░░████████ ░░█████████░█ ░░███████████ ████████████ ██████░░░░█ ██ ░██ Size=1pt

░░░░░░███ ░░░░█████ ░░░█████████ ░░░███████ ░░██████████ ░░███████████ ░███████████ ░░█████████ ░░░░██████ ░░░█████░░░░█ ░████████░░███ ██████████████ █████████████ ░██████████ ░░████████ ░░█████████░█ ░░███████████ ████████████ ██████░░░░█ ██ ░██ Size=1px

Code:

Code:

[table]
[tr]
[td]
[font=Monospace][size=2pt][color=#fe2f18][color=transparent]░░░░░░[/color]███
[color=transparent]░░░░[/color]█████
[color=transparent]░░░[/color]█████████
[color=transparent]░░░[/color][color=#ac5501]████[/color][color=#fd9359]█[/color][color=#ac5501]█[/color][color=#fd9359]█[/color]
[color=transparent]░░[/color][color=#ac5501]█[/color][color=#fd9359]██[/color][color=#ac5501]█[/color][color=#fd9359]██[/color][color=#ac5501]█[/color][color=#fd9359]███[/color]
[color=transparent]░░[/color][color=#ac5501]█[/color][color=#fd9359]██[/color][color=#ac5501]██[/color][color=#fd9359]██[/color][color=#ac5501]█[/color][color=#fd9359]███[/color]
[color=transparent]░[/color][color=#ac5501]██[/color][color=#fd9359]█████[/color][color=#ac5501]████[/color]
[color=transparent]░░[/color][color=#ac5501]██[/color][color=#fd9359]███████[/color]
[color=transparent]░░░░[/color][color=#fd9359]██████[/color]
[color=transparent]░░░[/color]█[color=#ac5501]████[/color][color=transparent]░░░░[/color][color=#fd9359]█[/color]
[color=transparent]░[/color][color=#ac5501]██[/color]█[color=#ac5501]█████[/color][color=transparent]░░[/color][color=#fd9359]███[/color]
[color=#fd9359]█[/color][color=#ac5501]██[/color]██[color=#ac5501]██████[/color][color=#fd9359]███[/color]
[color=#fd9359]██[/color][color=#ac5501]██[/color]█[color=#ac5501]███████[/color][color=#fd9359]█[/color]
[color=transparent]░[/color][color=#fd9359]█[/color]████[color=#ac5501]█████[/color]
[color=transparent]░░[/color]█████[color=#ac5501]██[/color]█
[color=transparent]░░[/color]█████████[color=transparent]░[/color][color=#ac5501]█[/color]
[color=transparent]░░[/color]█████████[color=#ac5501]██[/color]
[color=#ac5501]█[/color]█████████[color=#ac5501]██[/color]
[color=#ac5501]██[/color]████[color=transparent]░░░░[/color][color=#ac5501]█[/color]
[color=#ac5501]██[/color]
[color=transparent]░[/color][color=#ac5501]██[/color]
[center][size=10pt][b]Size=2pt[/b][/size][/center]
[/td]
[td]
[font=Monospace][size=2px][color=#fe2f18][color=transparent]░░░░░░[/color]███
[color=transparent]░░░░[/color]█████
[color=transparent]░░░[/color]█████████
[color=transparent]░░░[/color][color=#ac5501]████[/color][color=#fd9359]█[/color][color=#ac5501]█[/color][color=#fd9359]█[/color]
[color=transparent]░░[/color][color=#ac5501]█[/color][color=#fd9359]██[/color][color=#ac5501]█[/color][color=#fd9359]██[/color][color=#ac5501]█[/color][color=#fd9359]███[/color]
[color=transparent]░░[/color][color=#ac5501]█[/color][color=#fd9359]██[/color][color=#ac5501]██[/color][color=#fd9359]██[/color][color=#ac5501]█[/color][color=#fd9359]███[/color]
[color=transparent]░[/color][color=#ac5501]██[/color][color=#fd9359]█████[/color][color=#ac5501]████[/color]
[color=transparent]░░[/color][color=#ac5501]██[/color][color=#fd9359]███████[/color]
[color=transparent]░░░░[/color][color=#fd9359]██████[/color]
[color=transparent]░░░[/color]█[color=#ac5501]████[/color][color=transparent]░░░░[/color][color=#fd9359]█[/color]
[color=transparent]░[/color][color=#ac5501]██[/color]█[color=#ac5501]█████[/color][color=transparent]░░[/color][color=#fd9359]███[/color]
[color=#fd9359]█[/color][color=#ac5501]██[/color]██[color=#ac5501]██████[/color][color=#fd9359]███[/color]
[color=#fd9359]██[/color][color=#ac5501]██[/color]█[color=#ac5501]███████[/color][color=#fd9359]█[/color]
[color=transparent]░[/color][color=#fd9359]█[/color]████[color=#ac5501]█████[/color]
[color=transparent]░░[/color]█████[color=#ac5501]██[/color]█
[color=transparent]░░[/color]█████████[color=transparent]░[/color][color=#ac5501]█[/color]
[color=transparent]░░[/color]█████████[color=#ac5501]██[/color]
[color=#ac5501]█[/color]█████████[color=#ac5501]██[/color]
[color=#ac5501]██[/color]████[color=transparent]░░░░[/color][color=#ac5501]█[/color]
[color=#ac5501]██[/color]
[color=transparent]░[/color][color=#ac5501]██[/color]
[center][size=10pt][b]Size=2px[/b][/size][/center]
[/td]
[td]
[font=Monospace][size=1pt][color=#fe2f18][color=transparent]░░░░░░[/color]███
[color=transparent]░░░░[/color]█████
[color=transparent]░░░[/color]█████████
[color=transparent]░░░[/color][color=#ac5501]████[/color][color=#fd9359]█[/color][color=#ac5501]█[/color][color=#fd9359]█[/color]
[color=transparent]░░[/color][color=#ac5501]█[/color][color=#fd9359]██[/color][color=#ac5501]█[/color][color=#fd9359]██[/color][color=#ac5501]█[/color][color=#fd9359]███[/color]
[color=transparent]░░[/color][color=#ac5501]█[/color][color=#fd9359]██[/color][color=#ac5501]██[/color][color=#fd9359]██[/color][color=#ac5501]█[/color][color=#fd9359]███[/color]
[color=transparent]░[/color][color=#ac5501]██[/color][color=#fd9359]█████[/color][color=#ac5501]████[/color]
[color=transparent]░░[/color][color=#ac5501]██[/color][color=#fd9359]███████[/color]
[color=transparent]░░░░[/color][color=#fd9359]██████[/color]
[color=transparent]░░░[/color]█[color=#ac5501]████[/color][color=transparent]░░░░[/color][color=#fd9359]█[/color]
[color=transparent]░[/color][color=#ac5501]██[/color]█[color=#ac5501]█████[/color][color=transparent]░░[/color][color=#fd9359]███[/color]
[color=#fd9359]█[/color][color=#ac5501]██[/color]██[color=#ac5501]██████[/color][color=#fd9359]███[/color]
[color=#fd9359]██[/color][color=#ac5501]██[/color]█[color=#ac5501]███████[/color][color=#fd9359]█[/color]
[color=transparent]░[/color][color=#fd9359]█[/color]████[color=#ac5501]█████[/color]
[color=transparent]░░[/color]█████[color=#ac5501]██[/color]█
[color=transparent]░░[/color]█████████[color=transparent]░[/color][color=#ac5501]█[/color]
[color=transparent]░░[/color]█████████[color=#ac5501]██[/color]
[color=#ac5501]█[/color]█████████[color=#ac5501]██[/color]
[color=#ac5501]██[/color]████[color=transparent]░░░░[/color][color=#ac5501]█[/color]
[color=#ac5501]██[/color]
[color=transparent]░[/color][color=#ac5501]██[/color]
[center][size=10pt][b]Size=1pt[/b][/size][/center]
[/td]
[td]
[font=Monospace][size=1px][color=#fe2f18][color=transparent]░░░░░░[/color]███
[color=transparent]░░░░[/color]█████
[color=transparent]░░░[/color]█████████
[color=transparent]░░░[/color][color=#ac5501]████[/color][color=#fd9359]█[/color][color=#ac5501]█[/color][color=#fd9359]█[/color]
[color=transparent]░░[/color][color=#ac5501]█[/color][color=#fd9359]██[/color][color=#ac5501]█[/color][color=#fd9359]██[/color][color=#ac5501]█[/color][color=#fd9359]███[/color]
[color=transparent]░░[/color][color=#ac5501]█[/color][color=#fd9359]██[/color][color=#ac5501]██[/color][color=#fd9359]██[/color][color=#ac5501]█[/color][color=#fd9359]███[/color]
[color=transparent]░[/color][color=#ac5501]██[/color][color=#fd9359]█████[/color][color=#ac5501]████[/color]
[color=transparent]░░[/color][color=#ac5501]██[/color][color=#fd9359]███████[/color]
[color=transparent]░░░░[/color][color=#fd9359]██████[/color]
[color=transparent]░░░[/color]█[color=#ac5501]████[/color][color=transparent]░░░░[/color][color=#fd9359]█[/color]
[color=transparent]░[/color][color=#ac5501]██[/color]█[color=#ac5501]█████[/color][color=transparent]░░[/color][color=#fd9359]███[/color]
[color=#fd9359]█[/color][color=#ac5501]██[/color]██[color=#ac5501]██████[/color][color=#fd9359]███[/color]
[color=#fd9359]██[/color][color=#ac5501]██[/color]█[color=#ac5501]███████[/color][color=#fd9359]█[/color]
[color=transparent]░[/color][color=#fd9359]█[/color]████[color=#ac5501]█████[/color]
[color=transparent]░░[/color]█████[color=#ac5501]██[/color]█
[color=transparent]░░[/color]█████████[color=transparent]░[/color][color=#ac5501]█[/color]
[color=transparent]░░[/color]█████████[color=#ac5501]██[/color]
[color=#ac5501]█[/color]█████████[color=#ac5501]██[/color]
[color=#ac5501]██[/color]████[color=transparent]░░░░[/color][color=#ac5501]█[/color]
[color=#ac5501]██[/color]
[color=transparent]░[/color][color=#ac5501]██[/color]
[center][size=10pt][b]Size=1px[/b][/size][/center]
[/td]
[/tr]
[/table]

You can test it on your own, just open this page under different browsers to compare results.
Still - it's not 100% compatible with all browsers on different operating systems. But it's much better than default font compatibility.


Best regards.

Great tuts man. Had no idea you could use transparent colour for fixing the table glitch. I'd been using non-breaking ASCII space (alt+255 or %A0), but that wasn't retained when editing posts.

Thanks! And thanks for sharing another way of fixing the 'table glitch'.
It didn't occur to me until you told about it.

This "table glitch"... Is it the reason that the face of my character is spaced out on some browsers and devices?

it might be. Perhaps it is related to that table glitch.
Can you post that fragment of a code which seems to be glitched?
I will have a look at it if you want me to.

BB code is used to make signatures on this forum ?
I am interested in your content very much.

Yes, signatures here are made with BBCode.
Glad you like the content.

As always thanks to everyone who enjoy those tuts and learn from it.
It's truly my pleasure to continue with more tutorials.

Best wishes.

[CHRISBIN702]

This "table glitch"... Is it the reason that the face of my character is spaced out on some browsers and devices?

it might be. Perhaps it is related to that table glitch.
Can you post that fragment of a code which seems to be glitched?
I will have a look at it if you want me to.

That is the same one in my current Sig.

Code:

[table][tr][td][size=2pt][color=#0008ff]           ██                                    ██[/color]
[color=#0051ff]          ███                                ███[/color]
[color=#009aff]         ████▇▆▅▄▄▄▅▅▆▇▇███[/color]
[color=#00cdff]     ██████▄▀▀▀▀▀▀▀▀▀▀▀▀▀▀▄██[/color]
[color=#1de71e]    ████░░░░░░░░░░░░░░░░░░██           [/color]
[color=#00ff9a]  ████░░░░ [color=black]█[/color]░░░░░░░[color=black]█[/color]░░░░██[/color]
[color=#00ff35]  ████  ░░░░░░░░░░░░░░░░░██[/color]
[color=#1de71c] ████░░░░[color=blue]▇▆▆▅▄▃▂▁◢[/color]░  ██[/color]
[color=#39ce03] ████░░░░░░░░░[color=blue]▌   ▌[/color]░░░░░ ██   [/color]
[color=#1de71e] ███████▅▅▅▅▅▆▆▆▇▇███[/color]
[color=#00ff39]████████████████████████[/color]
[color=#00ad7b]████████████████████████[/color]
[color=#005abd]████████████████████████[/color]
[color=#0008ff]████████████████████████[/color]
[color=#0051ff] ████████████████████████[/color]
[color=#009aff]  ███████████████████████[/color]
[color=#00cdff]    ██████████████████████[/color]
[color=#00ffff]        ██                         ██[/color]
[color=#00ff9a]        ██                           ██[/color]
[color=#00ff35]        ██                              ██[/color]
[color=#1de71b]     ██                                   ██[/color]
[color=#39ce00] ███                                   ██[/color]
[color=#1de71c] █                                     ██[/color]
[color=#00ff38] █                                       ▀▀▀▀ [/color][/size][/td]

 This next one I will post below is the one I really like though. I haven't done any formatting yet. It's just drawn. I really like shape. It's accurate to the little guy.

Code:

[size=2pt]         ▄                                 ▄          
          ██▄                        ▄██            
          ████▆▅▄▂▁▂▂▄████         
        ███▀▀▀▀▀▀▀▀▀▀▀▀▀███          
       ███                              ▀█           
      ███         ⏺               ⏺    █         
     ███                                 █             
    ███        █▆▅▂▁▂▄█     █                
   ████                 ▌ ▌          █                      
  █████▇▆▅▄▂▁▁▂▄▅▆██                       
  █████████████████████               
  █████████████████████                 
  ▀███████████████████                
  ▀███████████████████                  
   ▀██████████████████                 
             ██                  ██                 
           ██                      ██               
     ███                       ███              
     █                         ██               
     █                         ▀▀▀▀▀  [/size]
[/quote]

WOW! That is not at all what it looks like between my code tags. It looks exactly like the 2pt size one below. I really need to start using te transparent letter trick right?

        ▄                                 ▄          
          ██▄                        ▄██            
          ████▆▅▄▂▁▂▂▄████        
        ███▀▀▀▀▀▀▀▀▀▀▀▀▀███          
       ███                              ▀█          
      ███         ⏺               ⏺    █        
     ███                                 █            
    ███        █▆▅▂▁▂▄█     █                
   ████                 ▌ ▌          █                      
  █████▇▆▅▄▂▁▁▂▄▅▆██                      
  █████████████████████              
  █████████████████████                
  ▀███████████████████                
  ▀███████████████████                  
   ▀██████████████████                
             ██                  ██                
           ██                      ██              
     ███                       ███              
     █                         ██              
     █                         ▀▀▀▀▀  
[/quote]

I forgot to thank you for taking the time to help me and for posting these tutorials too. I really appreciate it. I learned most of my BBcode by reverse engineering signature campaigns manager pages. Then I found your posts and my skill has been improving ever since.

[roslinpl]

This "table glitch"... Is it the reason that the face of my character is spaced out on some browsers and devices?

it might be. Perhaps it is related to that table glitch.
Can you post that fragment of a code which seems to be glitched?
I will have a look at it if you want me to.

That is the same one in my current Sig.

(...)

I forgot to thank you for taking the time to help me and for posting these tutorials too. I really appreciate it. I learned most of my BBcode by reverse engineering signature campaigns manager pages. Then I found your posts and my skill has been improving ever since.

Hey,

Yes, I'm pretty sure it has to be related with a table glitch.

Using transparent characters inside of the image instead of just a whitespace is much more compatible and can get better results.
The only problem is that it takes more characters to make it.


Best wishes.

[CryptoWorld87]

I want to learn also this kind of job i want extra money i hope i can learn this in the future i dont go to college because we dont have enough money to sustain the tuition fee its hard for me to understand how to do this but maybe if i try hope i can do this so i can earn extra money thank you so much for this oppurtunity so i can learn this a lot in computer editing

[CHRISBIN702]

I want to learn also this kind of job i want extra money i hope i can learn this in the future i dont go to college because we dont have enough money to sustain the tuition fee its hard for me to understand how to do this but maybe if i try hope i can do this so i can earn extra money thank you so much for this oppurtunity so i can learn this a lot in computer editing

You can do this. Start this tutorial at pg.1 Try to do all roslinpl's examples and you'll get the hang of it. Then check out the different available signatures in the signature campaigns thread. Don't give up and don't be afraid to fail. If you're not failing at things then your not trying.

[Adbitco]

Thanks for teaching us something really useful. I guess being acquainted with html or xhtml makes it easier to learn bbcoding faster, correct?