19
Create Facebook Pages the Smart Way Dr. Eckard Ritter internet partnership, Nuremberg, Germany April 22, 2011

Create Facebook Pages

Embed Size (px)

DESCRIPTION

It is now easier than ever to add the content of any web page to your Facebook Page by making it a tab on this page. Once you’ve created a website with xsMobi, you ALREADY HAVE a tab version of the content for your Facebook page! This tutorial shows how website content can be integrated into Facebook. It takes only a few minutes.

Citation preview

Page 1: Create Facebook Pages

Create Facebook Pages the Smart WayDr. Eckard Ritterinternet partnership, Nuremberg, GermanyApril 22, 2011

Page 2: Create Facebook Pages

In March 2011, Facebook migrated to a new page design which supports a new way to publish content on Facebook Pages.

It is now easier than ever and more straightforward to add the content of any web page to your Facebook Page by making it a tab on this page.

This was also possible with the old system (“static FBML”), but by using copy and paste — not very attractive and certainly not the “Web 2.0 way” to share content in real time! Now external content is integrated into Facebook with “IFrames”, which allows for much more flexibility.

This is good news for users of xsMobi, the “Mobile Website Builder”: once they’ve created a website, users ALREADY HAVE a tab version of the content for their Facebook page!

This tutorial shows how website content can be integrated into Facebook. It takes only a few minutes.

Prerequisites: A website built with xsMobi A verified Facebook account and a Facebook Page A 16x16 px favicon plus a square-shaped logo

Page 3: Create Facebook Pages

Content source: a specially formatted version of an xsMobi site adapted to fit into a Facebook Page Tab (500 px width). Sample page: the xsMobi manual, which is called “cutesite” (for historic reasons: “cutesite” is the former name of xsMobi). It is a mobile website. We see the PC format, of course, but it will become a tab within xsMobi’s Facebook page.

Page 4: Create Facebook Pages

Let's begin the process of getting this page — which represents a complete site with multiple pages — into a Facebook Page Tab.

Note: we are not learning how to create a Facebook Page (at this stage you should already have one). This tutorial shows how to add a Facebook Page Tab to your existing Facebook Page. A page can have multiple tabs.

To turn any web content into a tab on a Facebook Page, you simply create a Facebook application. Sound complicated? It’s not. It is simply the way to get content into Facebook.

Page 5: Create Facebook Pages

Go to facebook.com/developers to set up a new app

Note: your Facebook account must already be verified using a mobile phone (SMS) or credit card. Otherwise it will not be possible to create a new application.

Click on Set Up New App

Page 6: Create Facebook Pages

Enter an application name, agree to the Facebook terms

Click on Create App

After you submit the form, a standard security check appears.

Enter the text which appears in the box and submit

Page 7: Create Facebook Pages

Edit your application - Step 1 of 3: About

Add a description, upload an icon (16x16 px) and a logo:

Click on Save Changes

Page 8: Create Facebook Pages

After saving the About data, proceed to Website

To edit the Website information, go to Edit Settings. This will take you back to About. Just navigate straight to the second item, Website.

Page 9: Create Facebook Pages

Edit your Application - Step 2 of 3: Website

This is quick and painless: just enter the URL of the web page to be integrated.

For our sample application, the site URL is

http://ipartnership.de/facebook/cutesite/

Replace “cutesite” with the name of your application.

Note: a folder named “cutesite” must exist. (During the introductory period which ends in May 2011, this requires an invitation; afterward it can be done easily from the xsMobi menu).

Page 10: Create Facebook Pages

After successfully saving the Website information, proceed to Facebook Integration

As before: to edit Facebook integration data, go to Edit Settings. This will take you back to About. Just navigate straight to the third item, Facebook Integration.

Page 11: Create Facebook Pages

Edit your application - Step 3 of 3: Facebook Integration

Canvas Page: enter the application's name (you could probably use an alternative name, but let's keep things easy).

Canvas URL: the URL of your xsMobi page, as before. Social Discovery: select “Disabled”. Tab Name: the link which appears on your Facebook

page once the application is integrated. Here we are naming the tab “HowTo”.

Tab URL: same as the Canvas URL, but with “index.cfm” added at the end.

Page 12: Create Facebook Pages

When you have finished editing the application, go to the Application Profile page:

What is the “Application Profile” page? The app is ready, but you still have to decide where you want to use it, especially if you administer multiple pages. On the profile page you will select which pages will have the application as a tab.

