How to Add - Cool Signature to Blogger?

Blogger posts looks much beautiful if we have a cool signature at the end of the post content. We have a process to add such cool signature to the blog such that it gets appended to all the blogger posts.

The process of adding the signature involves the below steps.
1. Create signature using any photo editing software.
2. Then load the image on to the web and get the URL path/address.
3. Create a HTML code that can be added to the blog template which makes the signature added to all the blog posts.

Lets us see the process of adding signature to blogger in details

1. Create the embed HTML code using the below mentioned code.

<img src="SIGNATURE IMAGE URL HERE" style="border: 0 !important; background: transparent;"/>

Replace the code highlighted in red with your actual signature image URL.

2. Now add the signature embed HTML code to blogger as below.

Go to: Dashboard -> Template -> Edit HTML

Find the code <data:post.body/> and paste the signature embed HTML code just after <data:post.body/>

NOTE: If you find the code <data:post.body/> at multiple areas of the template HTML code, then paste the code at each instance and try if that displays signature on all the posts. If not then choose the next instance of the code <data:post.body/>.






3. Save the Template and view blog to see the changes.

The signature should have been added to blogger and should get displayed on all the blog posts.

=================================================================


We have some websites using which we can create some awesome signatures


1. Go to www.mylivesignature.com



2. No registration required and click on Proceed.



3. Click on "Using the signature creation wizard"



4.  Enter your name and click "Next Step"



5. Select the font in Step2 and click "Next step"

6. Select the font size in Step3 and click "Next step"

7. Select the font background image and colour in step4. Click "Next step"

NOTE: To make the signature background blend with the blog, check the box against Transparent.

8. Select the slope and click "Next step"

9. Now the signature is ready to use.



10. On the same page, select "Want to use this signature?" from the three available options as seen below.


 


Click on "Generate HTML code". Then select the signature area.



The code generated looks like the one below.

<a href="http://www.mylivesignature.com" target="_blank"><img src="http://signatures.mylivesignature.com/54491/140/D907B3CB06F72640D3E1BDA3F7C4A640.png" style="border: 0 !important; background: transparent;"/></a>

Before using the code, we should delete the start and end of the html tag <a>.
If we do not delete this tag, the user will be taken to the website provided in href section of the tag <a> when the visitor clicks the image (this we do not want to happen).

After removing the start and end of html tag <a>, the code looks as below.

<img src="http://signatures.mylivesignature.com/54491/140/D907B3CB06F72640D3E1BDA3F7C4A640.png" style="border: 0 !important; background: transparent;"/> 

Now we can use this code to add to blogger template HTML code as mentioned above.



If you like the post, take a couple of minutes to comment and share.
Your comments are most valuable and would help me come up with better posts.