While Google uses spiders to index information Facebook is using the Social Graph. Over 350,000 websites have incorporated that social graph with Facebook users Liking more than 3 billion items a day. It seems that everyone from IMDB to CNN is getting in on the action. What’s the take away from all of this? It’s simple. If you operate a consumer driven website then the Facebook Like button should be incorporated into your website.
If you’re a website owner that gets most of your revenue from consumer traffic you should use Facebook Social Plugins. This post will give you a quick guide on how to do so.
Step 1: Paste the following Javascript anywhere after the <body> tag.
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'your app id', status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
Step 2: Paste the following to every Page on your website where you want a Facebook Like Button. [1]
<fb:like></fb:like>
You’re Done! Simple right?
Step 3 (optional): You have the option of specifying open graph meta tags. Put them in the head of your website.
<meta property=”og:description” content=”Moko Marketing is a Facebook marketing blog. “/>
<meta property=”og:image” content=”http://www.mokomarketing.com/images/Logo.jpg“/> Must be JPG!
<meta property=”og:title” content=”Moko Marketing: Adding Social Plugins to your Site“/>
<meta property=”og:site_name” content=”Moko Marketing“/>
<meta property=”fb:admins” content=”xxxxxxxx“/> Admin account to publish updates from.
<meta property=”og:type” content=”website“/>
Adding an administrator account and meta tags let’s you publish status updates to individuals that click your Like buttons. Make sure your title tag doesn’t contain any blocked words such as ‘Facebook’, ‘Free’ or swears. Additionally after 10 likes you cannot changes these Open Graph meta tags. Facebook will also cache a lot of content making testing difficult on single buttons.
Step 1: Same as before.
Step 2: Paste the following to every Page on your website where you want a Facebook Comments Widget. [2]
<fb:comments></fb:comments>
Step 3 (optional): Same as before.
Want to get a pop-up dialogue on your Facebook Page? Add this code to your Facebook Page to get a Pop Up Dialogue. Feel free to edit the text in blue.
<a href=”" clicktoshowdialog=”Code”>Click here to see a pop up box</a>
<fb:dialog id="Code">
<fb:dialog-title>Enter the title of your pop up box.
</fb:dialog-title>
<fb:dialog-content>
Enter some text for your pop-up.
</fb:dialog-content>
<fb:dialog-button type=”button” value=”Close” close_dialog=”1″/>
</fb:dialog>
Thank you everyone for your support. The Ultimate Guide to Creating Facebook Fan Pages is now available for purchase.
If you’d like a copy to review on your site or your blog, please let me know as well. The Guide is designed to take beginners by the hand and show them how to create a Facebook Fan Pages, add and edit Static FBML and create and add a Facebook Application to your Fan Page. Multiple code samples are included as well. I gaurantee that there is not one ounce of fat or superfluous information in the guide.
The guide is a must have for anyone stuck on creating their first Facebook fan page.
If you are interested in obtaining a review copy of the Moko Marketing Manual, which has been tentatively titled as The Ultimate Guide to Creating Facebook Fan Pages we’ll be offering a limited number of copies to individuals for review purposes. Reviewers please include a blog, twitter or company URL when requesting a copy.
While I’m still trying to wrap my head around some great marketing strategies using Facebook’s new Open API a number of social plug-ins should really be implemented into your website ASAP.
The Like Button - Similar to the Digg or Reddit button on your website, this tool is a lot more powerful by virtue of Facebook being 100x more popular than either reddit or digg. As an added bonus you can have a Like button up and running within minutes as all that’s needed is a simple iFrame. It’s unclear to me right now as to whether you have absolute control over which Page fans are connected to. For example, if your business sold a book called ‘The Secret’ your fans could be linked to the more popular book by the same name. This is more of a problem with the way Facebook handles profile data than anything in the Open API. The issue also isn’t clear for specific Pages, take CNN for example. Which Page is linked? The official CNN Page or this more nebulous CNN Page that doesn’t seem to be owned by anyone. The nebulous CNN page is already 10% as large as the official Page.
Comments Box - The Comments Box seems to be the 2nd most useful feature of the Open API, competing directly with services such as Disqus. Facebook’s advantage? It’s immense user base. The comments box cannot be implemented with a simple iFrame. XFBML must be added to your webpage.
Other social plug-ins include an activity feed which seems to only be relevant once your website reaches critical mass; a like box, a larger version of the like button; facepile, a collection of profile pictures of the user’s friends who have already signed up for your site; livestream; recommendations and login with faces, all of which are secondary in important to the Like button and Comments box which will drive traffic to your site.
There was an earlier post on how to add an Application to a Fan Page tab. Well, now some of the content is hidden behind the fan page wall so we’ll walk you through the process.
1. Add the Developers Application and click ‘Set up New Application’.
2. Name your Application, Agree to Facebook Terms and click ‘Create Application’.
3. Click on the Authentication menu button. Under Installable to click on the ‘Facebook Pages’ radio box and click Save.
4. You will be taken to your Application Dashboard page. Hit Back on your browser or click the ‘Edit Settings’ link in the Dashboard to get back to where you were.
5. Under the Profiles menu button enter a name for your Page tab and specify the tab url. It doesn’t matter what the tab URL so long as you don’t leave it blank. If you leave it blank no tab will show up when you add the Application to your page. There is a 16 character limit on the tab name. Hit Save.
6. Repeat Step 4.
7. Under the Canvas menu button enter a canvas page URL and a Canvas callback URL. The canvas callback URL is the address where your files are hosted. Ex. ‘http://www.mydomain.com/Page/Tab/index.html?’ Even if you are not passing parameters to your URL you must end the URL with a question mark. Hit Save.
8. Add the Application to your Page and you’re done.
An often overlooked feature of Facebook Pages is specifying which Page tab you wish to set as the landing page for a new visitor. By default a new visitor is sent to the Wall tab. However due to the large amount of spam on Facebook Pages you may wish to protect your page visitors by not exposing them to Wall spam. You can do this by changing the landing page tab.
Recently, an old page with a stable 80,000 fan base changed the landing page to the ‘Info’ tab and gained 800,000 new fans in a month. No FBML tricks were employed nor were users encouraged to suggest their friends. The preceding example demonstrates how the landing page tab can be an important factor for organic, viral page growth. So change your default landing Page tab.
Above: A screenshot of administrator permissions on a Facebook Page. You can change the permissions via a Settings link underneath the Page publisher.
The world of Facebook Pages is an exciting one right now. Business are starting to learn how to leverage their Pages and Facebook is fostering the Page ecosystem.
What is a good corporate Facebook Page?
At the very least a corporate Facebook Page should have a static FBML app and a custom landing Page tab specified. Facebook provides some applications for Page owners such as the Photos or Reviews applications. These apps barely scratch the surface of what’s possible on pages. Wildfireapp.com specializes in running promotional contests such as sweepstakes and giveaways for your Facebook Page. Wildfire could benefit from using viral tricks in their application. Facebook Page owners are using commands such as Stream.publish and share buttons in innovative ways to get new fans.
What does the future hold for Facebook Pages?
The next generation of Facebook Pages are going to use Applications to go viral. If Facebook scales down the permissions these Applications have on canvas Pages then expect the Page product to die off as most Pages will be traffic starved. However, if Facebook expands the robustness of what can happen on the Facebook canvas Page a new eco system will be created much like the one that exists in Facebook Applications. Judging from Facebook’s recent decisions to stop Application notifications, the Facebook Page eco-system might be the one that Facebook itself is trying to foster.
Webwhispers has a handy 8 step guide on how to create a Facebook Application to enhance a fan page tab. It’s clearly laid out for the casual reader.
Check out the tutorial here and select ‘How to integrate an external page into your tab’ from the dropdown. Advantages of using Page tabs built with Applications and not Static FBML include being able to use functions such as Stream.Publish as well as more complex functions available through the use of PHP etc.
Approximate time of setting up a Page from start to finish if you already have space on a webserver: 7 minutes.