Page 13: Create Facebook Pages

The Application Profile page for our “cutesite” application

Click on Add to My Page

At this stage there is nothing more to be done with the application profile. You can leave the other settings for later.

You will now be taken to a menu where you can select which of your pages you want to work with the application. Even if you only have one page, you still need to select it.

Page 14: Create Facebook Pages

Add the Application to a Page

In this example we are adding the application to the “Mobile Website Builder” page. This makes sense as the content of the “cutesite” app is the little “How To” guide for using the xsMobi site creator.

Remember: when we did the Facebook Integration, we called the Tab Name “HowTo”.

Now let's go to our Mobile Website Builder Facebook pagefacebook.com/mobihexer

(“mobihexer”™ is the German brand name for xsMobi.)

Page 15: Create Facebook Pages

Mobile Website Builder Facebook Page with “How To” tab

Let's see how it looks like: click on HowTo

Page 16: Create Facebook Pages

xsMobi – Mobile Site Builder Tutorial – Integrated

The active HowTo tab (on.fb.me/xsmobi-tutorial) is highlighted and the tab name appears next to the header.

Page 17: Create Facebook Pages

Comparison between old and new versions of Facebook Pages tabs

As you see, there is another tab named “HowTo” (the tabs have been rearranged: you can edit their order in the navigation menu). The old “HowTo” document holds exactly the same content. However it was created with static FBML, which is now obsolete.

The new kind of Facebook page allows for more flexibility with styles: it is easier to use sophisticated and unusual looks. Plus, the new “HowTo” page tab features a Google map. This was not so easy to do with the old version.

To take this a step further, all kind of widgets, such as photo galleries and YouTube videos, can be integrated into the new Facebook pages. You no longer need additional Facebook apps!

Page 18: Create Facebook Pages

Conclusions and Suggestions on How to Maximize Benefits

Note that the advantages of building websites with xsMobi, the “Mobile Website Builder” are not the same as they were three years ago. Mobile devices have changed a lot since back in 2008, when xsMobi (aka Mobihexer ™ in Germany) was developed. Today, the “OnePageView”, i.e. full-screen format for PC browsers, has become important for three reasons:

Content is still “mobile ok”, or “dotmobi compliant”. Visitors like it because they can see the whole website on one

page. Page owners like it for its features and because it is very search

engine-friendly, providing optimal “follow” links to their homepages.

Having built a website with xsMobi, you are only a few minutes away from publishing the same content on Facebook by integrating the website as a page tab.

One major advantage over other Facebook Page tab design tools is that you reuse content. You have all the benefits of a search engine-friendly website with xsMobi, plus all the content is shared on Facebook.

Other Facebook page builders also let you edit the content anytime; however, the content is only on Facebook and nowhere else. What’s more, most systems have no RSS for sharing content. With xsMobi you automatically have two publishing channels: Facebook and the web. Plus xsMobi provides an RSS format that lets you share your content on any other site!

Think of a Facebook page as a website with the tabs as links to pages. Around seven to nine tabs will be displayed above the fold. Consider creating multiple tabs ... or think about using a tab (e.g. “contact us”) for multiple pages if you have more than one!

You don’t have an xsMobi website yet? Get one for free: www.xsmobi.com

Page 19: Create Facebook Pages

About us

internet partnership, based in Nuremberg, Germany, helps hotels and tourism organizations get found more easily on the web and reach a global audience.

Dr. Eckard Ritter, founder and CEO of internet partnership and champion of German travel & tourism promotion through the internet, has more than 16 years experience as an entrepreneur, technology expert and inventor. He has developed several tourism sites for German and European destinations, booking systems and online site builders for mobile and desktop formats.

New in 2011: TouristInfo 2.0 (http://touristinfo.ning.com)A Social Network for Travelers and Tourism Professionals

touristinfo urlaub.in.deutschland mobihexer touristinfo urlaub99euro mobihexer touristinfo touristinfo TouristInfo 2.0 deutschlandurlaub touristinfo touristinfo

urlaub99euro.de Dr. Eckard Ritter Urlaub in Deutschland internet partnership urlaub99euro touristinfo internet partnership mobihexer touristinfo mobihexer.de mobihexer.de/blog xsmobi.com

internet partnership, Dr. Eckard RitterAdam-Klein-Str. 158, D-90431 Nuremberg, Germanywww.ipartnership.de