Don't forget to visit Fabulosity Reads Book Blog

Jan 14, 2014

HOW TO CREATE A BLOG SIGNATURE FOR BLOGGER(mostly)

Posted by Wendy Ewurum  |  at  1:05 PM

One of the quickest ways to posh up your blog is most certainly by adding a blog signature.
Not only does it give it certain flair but I like the fact that it gives a visible stamp of your authority over your blog content.
And again, like having a blog button, to me it just screams “I Am A Serious Blogger”.

So today I decided this is the tit bit I will share with you.
NOTE! This CSS can be used with Wordpress too but what i have described here in installation (last step) applies to blogger.

There are two ways of installing a signature to your blog, one is to add a signature that will install itself even on your old posts.
The other is a signature that will update only from your next post. Meaning all your old ones remain lacking.

This week I will share the first because this is my favorite one.

I wanted to make sure that even my very first post on this blog, dating back to July of 2011 would have a signature.
And thanks to CSS codes, we can do this within seconds of pressing save.

this is what we are starting out with and  as you can see, there is no signature:

This is what we want to create, well something like this, it doesnt have to be the same. 
And insert just above the words, posted by Wendy:

I suppose you could upload a signature everytime you post **exhausting** and time consuming. 
Manual uploading will also never get to your other old posts. That's the beauty of this code I'll be showing you.

Right. What to do.

First off get yourself a design of your signature.
You can design your signature from scratch using any number of design software to create a png. image and edit it with corel draw, picmoney, photoshop etc. to make it pretty.
I admit i did go an extra mile in photobucket and made a border and included the blogging ninja text but ignore that. Look at the name with hearts.
Now I am all for authenticity but for me time is of the essence so, short cuts please. to get my name in the font with hearts this is what i did.

I made a very quick signature by going to: MY LIVE SIGNATURE.
This awesome site has a wide variety of fonts, colors and sizes for you to quickly pick from in all of two minutes and your signature is done.

All you need to do is:
Enter a name, initials or a nickname for creating the signature.
Then you can choose from more than a 100 fonts.....the variety is huge.
I found mine at number 44 because I’m frivolous like that. I love doodly things.
Next choose the size of your signature, and the color of the font and the background.
At the end “save image as” and you have it on your computer.

Next step is to host it on your image hosting site. All my pictures are on PHOTOBUCKET and I briefly explained how to use photo bucket two weeks ago here: CREATE A BLOG BUTTON WITH CODE

Once you have your  imag'es DIRECT LINK from photobucket you copy it directly in the red, BOLD section of this code.

