Create a Facebook Landing Page Using iFrames

April 13th 2011 / 2 minutes to read


Facebook decided to up and change just about EVERYTHING when it came to fan pages so here is a NEW hardcore awesome tutorial on how to create a fabulous landing page, like I have on OSN’s FB fan page!

I am going to assume you already have a facebook fan page (and you really should go and make a vanity URL, just make sure 25 people are “liking” you first!).

How to add the Static HTML: iFrame Tabs application to your page

  • Make sure you are logged into facebook.
  • Go to the Static HTML: iFrame Tabs page.
  • Click “Add to my Page”
  • A lovely window should pop up with all the pages you are an Admin of. Click “Add to Page” next to the page you want to make awesome.

Customize the New Welcome Tab

  • Now go back to your fan page and click the Welcome “tab” on the left sidebar.
  • The great thing is that you can now use javascript, link to an outside page, and more by using the iFrames protocol.
  • Put your glorious XHTML or whatever you want into the top box and leave the bottom box blank.
  • Now we want this to be our landing page for non-fans. So go back to your fan page and click “Edit Page”.

I know it looks like a lot of steps but really, it’s quite easy! The hard part is figuring out what you WANT on your landing page!

To help, here’s mine up for grabs! Download my FB Landing Page!

Now, in the comments, share YOUR Facebook Fan Page! Landing page or not, I want to become YOUR fan as well!

If you have any questions, need help, whatever it may be, feel free to ask!

This post is over a year old which means the content may be outdated or no longer accurate.


Likes Instant Messaging by fLaMEd.

View All Notes



Thank You!! I just created a fan page for my photography, and I’m working on getting more “Likes.” Can I do ANY of this without at least 25 likes?

OHH link me to your fan page. You only need the 25 “likes” for the vanity URL.

It’s literally JUST getting off the ground, but I hope my little baby will grow!

Oops, you lost me at “the great things is that you can now use javascript….” LOL. Those words are “scary”!

LOL I know more PHP than I do java-ANYTHING however at the core of it, before FB didn’t allow it, now they do. Which is neat. If you ever wanted to learn more about it / use it anyway LOL!


woo! I was wondering what you had to do to make a FB Landing Page… now I know! Off to make mah own! :D

Reply to Jenny

Link back here so we can like it!


Great tutorial, Sarah! I still have yet to create a landing page. As you said, the figuring out what should go there is the hardest part and is stumping me. Maybe I’ll use your template. :)

Reply to Lynda

Love your landing page!


Thanks for the tutorial!

I wanted to make a landing page for my blog on Facebook but I’m afraid I wouldn’t have enough followers. (Still working on the following thing though.)

Either way, this might come in handy. :)

Reply to Marie-Anne

thanks for this! This is probably step 2, but I can’t seem to get the “home” page to be the landing page for existing groupies. Is there a secret to this?

Explain? Are you wanting the landing page to be the first page EVERYONE sees or just non-fans?

I want two separate ones – and I’m just having a hard time seeing the one I did for Fans – not sure if I didn’t do it right or I can’t see it because I’m an admin.

Try a different browser while logged out of FB? That’s what I do or use private browsing feature on Firefox to see what “non-fans” would see. If you mean you created a FAN landing page, then when you save it, it should show you an option to “see” what fans would see.

PSHH even one follower is a good start!


Thanks for such an awesome tutorial. I just might have to finally follow it make myself a landing page.

Reply to Sharon

YAY when you do, link it back here so we can like it!


thank you for this tutorial (and for the old one!) i’m trying to figure out what the heck to put on my landing page but since you said to share, here’s mine: no vanity url yet :( i don’t have enough fans…

Reply to nimil

I suggest a bit about yourself, what you use your FB fan page for, and links to your twitter/website.


Question? What if you only want your landing page to be visible to non-fans and you want your “wall” to be visible to existing fans (versus another landing page). How do I do that? Thanks!

Reply to Angela

Doing the last step DOES that. It will only show the Welcome tab to non-fans and by default, show the wall to existing fans.


Thank you so much Sarah. I guess I need to pay better attention to what I’m reading-DOH!

Reply to Angela
Balanced Melting Pot

Okay, the hardest part for me is the HTML that goes in there. I tried copying code from my blog (you customized it for me) and it doesn’t seem to work. Do you have to create it from scratch?

Reply to Balanced Melting Pot

No, you can copy and paste from other sources.

What do you mean though about it not working, does it give an error, not look right, give a blank page?

Balanced Melting Pot

Never mind :-) I played around with it some more and got it to work. Thanks a bunch. My page is here

Reply to Balanced Melting Pot

I finally had decided to make a landing page for my blog! ♥ Yayy… Thanks to you! ;) I downloaded your code and edited it.. ;) Thanks Sarah~

Reply to arvee


Amanda Jillian

Check out my fan page, it’s kind of a thrown together landing page for now, just trying to figure out the coding.

Reply to Amanda Jillian

Leave a Comment

Thank you for your comment!
Please Read the Comment Policy.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

To respond via your own website, enter the URL of your response which should contain a link to this post's permalink URL.
Your response will then appear on this post.