Well, I asked a while back if any of you had an interest in knowing how I went about making my facebook welcome tab and there was a decent amount of response. So here I am :)
The other thing you should know is that you can google ‘how to create a facebook landing page’ or similar and get tons of different tutorial options. But this post is also for me to learn how to create a tutorial! (Aren’t I evil?)
If you know about facebook applications, the developer section, and FBML this will be old news to you. The tutorial that follows is meant to help out those who have a Facebook page but haven’t gone past the average post and ‘add profile image’ steps.
How to Create a Facebook Welcome Tab
You will need:
Adobe Photoshop (or similar)
Facebook Page (used to be known as ‘fan’ page)
There are essentially three parts to setting up a Facebook Welcome tab and they are as follows:
- You need to create the page (a jpeg file, something you create in Photoshop)
- You need to know how to add the page via FBML
- You need to know how to set the welcome tab as the default
Creating the Page
For the page itself, I used photoshop and used elements that I used to create my blog. I’m not sure how many of you run your own blogs, but everything on mine is done ‘in house’. If I don’t know how to do it, my blog doesn’t have it. So, for instance, my banner:
is a good graphic to use. And its already pre-made, so its quick to add to the page.
I’m not going to go into how to use photoshop, there are plenty of instruction video’s out there and I don’t want to bore the average user. But, just to give you an idea, here is a quick video showing how I constructed the page in Photoshop.
Here are some tips to keep in mind:
- The easiest format to work with is a .jpeg file. So even as you create a .psd file from photoshop, be sure to save it as a .jpeg before uploading.
- Use graphic reinforcement. Notice that I used the ‘like’ image just as it would appear above this welcome page. It just makes it easier for people to find the button.
- Before you can move onto the next step, you will need to host your .jpeg file somewhere. I have a directory through my host provider where I upload files as I need them. You can use any photo uploader program as long as it provides you with a URL for the photo (and without changing pixels or photo properties.) Although I don’t use it, I’ve heard Imageshack it a free online option for media hosting.
- IMPORTANT: On August 23, Facebook will be making a few changes to its layout so that its more uniform throughout. I’m personally bummed about the change, but you’ve got to roll with the punches! Any custom tabs you create can now only be 520 pixels wide. The length is up to you. (Before this, it was approximately 800 pixels of width space.) Boxes will also be removed.
Adding it to Facebook
Okay, so now you have an awesome looking graphic page. Now what? Adding it to Facebook does take a couple steps, but I’ll walk you through those as well. First I’m going to list the steps and then I’ll have a video that shows me taking the steps.
1) Open up the Static FMBL Application Page
2) Select ‘Add to my Page’ (a pop up window will appear, select the page you are working on). Leave the application page.
3) Sign in to your facebook page. Underneath your profile photo, select ‘Edit Page’.
4) Scroll down until you see FBML. Select it. Add Welcome to the first line. Next, you’ll want to use this HTML code in the larger form field: <img src=”your photos URL”/>. Between the ” “s, add the URL of the image that you created. Scroll down and hit Save.
Here’s a video showing those steps: (sorry it’s so small!)
Making the Welcome Tab the default (for new visitors):
The last step is the easiest but it can also be the most important. You’ll be setting the default landing page for new visitors as the Welcome Tab. It’s a smart move to make because the average user will think to hit the ‘Like’ button which automatically takes them to your page wall.
1) Sign in to your facebook page. Underneath your profile photo, select ‘Edit Page’.
2) Scroll down to where it says Wall Settings, select ‘Edit’.
3) Where is says ‘Default Landing Page for Everyone Else’, select ‘Welcome’.
That’s it! Here’s me taking those steps:
And there you have it. Although you can also create applications to go on your welcome tab, this is an easy and simple way for those of us who aren’t developers to still have a nice added feature to our Facebook page.
I hope this has been helpful for at least some of you; any feedback is appreciated :)