Wednesday, October 31, 2007

Nice image signature for your posts using signature generator

Have a look at this post: Signing post with nice graphic signature. This is much nicer than the one I did (was mainly for demonstration purposess) at Sign post with image signature (click BACK button to get back to this post). That was done with the free free Ifanview photo edito (click BACK" button to get back to this page), this "live signature" generator produces almost hand-written like signature, and is obviously more attractive looking. I was planning to do a real hand-written image signature with Paint, but that would make a pretty scratchy signature unless you can control your stroke very well. I think I will leave that to the future, if ever.

Thanks to Amanda of Blogger Buster who created an easy to use image graphic signatue generator which she called "live signature" and using the wizard, by making a couple of choices, I was able to generate the graphic signature to put at the bottom of the post with very little fuss. When you are done with selecting your choices, you will end up in this page:

My Live Signature

First to the the "live signature" site and generate the graphic signature you like. You will end up with a graphic signature image. Right-click on the image and select "Save image as" and save it into your computer. Before you can use it, you have to upload it to the web, You can use the Free Image and Video Hosting. You will have to get the photo URL. The process of getting the photo URL is explain in the lower half of this post Uploading and manipulating images for Blogger (click BACK button to get back to this page).

Another way is to create a special post or a special blog for the purpose of hosing the image. Upload it in the usual way, view the post, click on the graphic image signature that you have uploaded. (see Graphic image signature: Test

You will be taken to a page containing only the graphic signature image. Click VIEW > PAGEB SOURCE in the menu bar and a new window will appear containing the page source. I will put the actual page source in the scroll box below:

<title>Peter+Chen+signature.png (image)</title>
<script type="text/javascript">
if (top.location != self.location) top.location = self.location;
// -->
<body bgcolor="#ffffff" text="#000000">
<img src="" alt="[Peter+Chen+signature.png]" border=0>

The photo URL is highlighted in red. Copy this and preferably paste it into a Notepad file so you can get it anytime your like.

Then type at the bottom of the post the HTML for an image:

<img src="photo URL" alt="some text to describe the image" />

where the photo URL is what you see highlighted in red in the scroll box above.

Now if you don't want to have to go to the trouble of typing this image HTML each time you create a new post, go to SETTINGS > FORMATTING and at the bottom, you will have the POST TEMPLATE, a box for you to paste the abovve img tag into the box. Save the setting. After that, each time you create a new post, this img tag will automatically appear in your post editor. Just type your content above the img tag.


  1. you're a gem peter. i have always read your blog and followed your tips whenever applicable. i have generated a nice signature and instakked it in my blog. i tweaked the html so that even the previous post now have signatures.

    thanks again.

  2. Dear Peter/Monaco,

    Having the live signature for posts is a great idea...thanks for that..!!
    I read Monaco's comment that he has tweaked the HTML code so that even the older posts have the signature. Could you please guide as to how can I have the signature in the older posts as well..Please help.


  3. The only way I know is to manually add them.

  4. I have a question. I have a picture and my signature. When I add it to my post (which has a brown background--for now)the signature has a big white space behind it. Is there any way to make my image have a transparent background?

  5. Anonymous7/10/2010

    Thank-you this was VERY helpful

  6. Thumbs up for this post. Thanks. Looking forward for more helpful tips and tricks :-)

  7. I created a signature in photoshop and then put it in png format. Went to my blog and put the signature in post temlate. My sig is at the top and won't go to the bottom. I can't type anywhere above it either. Help!

  8. Suggest you put the HTML code into post template so every new post will have signature at the bottom. See Nice image signature for your posts


Find help, info, instructions, tips, tricks

Tip: Use search box below or this box, labels in the first right sidebar, archive, ctrl+F for this page or sitemap to find topics