Saturday, August 21, 2010

How To Make A Custom Facebook Welcome Page

Ok, so you want to make a Free custom landing page for your Facebook fan site, huh?

Well, here are a few prerequisites:


  • You know at least a little bit of basic HTML/CSS

  • You have access to some sort of image editing program (ie photoshop)

  • You have your own webhosting account, or other place from which you can link to images

  • You're a somewhat creative person with a bit of extra time on his/her hands



Even if that description above doesn't sound like you, all is not lost. There are some pretty cool Facebook page builders starting to pop up. Something like pagemodo.com looks like it's probably a great solution for most people ... I was actually going to use it build my page ... but then I remembered that I'm way more adventurous than that! :-D


So for any brave souls who didn't click the pagemodo link, and are still reading this ...

Here are some step by step directions for how I built my first custom facebook fan page


  1. Go into the "edit" section of your page, and create an FBML tab


  2. Click on "edit" the FBML and you will be brought to a box where you can enter a title for your box, and some code to show up on your welcome screen


  3. You can add some CSS and even "old school" HTML (the template I "cheated" off of used tables) to give your page some structure. For some strange reason I was always under the impression that FBML was something new I'd have to learn (and for more advanced stuff it is) ... if I had known that I could make a basic page using just the HTML that I already understand, I would have done so long ago.


  4. I used images (which I created in photoshop, and uploaded to my web hosting account) for my page's header and footer. The important thing to remember here is that (as of tomorrow), your entire box can only be 520 pixels wide ... so that's the width that you should make your header and footer images. This the part of the project that probably requires the most "technical" skills. If you're not a photoshop person, it's not terribly hard to find someone on the Internet who can make these images for you ... if you're reading this post, and you need help, you can even hit me up if you'd like .. no guantees, but it's possible we may be able to work something out.


  5. The last step, after you get your page looking like you want it, is to go into your "wall settings" and use your drop down menu to make your new tab the "default landing tab for everyone else".



And that's it. Now obviously, there are a lot more cool things that you an do with these landing pages; especially if you want to get into the actual FBML code (which really doesn't look all that complicated) .. but just a basic landing page should be doable for most even moderately technically inclined people.

Oh yea, and for those who really want to take the easy way out, and just have a snazzy looking "welcome" tab (but with not additional functionality) you can just create a single image say 520px wide, by 800px high ... it could even include a screen capture of your blog or website.

I guess my main point of this whole article, is that it's not nearly as hard as it seems to be!

Til next time ...
[todd-sig]

p.s. sorry it took me so long to get this "tutorial" published .. I actually started on it almost 2 weeks ago, right after I made that black hoodie page .. but then, as it wont to happen from time to time, I got caught up in other projects .. anyhow, it's here now .. I hope you find it helpful. ;-)

4 comments:

  1. I never actually knew that we could do this on FB. I am familiar with HTML and CSS - the basic stuff at least - so will be definitely giving this a go! Thanks for your clear instructions!! Really informative and useful!

    ReplyDelete
  2. Thanks, FB does a terrible job of explaining how to do this. I'm still trying to figure out how to post as a fan page!

    ReplyDelete
  3. Good to see you've finally got this step by step tutorial posted Todd. Give me a few weeks when I, hopefully, will have some spare time on my hands and I will give it a go.

    Once it's up I'll come back to show you the fruits of my labor. Reckon you're hoping those instructions are good enough for this old Aussie to understand ;)

    ReplyDelete
  4. Thanks for tutorial. It is one thing to do on my agenda. Did you created your FB page as community page or as official page?

    ReplyDelete