>>> How to Download Paid Android Apps for Free   >>> Aakash Tablet Good for Blogger to Blog on The Move   >>> Use Automatic Fixed Read More Jump Break With Thumbnail On Blogger   >>> How To Create A Privacy Policy Page To Comply With AdSense TOS   >>> Solution for Common Problems of "Drop Down Menu" for Blogger Blogspot Blog   >>> Best Tutorial to Make CSS Drop Down Menu for Blogger Blogspot Blog   >>> Add Custom Search Box In Blogger Blogspot   >>> Create a Facebook Fan Page for your Blog   >>> Add a Contact Me Page (Form) To Your Blogger/BlogSpot Blog   >>> Add Cool Subscription Widget to Blogger Blogs   >>> How to Setup Your own Domain to Blogger Blogspot Blog   >>> Add background music to your blog   >>> How to Buy Custom Domain For Your Blogspot Blog Via Blogger   >>> Blog's Definition & History In Short Note   >>> How To Remove Low paying Adsense Ads   >>> How To Host Javascript Or .Js Files On Blogger Itself   >>> Adding Numbered Page Navigation Bar For Blogger Blogspot Blog   >>> How To Change Blogger Mouse Cursors In Easy Way   >>> New Blogger App for mobile phones like iPhone, iPad, iPod Touch   >>> How to Delete or Remove Posts From Blogger Blogspot Blog   >>> How to Remove or Change the Blog Title Border in Blogger (Blogspot) - Minima Template   >>> Add or Change Background Image of a Blogger Template   >>> Add a Post Divider Between Blogger Posts   >>> How to Align and Justify Blogger Posts   >>> Guide to Blogger Blogspot FAQs   >>> How To Delete a Blogger Blogspot Blog   >>> Solution to Missing Add a Gadget Feature in Blogger   >>> Free Essential Tools for a Blogspot Blogger   >>> Add 3 Column or 4 Column Footer to Blogger   >>> Add Email This Post Link to Blogger   >>> How to Change Bullet Point Style in Blogger (Blogspot) Lists   >>> Show Date Above Blogger Post Title   >>> Blogger Post Image Borders Change or Remove   >>> Remove Image Border in Default Blogger Templates Simple and Awesome Inc   >>> How to Add a Table to Blogger Blogspot Post   >>> Choose Your Own Blogger Post Date   >>> How to Add a Subtitle to Blogger Posts   >>> Add Profile Images to Blogger Comments   >>> How to Highlight Author Comments in Blogger Posts   >>> Get More Comments on Your Blogger Blog   >>> Blogger Read More Links in Posts with Jump Breaks Feature   >>> How to Add Internal Links Within Blogger Posts   >>> Add Simple Image Slider to Blogger   >>> Add Printer Button or Link to Blogger Blogspot   >>> Add Outbrain Ratings Widget to Blogger   >>> Hide Remove Navbar from a Blogger Blog   >>> Add a Horizontal Links Menu to Blogger   >>> Add a Welcome Message to Blogger Blog   >>> Avoid 6 Common Blogger Mistakes   >>> Add Twitter Badge Button to Blogger   >>> Add a Twitter Followers Counter to Blogger   >>> Tips to Add a Digg Button to Blogger Blogspot   >>> Free Social Bookmark Buttons for Blogger   >>> Add Social Bookmark Buttons to Blogger   >>> Add a Social Bookmarking Button to Blogger   >>> Add Email Subscription Form and Links to Blogger Blogspot   >>> Add a Recent Comments Feed to Blogger Sidebar   >>> Add a Recent Posts Feed to a Blogger Blog   >>> Add a Categories Section to a Blogger Blog (Blogspot Blog)   >>> Add Affiliate Banner Below Post in Blogger   >>> Add an Affiliate Banner to a Blogger Header   >>> Add an Affiliate Banner to Blogger Sidebar   >>> Place Google Adsense Below Post Title in Blogger   >>> Add Google Adsense Below Blogger Post   >>> Add Feedjit Live Traffic Feed to Blogger   >>> Add Google Analytics to a Blogger Blog   >>> Track Visitors to Your Blogger Blog   >>> Submit Blogger Blog to Blog Directories   >>> Submit Your Blogspot Blog Sitemap to Google   >>> Submit Your Blogspot Sitemap to Yahoo   >>> Add a Blogger Sitemap to MSN Bing Webmaster Tools   >>> Submit a Blogger Sitemap to Major Search Engines   >>> Blogger RSS Feeds and Feedburner   >>> Burn Blogger RSS Feeds at Feedburner   >>> Add a Feedburner FeedFlare to Blogger Feed   >>> How to Create Search Engine Friendly Permalinks for Blogger Posts   >>> Adjust Blogger Title Tags to Improve SEO   >>> Add Amazon Product Links to Blogger Posts   >>> Make Money Add an Amazon Widget to Blogger   >>> Add Chitika Ads to Blogger Blogspot   >>> Earn Money with Chitika and Blogger   >>> 5 Easy Ways to Make Money from Blogger   >>> Make Money Add Banners Ads to Blogger   >>> Blogger Guide to Google Adsense Placement   >>> Add Banner Adsense Above Blogger Header   >>> Bloggers Guide to Google Adsense Myths   >>> Add Google Adsense to Blogger Header   >>> Better Placement of Google Adsense in Blogger   >>> Google Adsense Tips for a Blogger Blog   >>> Add Paypal Donate Button to Blogger   >>> Increase Google Page Rank Blogger Blogspot   >>> Make Money With Adsense Keywords and Blogger   >>> Add Meta Tags to Blogger for Better SEO   >>> Add Breadcrumb Navigation to Blogger Blogspot   >>> Blogger Blogspot SEO Tips and Tricks   >>> 10 Tips to Build Blogger Blogspot Site Traffic   >>> Embed a Comment Form in Your Blogger Posts   >>> List of How Blog Works Blogger Tutorials   >>> Add Missing Embedded Comments Form to Blogger   >>> How to Add Missing Quick Edit Wrench to Blogger      + Grab this Widget on howblogworks

