FYI: Posts will be sparse around here until I replace my laptop.... Coming back to work after Christmas break apparently was too hard and it quit on me!

12 April 2011

Tuesday's Tips -Signature the easy way

So sorry for the lack of these lately!
I've had many questions on how to make a signature appear for each post. So here ya go! I've found two different ways of inserting a signature in each post. The first way is without messing with any of your blog's HTML code--the easy way. This way only inserts the image in future posts and the image is in the actual post itself.(can accidentally be deleted!) If you do it this way the image for your signature will appear just as any other image in your post. (not such a great idea if your images have borders or drop-shadows)
The second way is to use HTML to automatically put a signature image at the bottom of every post, past and future--the harder way.

Without further ado...

Post Signature the easy way


1}
create your signature


Create your signature in whatever image editing software that you use.  (I personally use GIMP because it is free and works well for what I need)
I would include your name and make the design represent your blog's feel and design. Make it represent you!

2}
upload your signature


Upload your image using whatever image hosting site that you use. (I would suggest imgur because it is free, doesn't downsize images, privacy settings, is easy to navigate, and usually loads quickly)

3}
creating the code


Yes, I know I said there wasn't html involved the easy way. What I meant was that you don't have to go messing with your blog's html. You kinda need html in order for your image to appear. =P
<a><img height="IMG HEIGHT IN PX" src="DIRECT LINK TO YOUR IMAGE" width="IMG WIDTH IN PIXELS"/></a>

Now let's take it apart...

<a>
--this is just letting blogger know that this next part is a certain type of html

<img
--letting blogger know that the following code is for an image

height="IMG HEIGHT IN PX"
--this is just the height of your image. Your image will load faster if the height and width is given.

scr="DIRECT LINK TO YOUR IMAGE"
--this is the source that the image comes from. Replace DIRECT LINK TO YOUR IMAGE with the direct link to your image. =P Don't delete the quotation marks around it!

width="IMG WIDTH IN PIXELS"
--this is just the width of your image.

/>
--end of the image section

</a>
--end of the specified code

Your code should look something like this:
<a><img height="133" src="//70.38.54.187/e/364/9504693d-aeeb-4bc6-8b93-96398b2d021f.png" width="200" /></a>

4}
add the code

Go to your dashboard> Settings> Formating
Scroll down to the bottom of the page and pate  your code in the box under Post Template.
Hit save! Now each time you go to make a new post that image will appear in the post already.  (Just don't accidentally delete it!) You can position it anywhere you'd like just like any other image in your post.

Next week will be the 'harder' way to create a post signature. =P

Love in Christ,

8 comments:

Brooke

Thank you!! I've been trying to find some way to add a signature to my posts, but none of the other ones worked. I was wondering... how did you make those little drop-down boxes in the top right column of your blog?

Emily Grace

You're so welcome, Brooke!
I'll start working on the tutorial on the expandable/collapsible toggle menu. =D

Katie

I LOVE your new blog design, Emily! So cute, and springy! <3

Katie

Emily Grace

Awe, thanks Katie! =)

Spicemuffin and Company

Hmmm, didn't work for me. :(
I wonder what I did...
I looked at my oldest posts, and my siggy isn't there.

Emily Grace

Spicemuffin and Company - This signature will only appear on new posts. If you want the signature to appear on every post, use [this tutorial]. =)

Lily Garay

Thank you!!! Do you think that you could make a post on how to create flashing pictures?

Emily Grace

Lily Garay - I'm not quite sure what you mean by flashing pictures--can you explain further what it would look like or give an example? =)

Post a Comment

Leave your thought...