Contact Us - Phone Number

+44(0)77 677 270 61-

WebPlus tutorial: build a facebook fan page using WebPlus

Facebook fan page designWelcome to the WebPlus community to the third tutorial. Today I am going to show you how you can use WebPlus to design your own facebook fan page.

What this tutorial will not cover: “What is a facebook fan page and how I can create one?” I am not going to cover this topic since I supposed that most of you by now are familiar with the subject. However, you will be able to find the answer to this as well as other question by visiting the links below:

Facebook Pages: Creating, administering and editing your Page.
Start-Up: Create a facebook fan page

View demo site


The WebPlus Project

When creating your website you need to take into account ONLY the following 2 points:

1. Dimensions: One of the constrictions imposed by facebook for all of the fan pages owner is about the space available.

Since your page will be “framed” within the standard facebook site you only have a certain amount of space available for your site. The optimal dimension of your webPlus site therefore will be of 520 by 1000 pixels.

2. Only one page: remember, this is not about an entire website, but just a single page. Think of it as if you were building a brochure, a depliant or a flyer. Be brief and concise, and present your services or product in a clear way. That’s it, only one page to pass the message and invite your fans to visit your “real” platform (your website) where additional information can be found.


Integrate the page in facebook

This is perhaps the most challenging point. There are various facebook Apps that can be used to to achieve this. On this tutorial I am going to use the “Static Iframe TAB” app: all you need to do is to Install the page tab, instruct the application which page you want to install the application to and you are sorted.

Set up you page

By now you should have your WebPlus page ready. All you need to make sure now is that this page is available somewhere on the internet. I have installed my one in a sub-folder under the root of my website (i.e. public-html/facebook/index.html).

Once this is completed make sure you activate the application:

– Access you facebook fan page
– Select “Edit info from the top centre of the page (just below the name of the page)
– Select  “Apps from the left-hand side of the navigation
– Select “Edit settings for the Static Iframe Tab application and chose to add the application to you page:



Now you have to change the settings of the page. In order to do so go back to your fan page and select the tab name from the navigation on the left navigation (by default it’s name should be Welcome). Click on “Settings from the top righ-hand side of the tab:


At this point you should enter the section where you can set a bunch of options. The most important ones for now I would say are the following:


Url to you page: this is the location on your server where you WebPlus project is stored.

Hide scrollbars: if you have carefully designed you page to be 520×1000 pixels, in this case you don’t need the scrollbars to be enabled.

From the same interface you can set other options. For instance, you could choice to have an fixed image instead of iframed page, or you could even select to have multiple options for your visitors depending if whether they are already fans or not.

In my case I have opted for an url option since I run Google Analytics on my fan page therefore I am interested in knowing what people do once they land on my fan page.

Once you are happy with the final touches and configurations, you can Save and enjoy you first facebook fan page!

What else can you do?

There are two important things you can do after this:

Use a bepoke icon for you facebook fan page: You will be able to find this information from the page of the Static iframe TAB.

You could add other pages to it: This is very interesting since it allows fan page owners to increase the number of pages they can have under the same “fan page” account. Each bespoke page will be available as a separate link from the main left-hand side menu (in my case I have a welcome page in English and one in Italian).


This is very important. As a page owner you will required to agree with the terms and conditions set by facebook before you can create your own page. These are very important since they don’t only set rules for what can and cannot be published on facebook, but also set certain technical limitations.

So, please, before going ahead with this, make sure you are happy with the Terms of Usage.

Also, once you become a fan of a page the default page will be the standard facebook Wall. This is another of the functionality inforced by facebook. However you can set the default page for non-fan users from the setting of you page:

Edit Info> Manage Permissions> Default Landing Tab> Select the page name you have just created.



I really hope you found this tutorial interesting. I would like to know more about you projects so, please, feel free to become fan of atWebPresence on facebook and post there the url for your next fan page….I will be delighted to become your first fan!!!

Print Friendly

Leave a Reply