Ｄｉｇｉｔａｌｌｙ Ｄｉｓｔｉｎｃｔ: BBCoding Tutorial/Help Thread

[royalty.]

Code: Select all

[right][img]https://66.media.tumblr.com/8a90a7fe6c1889d918d250b70634ae46/tumblr_ngmr1x1CHa1rfd7lko1_400.gif[/img][/right]
[left][img]http://i.imgur.com/lLvsmDH.png?1[/img][/left]
━━━━━━━━━━━━━━
[size=85][color=transparent]---[/color][color=#400040]ＸＥＮＡ － ＴＨＥ ＳＨＡＤＯＷ[/color]
words go here alright? okay good talk
words go here alright? okay good talk
words go here alright? okay good talk
words go here alright? okay good talk
words go here alright? okay good talk
words go here alright? okay good talk
words go here alright? okay good talk[/size]
━━━━━━━━━━━━━━

[left][img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjExNi4zNzFlNGQuVTA5TlJRLCwuMAAA/im-fell-english.roman.png[/img]
[img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjg4LjM3MWU0ZC5WRWhKVGtkVC4wAAAAAAAA/im-fell-dw-pica.roman.png[/img][size=200][color=#400040]

ＣＡＮ ＯＮＬＹ ＢＥ
[i]ＳＥＥＮ！[/i][i]ＳＥＥＮ！[/i][/color][/size][/left]
[left][size=155]┌────────────────────────┐[/size]
[right][size=150]│
│
│
│
│
│
│
│
│[/size][/right][right][size=75][center]this is a pretty large box okay? but the thing is don't go past here xxxxxxx
this is a pretty large box okay? but the thing is don't go past here xxxxxxx
this is a pretty large box okay? but the thing is don't go past here xxxxxxx
this is a pretty large box okay? but the thing is don't go past here xxxxxxx
this is a pretty large box okay? but the thing is don't go past here xxxxxxx
this is a pretty large box okay? but the thing is don't go past here xxxxxxx
this is a pretty large box okay? but the thing is don't go past here xxxxxxx
this is a pretty large box okay? but the thing is don't go past here xxxxxxx
this is a pretty large box okay? but the thing is don't go past here xxxxxxx
this is a pretty large box okay? but the thing is don't go past here xxxxxxx
this is a pretty large box okay? but the thing is don't go past here xxxxxxx
this is a pretty large box okay? but the thing is don't go past here xxxxxxx
this is a pretty large box okay? but the thing is don't go past here xxxxxxx
this is a pretty large box okay? but the thing is don't go past here xxxxxxx
this is a pretty large box okay? but the thing is don't go past here xxxxxxx
this is a pretty large box okay? but the thing is don't go past here xxxxxxx
this is a pretty large box okay? but the thing is don't go past here xxxxxxx
this is a pretty large box okay? but the thing is don't go past here xxxxxxx[/center][/size][/right][size=150]│
│
│
│
│
│
│
│
│[/size]
[size=155]└────────────────────────┘[/size][/left]

If you copy this and look in the preview, it has a completely dfifferent layout. when i post it, however, it glitches up and doesn't give me my wanted look [ which is the preview ]. Any help?

[Keir;]

@royalty.
The preview box is larger than the post box, so your problem is most likely that you have made it too wide. It looks fine in preview since you have more space, but when you post the space is smaller, making it unable to fit. Try making some lines shorter or cropping the pictures some.

[Hidori Blaith]

I cannot tell you how happy I am that I found this thread, thank you so much!

I have come across a little problem while coding my brand new signature, and I would like for someone to help me recode it.
So, I am trying to line this gif up underneath the big W, but it is just refusing to go all the way to the left underneath it. Could someone help me, please? This is a preview of what's happening:


And here is the code if anyone is willing to fix it!

Code: Select all

[left][size=150][color=#779399]█[/color]
[color=#7a969c]█[/color]
[color=#7d999f]█[/color]
[color=#809ca2]█[/color]
[color=#839fa5]█[/color]
[color=#86a2a8]█[/color]
[color=#89a5ab]█[/color]
[color=#8ca8ae]█[/color]
[color=#8eabb2]█[/color]
[color=#91aeb5]█[/color]
[color=#94b1b8]█[/color]
[color=#97b4bb]█[/color]
[color=#9ab7be]█[/color]
[color=#9dbac1]█[/color]
[color=#a0bdc4]█[/color]
[color=#a3c0c7]█[/color][/size][/left][left][img]http://i.imgur.com/69ZjdX4.png[/img][/left][left][size=150][color=#779399]█[/color]
[color=#7a969c]█[/color]
[color=#7d999f]█[/color]
[color=#809ca2]█[/color]
[color=#839fa5]█[/color]
[color=#86a2a8]█[/color]
[color=#89a5ab]█[/color]
[color=#8ca8ae]█[/color]
[color=#8eabb2]█[/color]
[color=#91aeb5]█[/color]
[color=#94b1b8]█[/color]
[color=#97b4bb]█[/color]
[color=#9ab7be]█[/color]
[color=#9dbac1]█[/color]
[color=#a0bdc4]█[/color]
[color=#a3c0c7]█[/color][/size][/left][left][img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjgwLmEzYzFjOC5WdywsLjAAAAAAAAAAAAAAAAAA/tendrils.personaluse.png[/img][/left][left][img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjQ0LmEzYzFjOC5TRWxVUlNCSlV5QkRUMHhFLjAAAAAAAAAAAAAAAAAA/tendrils.personaluse.png[/img]
▬▬▬▬▬(ＡＮＤ ＡＬＷＡＹＳ ＹＥＡＲＮＩＮＧ)▬▬▬▬[/left]


[left][img]http://i.imgur.com/KWbs7CZ.gif[/img][/left]
[left][size=150][color=#779399]█[/color]
[color=#7a969c]█[/color]
[color=#7d999f]█[/color]
[color=#809ca2]█[/color]
[color=#839fa5]█[/color]
[color=#86a2a8]█[/color]
[color=#89a5ab]█[/color]
[color=#8ca8ae]█[/color]
[color=#8eabb2]█[/color]
[color=#91aeb5]█[/color]
[color=#94b1b8]█[/color]
[color=#97b4bb]█[/color]
[color=#9ab7be]█[/color]
[color=#9dbac1]█[/color]
[color=#a0bdc4]█[/color]
[color=#a3c0c7]█[/color][/size][/left]

[Hidori Blaith]

I cannot tell you how happy I am that I found this thread, thank you so much!

I have come across a little problem while coding my brand new signature, and I would like for someone to help me recode it.
So, I am trying to line this gif up underneath the big W, but it is just refusing to go all the way to the left underneath it. Could someone help me, please? Thisis a preview of what's happening:


And here is the code if anyone is willing to fix it!

Code: Select all

[left][size=150][color=#779399]█[/color]
[color=#7a969c]█[/color]
[color=#7d999f]█[/color]
[color=#809ca2]█[/color]
[color=#839fa5]█[/color]
[color=#86a2a8]█[/color]
[color=#89a5ab]█[/color]
[color=#8ca8ae]█[/color]
[color=#8eabb2]█[/color]
[color=#91aeb5]█[/color]
[color=#94b1b8]█[/color]
[color=#97b4bb]█[/color]
[color=#9ab7be]█[/color]
[color=#9dbac1]█[/color]
[color=#a0bdc4]█[/color]
[color=#a3c0c7]█[/color][/size][/left][left][img]http://i.imgur.com/69ZjdX4.png[/img][/left][left][size=150][color=#779399]█[/color]
[color=#7a969c]█[/color]
[color=#7d999f]█[/color]
[color=#809ca2]█[/color]
[color=#839fa5]█[/color]
[color=#86a2a8]█[/color]
[color=#89a5ab]█[/color]
[color=#8ca8ae]█[/color]
[color=#8eabb2]█[/color]
[color=#91aeb5]█[/color]
[color=#94b1b8]█[/color]
[color=#97b4bb]█[/color]
[color=#9ab7be]█[/color]
[color=#9dbac1]█[/color]
[color=#a0bdc4]█[/color]
[color=#a3c0c7]█[/color][/size][/left][left][img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjgwLmEzYzFjOC5WdywsLjAAAAAAAAAAAAAAAAAA/tendrils.personaluse.png[/img][/left][left][img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjQ0LmEzYzFjOC5TRWxVUlNCSlV5QkRUMHhFLjAAAAAAAAAAAAAAAAAA/tendrils.personaluse.png[/img]
▬▬▬▬▬(ＡＮＤ ＡＬＷＡＹＳ ＹＥＡＲＮＩＮＧ)▬▬▬▬[/left]


[left][img]http://i.imgur.com/KWbs7CZ.gif[/img][/left]
[left][size=150][color=#779399]█[/color]
[color=#7a969c]█[/color]
[color=#7d999f]█[/color]
[color=#809ca2]█[/color]
[color=#839fa5]█[/color]
[color=#86a2a8]█[/color]
[color=#89a5ab]█[/color]
[color=#8ca8ae]█[/color]
[color=#8eabb2]█[/color]
[color=#91aeb5]█[/color]
[color=#94b1b8]█[/color]
[color=#97b4bb]█[/color]
[color=#9ab7be]█[/color]
[color=#9dbac1]█[/color]
[color=#a0bdc4]█[/color]
[color=#a3c0c7]█[/color][/size][/left]

[pupzee]

@hidori blaith

hopefully this is what you wanted c: you just had to put more lines before the gif (2 to be exact)
wasn't sure if the right border is supposed to hug the gif or not, so I just left it hugging!

Code: Select all

[left][size=150][color=#779399]█[/color]
[color=#7a969c]█[/color]
[color=#7d999f]█[/color]
[color=#809ca2]█[/color]
[color=#839fa5]█[/color]
[color=#86a2a8]█[/color]
[color=#89a5ab]█[/color]
[color=#8ca8ae]█[/color]
[color=#8eabb2]█[/color]
[color=#91aeb5]█[/color]
[color=#94b1b8]█[/color]
[color=#97b4bb]█[/color]
[color=#9ab7be]█[/color]
[color=#9dbac1]█[/color]
[color=#a0bdc4]█[/color]
[color=#a3c0c7]█[/color][/size][/left][left][img]http://i.imgur.com/69ZjdX4.png[/img][/left][left][size=150][color=#779399]█[/color]
[color=#7a969c]█[/color]
[color=#7d999f]█[/color]
[color=#809ca2]█[/color]
[color=#839fa5]█[/color]
[color=#86a2a8]█[/color]
[color=#89a5ab]█[/color]
[color=#8ca8ae]█[/color]
[color=#8eabb2]█[/color]
[color=#91aeb5]█[/color]
[color=#94b1b8]█[/color]
[color=#97b4bb]█[/color]
[color=#9ab7be]█[/color]
[color=#9dbac1]█[/color]
[color=#a0bdc4]█[/color]
[color=#a3c0c7]█[/color][/size][/left][left][img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjgwLmEzYzFjOC5WdywsLjAAAAAAAAAAAAAAAAAA/tendrils.personaluse.png[/img][/left][left][img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjQ0LmEzYzFjOC5TRWxVUlNCSlV5QkRUMHhFLjAAAAAAAAAAAAAAAAAA/tendrils.personaluse.png[/img]
▬▬▬▬▬(ＡＮＤ ＡＬＷＡＹＳ ＹＥＡＲＮＩＮＧ)▬▬▬▬[/left]




[left][img]http://i.imgur.com/KWbs7CZ.gif[/img][/left][left][size=150][color=#779399]█[/color]
[color=#7a969c]█[/color]
[color=#7d999f]█[/color]
[color=#809ca2]█[/color]
[color=#839fa5]█[/color]
[color=#86a2a8]█[/color]
[color=#89a5ab]█[/color]
[color=#8ca8ae]█[/color]
[color=#8eabb2]█[/color]
[color=#91aeb5]█[/color]
[color=#94b1b8]█[/color]
[color=#97b4bb]█[/color]
[color=#9ab7be]█[/color]
[color=#9dbac1]█[/color]
[color=#a0bdc4]█[/color]
[color=#a3c0c7]█[/color][/size][/left]

[Hidori Blaith]

Thank you so much, pupzee! That's exactly what I wanted and needed

Edit; I have another problem. The border on the far right isn't going all the way up. I've tried changing the sizes of the fonts and I'm not sure what it is.

Code: Select all

[left][size=150][color=#779399]█[/color]
[color=#7a969c]█[/color]
[color=#7d999f]█[/color]
[color=#809ca2]█[/color]
[color=#839fa5]█[/color]
[color=#86a2a8]█[/color]
[color=#89a5ab]█[/color]
[color=#8ca8ae]█[/color]
[color=#8eabb2]█[/color]
[color=#91aeb5]█[/color]
[color=#94b1b8]█[/color]
[color=#97b4bb]█[/color]
[color=#9ab7be]█[/color]
[color=#9dbac1]█[/color]
[color=#a0bdc4]█[/color]
[color=#a3c0c7]█[/color][/size][/left][left][img]http://i.imgur.com/69ZjdX4.png[/img][/left][left][size=150][color=#779399]█[/color]
[color=#7a969c]█[/color]
[color=#7d999f]█[/color]
[color=#809ca2]█[/color]
[color=#839fa5]█[/color]
[color=#86a2a8]█[/color]
[color=#89a5ab]█[/color]
[color=#8ca8ae]█[/color]
[color=#8eabb2]█[/color]
[color=#91aeb5]█[/color]
[color=#94b1b8]█[/color]
[color=#97b4bb]█[/color]
[color=#9ab7be]█[/color]
[color=#9dbac1]█[/color]
[color=#a0bdc4]█[/color]
[color=#a3c0c7]█[/color][/size][/left][left][img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjgwLmEzYzFjOC5WdywsLjAAAAAAAAAAAAAAAAAA/tendrils.personaluse.png[/img][/left][left][img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjQ0LmEzYzFjOC5TRWxVUlNCSlV5QkRUMHhFLjAAAAAAAAAAAAAAAAAA/tendrils.personaluse.png[/img]
▬▬▬▬([size=110][b]ＡＮＤ ＡＬＷＡＹＳ ＹＥＡＲＮＩＮＧ[/b][/size])▬▬▬[/left]




[left][img]http://i.imgur.com/KWbs7CZ.gif[/img][/left][right][size=150][color=#779399]█[/color]
[color=#7a969c]█[/color]
[color=#7d999f]█[/color]
[color=#809ca2]█[/color]
[color=#839fa5]█[/color]
[color=#86a2a8]█[/color]
[color=#89a5ab]█[/color]
[color=#8ca8ae]█[/color]
[color=#8eabb2]█[/color]
[color=#91aeb5]█[/color]
[color=#94b1b8]█[/color]
[color=#97b4bb]█[/color]
[color=#9ab7be]█[/color]
[color=#9dbac1]█[/color]
[color=#a0bdc4]█[/color]
[color=#a3c0c7]█[/color][/size][/right]

[mucrospirifer .]

@hidori blaith
easiest solution is to move the [right] tag to the beginning of the code, before the [left]s.
usually when using multiple alignment tags, the order is [right], [left], then [center] (if you were to use [center])



Code: Select all

[right][size=150][color=#779399]█[/color]
[color=#7a969c]█[/color]
[color=#7d999f]█[/color]
[color=#809ca2]█[/color]
[color=#839fa5]█[/color]
[color=#86a2a8]█[/color]
[color=#89a5ab]█[/color]
[color=#8ca8ae]█[/color]
[color=#8eabb2]█[/color]
[color=#91aeb5]█[/color]
[color=#94b1b8]█[/color]
[color=#97b4bb]█[/color]
[color=#9ab7be]█[/color]
[color=#9dbac1]█[/color]
[color=#a0bdc4]█[/color]
[color=#a3c0c7]█[/color][/size][/right][left][size=150][color=#779399]█[/color]
[color=#7a969c]█[/color]
[color=#7d999f]█[/color]
[color=#809ca2]█[/color]
[color=#839fa5]█[/color]
[color=#86a2a8]█[/color]
[color=#89a5ab]█[/color]
[color=#8ca8ae]█[/color]
[color=#8eabb2]█[/color]
[color=#91aeb5]█[/color]
[color=#94b1b8]█[/color]
[color=#97b4bb]█[/color]
[color=#9ab7be]█[/color]
[color=#9dbac1]█[/color]
[color=#a0bdc4]█[/color]
[color=#a3c0c7]█[/color][/size][/left][left][img]http://i.imgur.com/69ZjdX4.png[/img][/left][left][size=150][color=#779399]█[/color]
[color=#7a969c]█[/color]
[color=#7d999f]█[/color]
[color=#809ca2]█[/color]
[color=#839fa5]█[/color]
[color=#86a2a8]█[/color]
[color=#89a5ab]█[/color]
[color=#8ca8ae]█[/color]
[color=#8eabb2]█[/color]
[color=#91aeb5]█[/color]
[color=#94b1b8]█[/color]
[color=#97b4bb]█[/color]
[color=#9ab7be]█[/color]
[color=#9dbac1]█[/color]
[color=#a0bdc4]█[/color]
[color=#a3c0c7]█[/color][/size][/left][left][img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjgwLmEzYzFjOC5WdywsLjAAAAAAAAAAAAAAAAAA/tendrils.personaluse.png[/img][/left][left][img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjQ0LmEzYzFjOC5TRWxVUlNCSlV5QkRUMHhFLjAAAAAAAAAAAAAAAAAA/tendrils.personaluse.png[/img]
▬▬▬▬([size=110][b]ＡＮＤ ＡＬＷＡＹＳ ＹＥＡＲＮＩＮＧ[/b][/size])▬▬▬[/left]




[left][img]http://i.imgur.com/KWbs7CZ.gif[/img][/left]

[quiixxy]

Excuse me but I'm Doing a signature and every time I put stuff on the left [/left] it works but then I Put stuff in the center and right and I messed the whole thing up. Can anyone give me advice on this?

Code: Select all

[left][img]http://fontmeme.com/permalink/170520/5786099a98721c95528c3b9c5857611e.png[/img][/left][center][img]http://fontmeme.com/permalink/170520/3f44d52dd0a12286792f2d5471b5b841.png[/img][/center][left][img]http://www.auplod.com/u/upoadl9762c.gif[/img][/left][center][img]http://www.auplod.com/u/dolpua9762d.gif[/img][/center]

[caesou]

@j.moriarty, is this what you want?



Code: Select all

[left][img]http://fontmeme.com/permalink/170520/5786099a98721c95528c3b9c5857611e.png[/img]
[img]http://www.auplod.com/u/upoadl9762c.gif[/img][/left][center][img]http://fontmeme.com/permalink/170520/3f44d52dd0a12286792f2d5471b5b841.png[/img]
[img]http://www.auplod.com/u/dolpua9762d.gif[/img][/center]


i rearranged the code so the text and images would be seperate "columns", instead of seperate lines, if that makes sense.





Code: Select all

[left][img]http://fontmeme.com/permalink/170520/5786099a98721c95528c3b9c5857611e.png[/img]
[img]http://www.auplod.com/u/upoadl9762c.gif[/img][/left][left][img]http://fontmeme.com/permalink/170520/3f44d52dd0a12286792f2d5471b5b841.png[/img]
[img]http://www.auplod.com/u/dolpua9762d.gif[/img][/left]


also this would be a bit more preferable in a technical manner (as there are two left columns "hugging" to the side instead of seperate left and center columns) but it's up to you which to choose.

[quiixxy]

@caesou Thank you c: