Ｄｉｇｉｔａｌｌｙ Ｄｉｓｔｉｎｃｔ: Signature Tutorial Thread

[storm coming.]

see my ugly disgusting signature guys? he he, could someone possibly help me with it? i suck at coding and y'all are masters at it. if no one wants to, that's fine but i will put the link to your profile in it as "sig help" thanks for taking the time to read this guys and i hope to have an amazing signature someday… if no one wants to help it's absolutely fine. c:

EDIT: found someone! <3

[rocoboq]

Hello! I've recently taken it upon myself to learn some BBCode and how to make some basic signatures and such for myself, and decided after joining a new fandom, why shouldn't I make a siggy for it? xD I know, I'm weird. Well, here's the code:

Code: Select all

[left][img]http://i.imgur.com/od4gG4r.png[/img][/left][center][color=transparent]x
x
x
x
x
x
x[/color][img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjQwLjAwMDAwMC5RMkZ5Y25rZ1QyNGdUWGtnVjJGNWQyRnlaQ0JUYjI0LC4wAAAA/reenie-beanie.regular.png[/img]
◤[color=transparent]xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx[/color]◥
[b]Ｔｈｅｒｅ＇ｌｌ Ｂｅ Ｐｅａｃｅ Ｗｈｅｎ Ｙｏｕ Ａｒｅ Ｄｏｎｅ
Ｌａｙ Ｙｏｕｒ Ｗｅａｒｙ Ｈｅａｄ Ｔｏ Ｒｅｓｔ[/b]
◣[color=transparent]xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx[/color]◢
[img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjQwLjAwMDAwMC5SRzl1SjNRZ1dXOTFJRU55ZVNCT2J5Qk5iM0psLjAAAAAA/reenie-beanie.regular.png[/img][color=transparent]x
x
x
x
x
x
x[/color][/center][right][img]http://i.imgur.com/109DDpB.png[/img][/right]

I've tried different things, but I can't get the last image (The one of Dean) to go where it's supposed to be, which is right next to the rest of the text. I don't know if all together it's too wide, or what. I can easily fix that if so, but it'd be cool if someone could tell me what I did wrong, how it affected everything, and how to fix it. Thanks! <3

[Windy0cloud]

You´ll need to make the middle stuff smaller. Also, if you want everything hugged together, just only use left code.

[rocoboq]

Thank you! I messed with it a bit and came up with this:

Code: Select all

[left][img]http://i.imgur.com/gM98TWb.png[/img][/left][left][center][color=transparent]x
x
x
x[/color][img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjM2LjAwMDAwMC5RMkZ5Y25rZ1QyNGdUWGtnVjJGNWQyRnlaQ0JUYjI0LC4wAAAA/reenie-beanie.regular.png[/img]
[size=100]◤[color=transparent]xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx[/color]◥
Ｔｈｅｒｅ＇ｌｌ Ｂｅ Ｐｅａｃｅ Ｗｈｅｎ Ｙｏｕ Ａｒｅ Ｄｏｎｅ
Ｌａｙ Ｙｏｕｒ Ｗｅａｒｙ Ｈｅａｄ Ｔｏ Ｒｅｓｔ
◣[color=transparent]xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx[/color]◢[/size]
[img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjM2LjAwMDAwMC5SRzl1SjNRZ1dXOTFJRU55ZVNCT2J5Qk5iM0psLjAA/reenie-beanie.regular.png[/img][/center][/left][left][img]http://i.imgur.com/Pa3HkfS.png[/img][/left]

x
x
x
x
◤xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx◥
Ｔｈｅｒｅ＇ｌｌ Ｂｅ Ｐｅａｃｅ Ｗｈｅｎ Ｙｏｕ Ａｒｅ Ｄｏｎｅ
Ｌａｙ Ｙｏｕｒ Ｗｅａｒｙ Ｈｅａｄ Ｔｏ Ｒｅｓｔ
◣xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx◢

There's definitely a few thing's I'd probably wanna change (Maybe a small text box somewhere, but I'm cool without.), but I'm very happy with it. I'll probably use it sometime when I make an avatar for it, and add some link slots... xD Thanks again! (It looks a little different as an actual signature, and not a copy-and-paste.)

[Antipathy]

Code: Select all

[left][center][img]http://sig.grumpybumpers.com/host/MonkeySee.gif[/img][/center][/left][right][center][img]http://i.imgur.com/UXyEOsh.png[/img][/center]
[center][img]http://i60.tinypic.com/208wtmv.png[/img]
[img]http://i.imgur.com/CPiVj7e.gif[/img][img]http://i.imgur.com/Zjxsofe.gif[/img][img]http://i.imgur.com/o3Sf9nl.gif[/img]
[img]http://i.imgur.com/FYJEpyF.png[/img][color=transparent]xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx[/color][img]http://i.imgur.com/omVxGPK.png[/img][/center][/right]

This is my siganture so far (as you can see below), and I want to put text in between the grey bars, but I'm not sure how. Could someone help me out?

[mint.]

There's definitely a few thing's I'd probably wanna change (Maybe a small text box somewhere, but I'm cool without.), but I'm very happy with it. I'll probably use it sometime when I make an avatar for it, and add some link slots... xD Thanks again! (It looks a little different as an actual signature, and not a copy-and-paste.)

sorry for late response, glad you fixed it! in the future, if you want a parallel [ left ] and [ right ] object, place them beside each other. never place it as
[ left ] TEXT TEXT [/ left ] [ center ] blah[/ center ] [ right ] hello [/ right ]

instead, do:

[ left ] TEXT TEXT [/ left ] [ right ] hello [/ right ] [ center ] blah [/ center ]

this is so that the browser reads it as (imagine this is the browser talking okay)
" okay, so TEXT TEXT goes on the left side, hello on the right, and I'll fit as much as I can of blah centered in the middle. "

instead of:
" okay, so TEXT TEXT goes on the left side, blah centered in the middle, and I'll insert a line break because hello can't fit on the same line."

your code fixed:

Code: Select all

[right][img]http://i.imgur.com/109DDpB.png[/img][/right][left][img]http://i.imgur.com/od4gG4r.png[/img][/left][center][color=transparent]x
x
x
x
x
x
x[/color][img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjQwLjAwMDAwMC5RMkZ5Y25rZ1QyNGdUWGtnVjJGNWQyRnlaQ0JUYjI0LC4wAAAA/reenie-beanie.regular.png[/img]
◤[color=transparent]xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx[/color]◥
[b]Ｔｈｅｒｅ＇ｌｌ Ｂｅ Ｐｅａｃｅ Ｗｈｅｎ Ｙｏｕ Ａｒｅ Ｄｏｎｅ
Ｌａｙ Ｙｏｕｒ Ｗｅａｒｙ Ｈｅａｄ Ｔｏ Ｒｅｓｔ[/b]
◣[color=transparent]xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx[/color]◢
[img]http://txt-dynamic.static.1001fonts.net/txt/dHRmLjQwLjAwMDAwMC5SRzl1SjNRZ1dXOTFJRU55ZVNCT2J5Qk5iM0psLjAAAAAA/reenie-beanie.regular.png[/img][color=transparent]x
x
x
x
x
x
x[/color][/center]

------------------------------------------------------------------------------------------------------------------------------------

This is my siganture so far (as you can see below), and I want to put text in between the grey bars, but I'm not sure how. Could someone help me out?

What you want to achieve is definitely not that simple to explain. You needed to use the right-right and right-left attributes to tell the browser to make columns within columns. you can now replace the "text text" with what you need, HOWEVER, you must make appropriate line breaks or else the text will cut of the next set of grey bars.

Code: Select all

[left][center][img]http://sig.grumpybumpers.com/host/MonkeySee.gif[/img][/center][/left][right][center][img]http://i.imgur.com/UXyEOsh.png[/img][/center]
[center][img]http://i60.tinypic.com/208wtmv.png[/img]
[img]http://i.imgur.com/CPiVj7e.gif[/img][img]http://i.imgur.com/Zjxsofe.gif[/img][img]http://i.imgur.com/o3Sf9nl.gif[/img]
[left][img]http://i.imgur.com/FYJEpyF.png[/img][/left][left]text text text text text text text text[/left][img]http://i.imgur.com/omVxGPK.png[/img][/center][/right]

[oliver,]

Could somebody help me? I need that ice line to come up, and one after all the text, and the gif won't come up. I'd be very grateful if someone helped me.

Code: Select all

[left][img]http://oi60.tinypic.com/1sm8go.jpg[/img][/left][left][img]http://i59.tinypic.com/2qite9g.jpg[/img]
[img]http://i61.tinypic.com/xqgk92.jpg[/img]
[img]http://i58.tinypic.com/vzzipe.jpg[/img][/left]
[left][img]http://i57.tinypic.com/30bgz2q.jpg[/img][/left][left][img]http://txt-dynamic.static.1001fonts.net/txt/b3RmLjI0LjFjMDBhMy5WMlVnUVhKbElGUm9aUSwsLjIA/sablon-up.regular.png[/img][/left]

[left][color=#800000]╔══════════╗
 Text text text
text text text
╚══════════╝[/color][/left]




[left][img]http://txt-dynamic.static.1001fonts.net/txt/b3RmLjI0LjFjMDBhMy5WMkZ5Y21sdmNuTWdWMmh2LjIA/sablon-up.regular.png[/img][/left]


[left][color=#800000]╔══════════╗
 Text text text
text text text
╚══════════╝[/color][/left]




[left][img]http://txt-dynamic.static.1001fonts.net/txt/b3RmLjIyLjFjMDBhMy5RblZwYkhRZ1ZHaHBjeUJVYjNkdS4yAAAA/sablon-up.regular.png[/img][/left][right][img]http://oi58.tinypic.com/16baa6x.jpg[/img][/right]

[kristenn11]

@MoonlitRaven Is this what you wanted? I coded everything to the left and centered the text.



Code: Select all

[left][img]http://oi60.tinypic.com/1sm8go.jpg[/img][/left][left][img]http://i59.tinypic.com/2qite9g.jpg[/img]
[img]http://i61.tinypic.com/xqgk92.jpg[/img]
[img]http://i58.tinypic.com/vzzipe.jpg[/img][/left]
[left][img]http://i57.tinypic.com/30bgz2q.jpg[/img][/left][left][center][img]http://txt-dynamic.static.1001fonts.net/txt/b3RmLjI0LjFjMDBhMy5WMlVnUVhKbElGUm9aUSwsLjIA/sablon-up.regular.png[/img]

[color=#800000]╔══════════╗
 Text text text
text text text
╚══════════╝[/color]




[img]http://txt-dynamic.static.1001fonts.net/txt/b3RmLjI0LjFjMDBhMy5WMkZ5Y21sdmNuTWdWMmh2LjIA/sablon-up.regular.png[/img]


[color=#800000]╔══════════╗
 Text text text
text text text
╚══════════╝[/color]




[img]http://txt-dynamic.static.1001fonts.net/txt/b3RmLjIyLjFjMDBhMy5RblZwYkhRZ1ZHaHBjeUJVYjNkdS4yAAAA/sablon-up.regular.png[/img][/center][/left][left][img]http://oi58.tinypic.com/16baa6x.jpg[/img][/left]

[Antipathy]

-snip-

This is my siganture so far (as you can see below), and I want to put text in between the grey bars, but I'm not sure how. Could someone help me out?

What you want to achieve is definitely not that simple to explain. You needed to use the right-right and right-left attributes to tell the browser to make columns within columns. you can now replace the "text text" with what you need, HOWEVER, you must make appropriate line breaks or else the text will cut of the next set of grey bars.

Code: Select all

[left][center][img]http://sig.grumpybumpers.com/host/MonkeySee.gif[/img][/center][/left][right][center][img]http://i.imgur.com/UXyEOsh.png[/img][/center]
[center][img]http://i60.tinypic.com/208wtmv.png[/img]
[img]http://i.imgur.com/CPiVj7e.gif[/img][img]http://i.imgur.com/Zjxsofe.gif[/img][img]http://i.imgur.com/o3Sf9nl.gif[/img]
[left][img]http://i.imgur.com/FYJEpyF.png[/img][/left][left]text text text text text text text text[/left][img]http://i.imgur.com/omVxGPK.png[/img][/center][/right]

[/quote]
Thanks!

[Nightsent]

Code: Select all

[left][img]http://oi60.tinypic.com/1sm8go.jpg[/img][/left][left][img]http://i59.tinypic.com/2qite9g.jpg[/img]
[img]http://i61.tinypic.com/xqgk92.jpg[/img][img]http://i58.tinypic.com/vzzipe.jpg[/img][/left][left][img]http://i57.tinypic.com/30bgz2q.jpg[/img][/left][left][center][img]http://txt-dynamic.static.1001fonts.net/txt/b3RmLjI0LjFjMDBhMy5WMlVnUVhKbElGUm9aUSwsLjIA/sablon-up.regular.png[/img]

[color=#800000]╔══════════╗
 Text text text
text text text
╚══════════╝[/color]



[img]http://txt-dynamic.static.1001fonts.net/txt/b3RmLjI0LjFjMDBhMy5WMkZ5Y21sdmNuTWdWMmh2LjIA/sablon-up.regular.png[/img]



[color=#800000]╔══════════╗
 Text text text
text text text
╚══════════╝[/color]



[img]http://txt-dynamic.static.1001fonts.net/txt/b3RmLjIyLjFjMDBhMy5RblZwYkhRZ1ZHaHBjeUJVYjNkdS4yAAAA/sablon-up.regular.png[/img][/center][/left][left][img]http://oi58.tinypic.com/16baa6x.jpg[/img][/left]

@MoonlitRaven - is that how you wanted it??? If so, I put everything to left and deleted some of the spaces between images. I also centered the text for you.