Adding a Facebook personal account badge to your blog

This article describes making a Facebook badge to promote your personal Facebook account, and putting it onto your blog.

Facebook, Profiles and Pages:


Pillow PersonAs I've previously explained, Facebook has Profiles for people, Groups for collections of people who want to approve individual members who join, and Pages for everything else.
    Many people called their Profile their Facebook "account" - and lots are confused about the differece between personal profile, and pages.   But there is a big difference - and it starts to become obvious when you look at how to promote your facebook presence inside your blog.

    I've already described how to make a badge for a Facebook Page.   Now I'm going to look at how to make a different kind of page, to promote yourself, ie your Profile.

    This is an example of the "follow me" approach to linking your blog and the social networks, although for Facebook pages your reader becomes a Fan rather than a Friend.


    Making a badge for your Facebook profile:

    Log into Facebook with the personal account that you want to promote.
    .
    Choose Profile (currently on the top right menu, just next to Home).

    Scroll down the left hand panel,until you see Share a Badge (usually at the bottom) - click it.   This takes you to Facebook's badges page, with Profile badgets automatically selected.
      
    Click Edit this Badge,

    Choose the format and contents that you want to show.
    Remember, what's shown is the information from your personal Facebook account, and if you put it onto your blog the usual Facebook security rules won't be used to control who sees the information.   Only use these badges if you're very sure that you want your information to be shared.

    When you are happy with the selections, choose, Save the badge.

    Facebook has options to step you through the process of adding the badge (as a gadget) to Blogger.   But I always prefer to choose Other and then Copy the code provided (put the mouse into the field, press Ctrl/a to select it all, then Ctrl/c to copy).



    Install the code into your blog:  as always there several options for installing 3rd party HTML, depending on where you want to put the badge.


    What your visitors will see

    People who visit your blog through a web-browser will see a badge showing the information that you have chosen to show.

    When they click on it, they will be taken to Facebook and as much of your profile as your current privacy settings let them see.

    As always, people who read your blog via a feed reader (Bloglines, Google Reader, etc), or by email subscription (eg having used follow-by-email) may not see the Facebook item, depending on where is places and what options their email program has.


    Customizing the code:

    Unlike other Facebook badges, the profile badge has very few options for being customized by editing the code, which looks like this:
    <!-- Facebook Badge START --><a href="http://en-gb.facebook.com/WHOEVER" target="_TOP" style="font-family: &quot;lucida grande&quot;,tahoma,verdana,arial,sans-serif; font-size: 11px; font-variant: normal; font-style: normal; font-weight: normal; color: #3B5998; text-decoration: none;" title="WHOEVER">WHOEVER</a><span style="font-family: &quot;lucida grande&quot;,tahoma,verdana,arial,sans-serif; font-size: 11px; line-height: 16px; font-variant: normal; font-style: normal; font-weight: normal; color: #555555; text-decoration: none;">&nbsp;|&nbsp;</span>
    <a href="http://en-gb.facebook.com/badges/" target="_TOP" style="font-family: &quot;lucida grande&quot;,tahoma,verdana,arial,sans-serif; font-size: 11px; font-variant: normal; font-style: normal; font-weight: normal; color: #3B5998; text-decoration: none;" title="Make your own badge!">Create your badge</a><br/>
    <a href="http://en-gb.facebook.com/WHOEVER" target="_TOP" title="WHOEVER"><img src="http://badge.facebook.com/badge/WHOEVER.WHOEVER.png" width="177" height="84" style="border: 0px;" /></a><!-- Facebook Badge END -->

    An important note:   if you create a badge like this and put it into a website, and then go back and edit the badge in Facebook - the website will show the updated badge.


    Related Articles: 



    Putting HTML from a third-party into your blog

    Adding a Facebook "Page" badge to your website

    Tools for linking Blogger and the Social Networking sites

    Putting a Facebook "share this" button on your blog

    0 comments:

    Post a Comment

    Home - About - Order - Testimonial
    Copyright © 2010 Tips Blogging All Rights Reserved.