User blog:Princess Callie/A little guidance in Signature stuff.

Today, because I feel like, I'm a show you how to customize a signature code, using my signature's code. Well, sort of. I'll show you a few things, starting from the beginning of the code, to the end. I had to test some of these things on my sandbox wiki beforehand to remember what they do. These are actually pretty simple things.

First, here's my signature code, for Spinpasta anyhow.

 Callie   -Leave your wub messages here-

And here are the results:

 Callie   -Leave your wub messages here-

Now, we're going to change a few of the pieces of code in each section, which will have another explanation behind it.

Length and Width
Rotate my signature ninety degrees in your head. Done? You should imagine it standing up like an "I".

Now, I will show you my code again, with the portions to be changed boldened.

 Callie   -Leave your wub messages here-

What we're going to do is reverse the numbers. The first and third numbers control the basic width of the signature, if it were standing like an "I". The second and fourth control base length.

The code revision:

 Callie   -Leave your wub messages here-

The result:

 Callie   -Leave your wub messages here-

Standing up like an "I", it should appear wider and shorter than the previous signature.

What I did was exactly as I said; I reversed the first and second numbers, and the third and fourth. I effectively reverse the length and width. Those four numbers control that base adjustment for the padding. Instead of second and fourth being five px, first and third are now five px.

Border Thickness and Color
The border is quite simple. Where it says border: Groove x2px.

 Callie   -Leave your wub messages here-

The number beside it is a hex code for the color of the border. We're going to change both.

First revision:

 Callie   -Leave your wub messages here-

We've upped the border to six px. That should be annoyingly thick. That number alone controls the thickness of the border.

But now comes the color, which is simple if you know your hexes. The hex code I have is orange. But we're going to change it to dark purple.

Second revision:

 Callie   -Leave your wub messages here-

That is the hex code.

The result looks like this:

 Callie   -Leave your wub messages here-

See how it's noticeably thicker? That is the result.

Picture position
The testing on my wiki only showed me a few things. The picture position is actually a common mess up. However, in truth, it's as simple as moving text.

span style="padding: 0px 5px 0px 5px; border: Groove 2px #F7941d; background: #000000; -moz-border-radius: 6emem 6emem 6emem 6emem; -webkit-border-radius: 6em 6em 6em 6em; border-radius: 6emem 6emem 6emem 6emem;"> Callie     -Leave your wub messages here-

Now, we are going to put this at the front of my signature. Simply pick it up and drop it just before the link to the user name.

Revision:     Callie   -Leave your wub messages here-

The result:

 Callie  -Leave your wub messages here-

Now you say: But what if I want one on each side?

Simple. Put it just after the talk page link.

Second revision:

 Callie  -Leave your wub messages here-    

The result:

 Callie  -Leave your wub messages here-

There you have it. A short guide with a little coding knowledge about signatures written at two in the morning for you. I'm sure there are a variety of other things, but I will figure those out in the future. :3