Signature To Footer & Scroll To Top Button

Hey Blog Tap readers!  I'm Andrea from Love is... & I'm so glad to be here to share some tips & tricks with you all!

For the longest time, I was doing the insert a signature picture, business for every post, & was getting sick of it!  So I decided to look into how to add my signature into the footer of every post.  I found this tutorial, from Kevin & Amanda, & in no time, I had a rockin signature in my footer! It was really easy to do & it's given my posts a nice clean look, that I like.  Here's a quick step by step!

First off, you'll need a picture to use for your signature.  Here's mine...

Upload your picture to Photobucket, Flicker or whatever picture website you use.

Go to your Blogger dashboard & switch to the old Blogger interface.  Since the Blogger upgrade, I couldn’t find the same options as the instructions provided, so I had to switch back to the old interface.  Not ideal, but what are ya gonna do?!  = )

Select the Design option…

At the design page, select the Edit HTML tab.

Click the box next to Expand Widget Templates…

Click CTRL-F & in the pop up box, copy & paste following into the search box - post-footer-line post-footer-line-1 or <div class='post-footer-line post-footer-line-1'>. 

Either will work!

Under that line, paste this code, <img src='IMAGE URL' style='border: none; background: transparent;' /><br/>, & change IMAGE URL to the URL address of your signature image.  If you’re using Photobucket, you would need to copy the direct link.

Preview & if all looks well, select Save Template & you’re good to go!  You can now switch back to the new interface. 

Your signature will now be inserted into every post on your blog, including past posts.  So, if you’re OCD like me, you may want to go through & edit each post & remove the picture version of your signature, that you used perviously, so it doesn’t show your signature twice.  Yup, totally did that, because it would have driven me CRAZY!  It didn’t acutally take that long, surprisingly! 

-----------------------------------------------------------------------

Another fun thing I found to do was to add a “scroll to top” button to my blog.  It’s a cute little arrow that goes in the lower right hand of your blog.  I noticed how much I used that button when I'm on Pinterest, so I thought, there has to be something like that for blogger!  And, low & behold, I was right!

See it down there?!  I love it!  And maybe I’m the only one that uses it on my blog, but I’m ok with that!  = )

Now this is when I'm a bad blogger & tell you I don't remember where I got it from...  I didn't save the website & I don't know why.  I’ve searched & searched & I can’t find it again.  So frustrating!

To add it to your blog, simply go to your layout, select add a gadget, choose the HTML/JavaScript option & insert the following code.

<style type="text/css">.backtotop a:hover {background:none;}</style><div class="backtotop"><a style="display:scroll;position:fixed;bottom:5px;right:5px;" class="backtotop" href="#" rel="nofollow" title="Back to Top"><img style="border:0;" src="http://1.bp.blogspot.com/_u4gySN2ZgqE/SukYqBahTkI/AAAAAAAABCc/QVxl3cG5_90/s400/back-to-top.gif"/></a></div>

And it’s that simple!

I hope you’ve enjoyed my little tips & tricks & I can’t wait to see what everyone else has to show us in the future!  = )