.Header { 
text-align: center; 

}
.entry-content:after {
content: url(http://i1359.photobucket.com/albums/q795/SkillsDepot/1c5220cf-87bd-4004-8081-b684a52774e5_zps0f715499.png);
centre left: 50px;
}

And that blue and red ink is your entire CSS code for your signature. 
To get this working we need to pop it in the BLOGGER DESIGNER TEMPLATE.
So get to the back end of your blog.
Click on TEMPLATE, CUSTOMISE  and get to the advanced section and open up CSS.
In other words, this is where I want you to be.
LEFT CLICK ON PIC TO ENLARGE IF YOU CAN'S SEE WHERE ARROW IS POINTING

Copy the code and paste it where my sorry looking number three is, in its entirety, dont leave out even a fullstop. 
Save on the top right (by sorrier looking number 4).
Now go back to your blogs home page and check the end of any post.
This is what you should see at this point.

LEFT CLICK ON PIC TO ENLARGE IF YOU CAN'S SEE WHERE ARROW IS POINTING

















Well if you got this far then i do believe my work is done.
I welcome questions and feedback so never hesitate. 
Until next time....God bless

IF YOU FOUND THIS POST USEFUL PLEASE SHARE IT.
I'D ALSO LOVE TO CONNECT WITH YOU BY FOLLOWING EACH OTHER'S 
BLOGS VIA GFC AT THE TOP OF THIS POST.
HAVE A MARVELOUS DAY.....


About the Author

Most know me as the author to Fabulosity Reads and in actual fact, that is the previous name of this blog. I have since then moved my books to a Wordpress self-hosted blog so that I can have a place to show a different side of me which I am equally passionate about and that is marketing and personal development. I hope you will love being here, watching me grow as I share and learn. My highest hope is that we will grown and learn together in all disciplines affecting our lives. I'd LUUURRRVE to hear from you, so don't be shy...

30 comments:

  1. This is very cool. I shall be doing this tomorrow. Thank you, you always have such awesome ideas. I'm trying to think of a good slogan for my blog, too.

    ReplyDelete
  2. LOL...i'm glad you liked it Kate....I love having you here.

    ReplyDelete
  3. Hi, Wendy!

    WOW! Another GREAT Blogger tutorial!! I really appreciate how you help out other bloggers, especially those of us who are not that "tech-savvy".....like me! But that's the beauty of blogging -- bloggers learn from each other! (Although I myself don't have anything technical to share....lol.)

    I really appreciate the very detailed tutorials you present on your blog! This is another great one that I shall definitely consider implementing on my blog! Thanks again!! : )

    ReplyDelete
  4. Im so happy they are of use to you.....and being such a long winded person i often worry that the detail is too much so i am so happy to hear that, thats a good thing.

    ReplyDelete
  5. I couldn't get it to show up. :(

    ReplyDelete
    Replies
    1. CAn you post exactly what you did here CSQ?

      Delete
  6. how do you center the signature?

    ReplyDelete
  7. It worked only on the preview. But when I have applied and saved the template on my blog, no signature appears. Instead, I am seeing the CSS Code on the heading (topmost part of my blog). I wonder what went wrong or where did I make a mistake

    ReplyDelete
  8. I'd like my linkwithin gadget to go below my new, awesome signature (Thank you very much!!!) Is there a way to make that happen?

    ReplyDelete
  9. Oh, that was so easy, you are a great tutor ;) Thank you!

    ReplyDelete
    Replies
    1. Thank you so much for that. Maybe I should keep at it.

      Delete
  10. Everything worked but I can't figure out how to get it centered?

    ReplyDelete
  11. Your code apparently doesn't like my blog. :-(

    ReplyDelete
  12. Thanks for the tutorial. I followed your directions exactly, but my signature isn't there. There is a broken picture symbol there. Any ideas on how to fix that?

    ReplyDelete
  13. Wendy, I'd like to start off by saying how wonderful I think you are by sharing this tutorial. I only discovered you by your answer on this topic via another blog tutorial that had me all confused (and that's not very hard to do..lol) and then lucky for me I jumped for joy when I did it your way and it worked first time...woohoo happy dance!

    The only thing I have that's not sitting right with me is that the signature is sooooooo far from the end of my post....mmmmm!
    Have I missed a step or did something wrong?
    I'd really appreciate your thoughts on how I maybe able to rectify the problem...pleeeeeeease.

    Thanks ever so much in advance - http://ourasiancreation.blogspot.com.au

    ReplyDelete
  14. I apologise everyone for the lack of response. I had to put a hold of blogging for a while to start a new job. I will go through everyone's comments and respond soonest. Than you so much for visiting.

    ReplyDelete
  15. Hi Wendy, I hope your new job is going well, I figured out what was wrong myself (cleaver little bunny) but feel free to visit my blog to have a look see anyway

    Thanks for the great tutorial I've enjoyed it
    x

    ReplyDelete
  16. I am having the same problem that Michelle Timbs is, it seems like the signature is forever far away from my posts. Also is there a way that I can center it instead of having it be to the left. Thanks. carliejowilliams.blogspot.com

    ReplyDelete
  17. This is awesome! Thank you so much. I have a question. When signing off, should I use my full name 'Deborah' or my nick name 'Deb? I am known by family and friends as Deb as I find Deborah very formal. What are your thoughts?

    ReplyDelete
  18. This was so helpful! Thank you so much.

    ReplyDelete
  19. This is amazing. I love the way you explain it in a simple way

    http://www.owenhabel.blogspot.com

    ReplyDelete
  20. Thanks so much for explaining this in a way that a beginning blogger can understand. The pictures really helped too! I got my signature in place & I love it.
    http://sohereiswhatithinkabout.blogspot.com/

    ReplyDelete
  21. I hadn’t moved my post signature up after I added LinkWithin the other day. So I followed your directions and while it’s in the right place now for some reason my sig has a little drop shadow around it- which it didn’t previously.

    digital signature PDF

    ReplyDelete
  22. Thank you for this Wendy, it worked great! My only issue was I wanted the signature further to the left so I moved the image as far left as possible in PSE and then it was in the place I wanted. I think it was how I created the signature in Live Signature. Hope your new job is going well!

    ReplyDelete
  23. THANK YOU! I had tried several signature css tutorials before I came across this one and finally it works! How do I get it centred though? Thanks again, Ami.

    ReplyDelete
  24. Actually great theory about create a blogger blog. Thanks for sharing.

    ReplyDelete
  25. Thank you so much! The "scratchy 3 and 4" in the picture may have been squiggly, but it made my day. Your instructions were wonderful and easy to follow. Thanks!

    ReplyDelete
  26. THANK YOU for your great and useful article!
    Also Have A Look At Mine : Add a Signature to Your Blogger Posts

    ReplyDelete
  27. Thank you so much! now i have a signature on my blog but i did not have to use photobucket i just generated the HTML code provided at MyLiveSignature. Thank you once again

    ReplyDelete
  28. The Apply to Blog button doesn't work? Anyone know why. It looks pale. Everything else seems to be going smoothly but looks like I'm not allowed to do this :(

    ReplyDelete

I love hearing from you....

Subscribe
Get our latest posts directly in your email inbox.

What they says

Contact information

Email: Wendy.Ewurum@fabulosityreads.com Tel: 071 087 4833 South Africa Twitter: twitter.com/FabulosityReads Facebook: https://www.facebook.com/fabmarketingandpr
Proudly Powered by Blogger.
back to top