Software Plus

Log into your Blogger account. Go to Design > Edit HTML > Click “Format Blog” (this used to be Expand Widget Templates). Click into the HTML box and search (CMD F on Mac or CTRL F on a PC) for something similar to code below. This may look different depending on the template you are using. You may find two instances of this in your template, add it to the second one which is further down.

<div class='post-body entry-content'>
      <data:post.body/>

And paste this code beneath it.

<div class='sign'> <img src='DIRECT URL HERE' style='border: none; background: tran

sparent;'/> </div>

or if you ONLY want it to appear on the post page and not the home page, add the following

<b:if cond='data:blog.pageType == "item"'><div class='sign'> <img src='DIRECT URL 

HERE' style='border: none; background: transparent;'/> </div></b:if>

Method 2 – add signature to above footer in code :

I recommend this method if you have post excerpts set up on your blog. Log into your Blogger account. Go to Design > Edit HTML > Click “Format Blog” (this used to be Expand Widget Templates). Click into the HTML box and search (CMD F on Mac or CTRL F on a PC) for something similar to code below. This may look different depending on the template you are using. You may find two instances of this in your template, add it to the second one which is further down.

<div class='post-footer'>

or

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

And paste this code beneath it.

<div class='sign'> <img src='DIRECT URL HERE' style='border: none; background

: transparent;'/> </div>

or if you ONLY want it to appear on the post page and not the home page, add the following

<b:if cond='data:blog.pageType == "item"'><div class='sign'> <img src='

DIRECT URL HERE' style='border: none; background: transparent;'/>

</div></b:if>

Method 3 – place item after entry content using CSS :

Log into your Blogger account. Go to Design > Template > Advanced > Add Css. Paste the following code into the box which will add it before </b:skin> in your html. Change the URL to the link of your own image. Edit the number to 0 if you want it positioned on the left or alter it higher or lower to move the image left and right. Save settings.

.entry-content:after {
content: url("IMAGE URL");
margin-left: 300px;
}

Style the Image

To alter the position of the signature, go to Template Designer > Advanced > Add CSS and paste the following CSS. This will now appear before </b:skin> in your HTML.

.sign { text-align:left; }
.sign { text-align:center; }
.sign { text-align:right; }

Signature stretched?

If you have code on your blog to make post images full width, then your signature will also be full width. This only works for method 1 and 2 as method 3 is adding the signature as part of your post. Use the div class you used above to resize the image, example

.sign img{ max-width: 100px !important;}

or

.sign { max-width: 100px !important;}