How-to add Icons in Your Signature
A great source for blog posts is questions you encounter in your daily life – in your business, in a conversation with your friends, in an article, even in an email from a friend. This post in an answer the could have been simply sent in a reply email, but since everyone can benefit from it, i decided to respond to it publicly.
I was asked by a friend how to incorporate icons in my email signature when using webmail clients like Gmail or Yahoo. In theory, in order to have any image appear in your email it should be in html format – but if the only language you speak my language, I would assume you know about html as much as i know about osteology! I did my research and found a plugin that works on Google Chrome (web browser) – Autopen. The trick is that you must be running Google Chrome – by the way, I’ve tried all browser and I highly recommend Chrome – it’s light, fast, and practical. I personally love it.
After installing Google Chrome and the plugin Autopen – an icon will be added to your Chrome toolbar – click on that icon – From here you can add signatures using the rich text editor or switch to the html view for more power and control. Once you have added a signature set it to default and it will get inserted automatically when you compose, reply or forward a message from you Gmail or Yahoo account.
Here’s where it starts getting tricky – a small lesson in HTML coding – in laymen terms! I won’t worry about you when it comes to writing your name and contact info – but how do we insert an icon. Switch to HTML tab view on your Autopen panel – why? because you need to do two things: 1- enter the code to locate the icon images, 2-enter the code to link the images to your desired destination.
- Upload the icon files onto your wordpress image library (What this does is give you a permanent online location of the image so you can add it to the HTML code)
- Access your wordpress image library and get the URL address of that image (I recommend that you do that to all the icons – copy and paste the URL addresses onto a notepad or word for easier access)
HTML coding
- HREF indicates the URL being linked to - replace the URL code underlined in red by the location of your Twitter account (or Facebook, etc …)
- IMG SRC indicates the URL image source - replace the URL code underlined in green by the URL of the image you uploaded to your wordpress image library
- now copy the whole completed code and paste it in the Autopen panel (HTML view)
Let me know if you found this post helpful. If you need any additional help, let me know!
Social Media is all about networking – so you have to make sure you are leveraging every opportunity to connect with others – and your email signature is one way. Think About It!


