You may have noticed the social follow buttons at the top of this blog's sidebar. Clicking on the first button takes visitors to the signup page for my blog's RSS feed. The others link to my pages on Facebook, Twitter, Google Plus, LinkedIn and Goodreads. Soon I will be adding two new buttons to link to my YouTube channel and my podcast. Below are some tips for adding similar buttons to your own blog or website.
1. Search online for the button images that you want to use. Although you should not use illustrations without the permission of the artist, these particular buttons are so widely used that I don't know of any way to determine who the original artist is. You may need to resize the buttons to fit in the space you have. My buttons are about 40 pixels square. I use the free Microsoft Office Picture Manager that came on my computer to resize images.
2. Upload your button images to your blog or website server. The images need to be stored somewhere online so that you can link to them.
3. Locate the URL for each of the social sites that you want to link to, such as your Facebook page, LinkedIn profile, etc.
4. Use the following HTML code to create a link for each button:
<a href="LINKURL" target="_blank"><img src="IMAGEURL "></a>
Replace "LINKURL" with the URL of the web page that you want to link to. Replace "IMAGEURL" with the URL of the place where your image is stored. Be careful not to alter the code or add additional spaces. Here's an example for my first button:
<a href="http://feeds.feedburner.com/BookMarketingMaven" target="_blank"><img src="https://bookmarketingmaven.typepad.com/Feed40.png "></a>
Because I wanted three buttons on each row, I placed a <br> line break code after the code for the third button, to force the fourth button to the next line.
You may find it easier to write your code in Word, but I recommend copying it to a text editor like Notepad before pasting it to your website.
5. Place the HTML code on your website where you want the buttons to appear. To place the buttons in the sidebar of a blog, you will paste the code into a blank widget (called a "typelist" on Typepad). I added a line of text (Follow the Savvy Book Marketer) just above my button code.
Next, place the widget in your sidebar where you want it to appear. I put my buttons at the very top of my sidebar so they are immediately visible. I also include text links to each of my social networks beneath my photo, lower down in the sidebar.
Social Sharing Buttons
As you can see, beneath the social follow buttons at the top of my sidebar there are some "social sharing" links that allow visitors to recommend my site to their social networks. There's also a Facebook "like" box farther down my sidebar, and Facebook "comments" features at the bottom of some of my blog posts.
In the August 23 issue of the Savvy Book Marketing newsletter, I am featuring an in-depth article on how to install these social sharing buttons. If you're not already getting the newsletter, subscribe today and you'll also get a copy of my free Top Book Marketing Tips ebook.
Dana, this was so very helpful! I always wondered how to do this. Now I was able to add these icons to my website. Thank you.
Posted by: Barbara Techel | August 13, 2011 at 04:42 PM
Thanks Barbara, I'm glad that you found it helpful! It's a simple thing, but it can really help spread the word about your website.
Posted by: Dana Lynn Smith | August 13, 2011 at 05:24 PM
One of our authors has found blogging to be helpful for marketing his books as well as providing helpful hints for other authors. Check out Gregory C. Randall at
www.writing4death.blogspot.com
Posted by: Bonnie Randall | August 24, 2011 at 11:19 AM