i have installed about 4 signatures in the last 24 hours.
i am no stranger to them,
however, i am new to the wordpress world.

and now that i am learning and designing in the wordpress interface, i’ve had to learn to do some things on my own. things that no matter how long i searched for the answer, i just couldn’t find it.

so i’m just going to tell you
how to install a signature on your blog,
whether you are a blogger, or a wordpress-er.
{cause i believe in equality and all that…}

a signature:
to make one, you can use any program that you can edit your file in layers.  if you don’t have photoshop or illustrator, you can use picmonkey.
be sure to save it as a .png file with a transparent background so you wont have a nasty box around it. that’s tacky. don’t do it.

upload it your photobucket account…
what, you don’t have one????  go take two seconds and do that… i’ll wait.

k, back?

for blogger:
head to your html code,

{you might want to save a backup copy of your template
 in case you mess something up… but you wont, this is easy peasy.}

Click on Expand widgets, then search using Crt F the following code:


and paste the following code underneath it:

<center><img src='IMAGE URL' style='border: none; background: transparent;' /></center><br/>

replace the “image url” with your image you uploaded to photobucket.
{it’s the direct link}

preview it on your blog before you save it and you will see where it showed up.

you can also try pasting your new code under this code:

post-footer-line post-footer-line-1

or this code:

<div class='post-footer-line post-footer-line-1'>

but be sure to preview before you save…
then save it and you’re done!

{if you like your signature aligned on the left
instead of centered, you can remove the
 <center> and </center> parts of the code.}
{also, if you want more space before or after your signature,
you can add as many <br/> tags before or after…}

if you still have issues with a border around your image… 
{i’ve noticed this happens in blogger}
thus making your signature look tacky, like you uploaded it every time…
sometimes even after changing the photo settings…

go into your css style sheet…
{dashboard>template>customize>advanced>add css}

and paste the following code:

.post-body img, .post-body .tr-caption-container, .Profile img, .Image img,
.BlogList .item-thumbnail img {
padding: none !important;
border: none !important;
background: none !important;
-moz-box-shadow: 0px 0px 0px transparent !important;
-webkit-box-shadow: 0px 0px 0px transparent !important;
box-shadow: 0px 0px 0px transparent !important;

{if you press return, you should see the changes in your preview below}

now, if you are a wordpress user,
{i believe you will only have access to the code like this if you are self-hosting your blog on a .com site rather than on your free wordpress.com account}

find the template for “content.php”

search for the following code:

<footer class=”entry-meta”>

just ABOVE this code, place the following code:

<center><img src=”YOUR-PHOTO-URL-HERE”/></center>

i’m not sure you can preview this one, so i just copy/paste the contents of the html page i’m editing into a word doc until i’m done. that way if i screw up the place, i can go back and repaste it to it’s original state.

if you have questions, leave a comment, and i will do my best to help!

linking here and here