Monday, August 29, 2011


Add a Social Bookmarking Button to Blogger

In this tutorial you will learn how to add an Add This free Social Bookmarking button to your Blogger blog (Blogspot) blog. By adding this feature to your blog you will enable visitors to your blog to create links to popular social bookmarking sites such as Google, Technorati, Facebook, MySpace, Digg, Stumble Upon, Reddit, Delicious, Furl, Yahoo etc. Adding personal social bookmarks enables visitors to share these links with others thereby helping you attract more traffic to your site. For more information on the benefits of social bookmarking please refer to my article - Benefits of Social Bookmarking for Blogger bloggers.


This tutorial shows you how to place a social bookmarking button on your site by accessing a free social bookmark and feed button builder service called Add This. Add This will supply you with a simple piece of code which when placed in a widget will insert a social bookmarking button either at the end of each post or in the sidebar. If you wish you can add the social bookmarking button to both as I have done on this site. For those new to blogging don't worry if this sounds complicated as this article gives you step by step instructions suitable for any Blogger user including beginners.

How does an Add This Social Bookmarking Button Work?
The code from Add This places a button on your site which when clicked on by a visitor to your site opens a menu of the most popular social bookmarking services. When a selection is made by a visitor eg Delicious, Yahoo, Google, Facebook, MySpace, Stumble Upon they are given the option to submit your blog to their online bookmarks. Once a visitor submits your blog to a social bookmarking service Add This can provide you with useful analytics about bookmarks, feeds and emails depending on which buttons you enable on your site. This kind of statistical information from Add This will help you gain greater understanding of your site traffic and your most popular posts.



Steps for Adding a Social Bookmarking Button from Add This to Your Blogger Blog

1. Register for a free account with Add This



2. Once you supply a username, email address, password and your website address sign up is pretty much instanteous.

3. After sign up is confirmed click on Get Your Button. This will take you to the Create Your Button Page



4. On the Create Your Button page you will be asked to make some selections about your social bookmarking button.

What kind of Button? Select Sharing/bookmarking button

What Look? Choose any of the six button choices. For this example I am going to select the share button



Where? Select on a blog

Blogger Platform? Select Blogger

At this point the information your have entered should look like the picture below:



Once you have confirmed that you have entered the correct information click on the Get Your Code button and you will be taken to the Get Your Code page.

5. From the Get Your Code page you will be given the option to Preview your button. Do so if you wish or move on to Step 6.


Having generated the code for your Add This Social Bookmarking button you now need to decide where to position it on your blog. You may either place your new Social Bookmarking Button beneath each post (see below) or in a sidebar.


Instructions for Placing a Social Bookmarking Button Beneath Each Post of Your Blogger Blog

Click on Blog Post Button option.

Highlight the Javascript code supplied by Add This

Copy the code to the Clipboard of your computer using Ctrl + C command

In a new window open your Blogger Blog and sign in

Navigate to Layout > Edit HTML

As a precaution Backup your template in case you inadvertently overwrite some code.

Once you have backed up place a tick in the Expand Widget Templates checkbox

Use the Ctrl + F command to open the toolbar which will appear at the bottom of your page while using Blogger. You can close this at any time using the Ctrl + F command or by clicking on the blue cross in the lefthand corner.

Now highlight the following line of code and using the Ctrl + C command copy and paste the code into the Search Box on the toolbar at the bottom of Blogger. This action will quickly locate the code for you in your Blogger template. You will be placing the code immediately before this tag.


<div class='post-footer'>



Return to Add This and highlight the Javascript button code supplied. Copy the code to your clipboard using the Ctrl + C command.

Reopen the Blogger window and place the cursor right before the tag that you located earlier.

Paste the Javascript code from Add This into the template using the Ctrl + V command.

Your code placement should look like that pictured below



Click on Save Template

Now click on View Blog from the top menu and navigate to the end of your first post. If all instructions have been followed you will now have a social bookmarking button at the bottom of each post.


Instructions for Placing a Social Bookmarking Button in a Sidebar of Your Blogger Blog

Follow the Add This automated process by clicking on Add the Menu to My Blog button. This will place an Add This social bookmarking button in a widget in your sidebar as you see on this site.



This Blogger tutorial has covered the steps involved in adding a free Add This Social Bookmarking Button to your Blogger blog (Blogspot blog). Grow your Blogger (Blogspot) blog today by adding a free Add This social bookmarking button which will enable visitors to bookmark your site and share your posts with others. Add This will provide statistical tracking of social bookmarking activity on your site and help you determine your most popular posts.

Related Articles
List of How Blog Works Blogger Tutorials
10 Tips to Build Site Traffic for a Blogspot Blog
Add Social Bookmark Buttons to a Blogger Blogspot Blog
Free Social Bookmarking Buttons for Blogger

No comments:

Post a Comment