New iFrames Facebook Page App With Fan Gate Option – from Wildfire

The clock is ticking to March 11th, 2011 when Facebook will no longer allow the creation of new FBML custom tabs/apps. Users will need to switch to iFrames where you basically create your own app and host your own media that’s used to customize any pages. (Important note: any and all custom content you created with the Static FBML app up to and including March 10, WILL continue to be supported. You will not suddenly lose any custom content; you’ll still be able to edit the content, you just can’t add any new FBML “tabs.”)

For most small business owners, the switch to a more complex system where you create your own app might sound scary. However, your web design company can create any custom web page on your own website, skin it to no more than 520px wide, and that’s what you drop in to your iFrame app.

The ability to include some Facebook coding such as Fan Gate (also known as a Reveal Tab) can be tricky with iFrames. Fan Gate is where non-fans who visit your page see one form of content and when they click the Like button to join your Page, the content changes to something just for fans. This is a great feature for special offers, discount codes, free gifts, etc.

Good news: Wildfire to the rescue! Just this morning, Wildfire Interactive launched their super simple iFrames for Pages app. I just took it for a test run myself and was very impressed; in just a few easy steps your new tab can be live. You do need custom images and/or HTML though (same as before with Static FBML) – keep reading!

I was heartened to see, compared to many other apps, Wildfire’s Request for Permission is very light. They ask for access to the basics only – see screenshot below.

iframes permission

Wildfire iFrames for Pages Permission

(By comparison, see Dennis Yu‘s “Most Invasive App EVER” to get a sense of all that apps could ask you for permission to access. Don’t worry, clicking the link only shows you the Permissions screen – close the window or click Don’t Allow!)

Once you grant permission to iFrames for Pages, select the fan Page you wish to add the iFrames for Pages app:

add iframes to page

Select your Page to add IFrames

Now I did think this next step was savvy on Wildfire’s part – they ask for your contact information before you can proceed further:

Wildfire iFrames info page

After filling out this short form and agreeing to Wildfire’s terms and conditions, the next step is a simple dashboard with three choices.

  1. Fan Gate on or off. When “on” is checked, non-fans will see different content. When you check “off” the page will show the same content to both fans and non-fans:
  2. Fans view – where you can upload a custom image directly from your desktop and Wildfire will host it for you. Or if you select the Custom HTML option, you’ll see a small field to enter your code (ideally created in a WYSIWYG editor).
  3. Non-Fans view – ditto above! Use an image or HTML.
Wildfire iFrames edit

Wildfire iFrames for Pages Dashboard

Once you’ve inserted the content you want for Fans and Non-Fans, click the Save & Preview button. Voila!

The default name of the “tab” will be “Welcome.” To change the name of the tab to something else (now that Facebook allows renaming of third party apps!),  just click the Edit Page button at the top right of your fan Page > click Apps > go to the new iFrames for Pages app > click Edit Settings > type whatever you wish in the Custom Tab Name field > click Save then OK.

edit page settings iframes

Change the Custom Tab Name if you wish

This is very exciting! Many small businesses will be able to take advantage of this simple tool right away with very little technical knowledge.

See the app in action on my own Page here with my simple demo! Then go here to install the iFrames for Pages app.

To quote Wildfire:

The fan gate (when coupled with incentives like deals, contests and exclusive content) has been one of the most effective ways for Facebook page owners to grow their fans/likes. Facebook’s FBML fan gate functionality enables marketers to display one type of content to fans, and another type of content to non-fans, thus providing a great way for brands to encourage Facebook users to “like” a page (e.g. non fans might see a message such as ‘Like us to access exclusive content or a 50% off coupon”).

Wildfire’s iFrame application provides exactly the same kind of ‘fan gate’ functionality and the best part is that it’s easy to use and requires no technical expertise. Additionally, by using our iFrame app Wildfire takes care of hosting your content – something that Facebook used to handle via its FBML app but that companies must now handle themselves given Facebook’s change to iFrames for page tabs.

Apparently, Wildfire’s iFrame application will be FREE for the next three months. It’s not clear if you install the app now that you’ll be grandfathered in and be able to use the app free forever. Or, if Wildfire is planning to introduce a fee scale where free users will then need to pay to continue. I’m verifying this with Wildfire and will let you know!

UPDATE: Confirmed from Wildfire: any Facebook Page Admins who install the free iFrames for Pages app will indeed be grandfathered in at the free rate. So, this is great news. No need to worry if you’ve set up the app that you’ll then have to start paying for it down the road. Keep an eye on Wildfire’s developments though; I have a feeling this is just the tip of the iFrames iceberg. :)

From Wildfire:

[UPDATE: We're so glad you've been asking— for those who are wondering, all users who install the app while it's free will be grandfathered in when the app becomes paid, and will not have to pay then.]

Meantime, there are a plethora of custom Facebook Page app services out there who are offering all manner of templates and customization. See this post for ideas. I’ll be sure to review more as I can. Plus, hop over to my friend Tim Ware’s blog for great iFrame tutorials for the DIY peeps!

Let me know if you try the new iFrames for Pages app, or if you’ve integrated other solutions. I’d love to know!

  • Anonymous

    If you have a WordPress blog it couldn’t be easier to create Facebook tabs using the
    Facebook Tab Manager plug-in. Some of the information you want to include may already be on your blog. So if you want the same About page as your blog go in and edit the page or post switch to HTML by clicking the tab, select all and copy. Then go to a new Facebook tab within WordPress make sure you click the HTML tab and paste the info in. Then follow the easy steps to add it to Facebook. This is a great way to keep your brand image consistent. A great inexpensive option for a small business. ~Pam

  • http://www.facebook.com/profile.php?id=623646218 Shih-Wen Su

    fPage does the same thing, and much easier

    http://www.facebook.com/apps/application.php?id=160886077315066

  • http://www.facebook.com/people/Jacob-Puhl/100000160069292 Jacob Puhl

     Hello Mari,

    I’ve installed your app on one of my fan page, but has some problem with like. After a non fan clicks on like button it’s redirecting to wall, instead of preventing the same welcome(I renamed it to ‘reveal-coupon’) tab to reveal the content. I’ve also set ‘reveal-coupon’ tab as a default landing tab.
    Here is my page http://www.facebook.com/pages/Postal-Uniform-Xpress/184509704921785

    However your app works like a charm on another test page which I’ve created.

    http://www.facebook.com/pages/Test-page/294897333857642

    Having tough time in resolving this, please let me know what went wrong with only this page.

    Thanks
    Jake

  • http://pholiofy.com Lisa

    Hi Mari – we just launched a SaaS product that does a similar thing but easier (we think) and the back end is all WordPress. http://pholiofy.com is the Facebook Pages Publishing Platform. It lets you create fan gates and reveal pages, embed video and twitter feeds – we host it, secure with with SSL and give you an app to publish your content to your Facebook Page. We think it’s both great and easy.

  • David Miller

    Hi Mari

    Great article! We just launched our Facebook Pages Publishing Platform similar to this – but doesn’t require ANY information of yours. You get your hosting, SSL, the Facebook app, fan gate etc – and we did it all on WordPress. http://pholiofy.com

    I am open to get some feedback! Try it out.

  • Michele Locker

    hi mari, great review. i learned so much especially about fan gating. i had no idea! if you’re researching custom apps, you might want to check out what bulbstorm is doing, all full service. great if you know what you want but have few resources to execute.

  • Stacy Kvernmo

    Im having this exact same problem. I have Fan Gate turned On and it is the landing page tab set in manage permissions. Not sure why it redirects to the wall once someone has liked it instead of my reveal tab :(

  • Stacy Kvernmo

    ah ah! I figured it out. http://bugs.developers.facebook.net/show_bug.cgi?id=20532 — ever since FaceBook added their recommend this page to a friend box that appears when you like it, this behavior broke the typical fan gate redirection. I am using http://apps.facebook.com/iframehost/ instead and I believe it is now working. Still testing it.

  • http://www.facebook.com/people/Jacob-Puhl/100000160069292 Jacob Puhl

    thanks a ton Stacy :) though I figured out that its bug from facebook, I searched like hell for the solution. Even after posting it in facebook dev support forums I did not get any answer. So I kept this aside for the past one month. You like a savior came and helped me to resolve this. Once again thanks a bunch :) :) :)

  • Facebooker

    Just installed this app and went through the motions until I got to then end setup. Please note: Scripts, Forms, iFrames, and external CSS are not allowed. IFRAMES NOT ALLOWED?! Maybe I’m out of line, but that seems ridiculous considering it’s called the iFrames app.

  • Micha

    Superrrrr :)

  • http://www.buyecloth.com buy_e-cloth®

    Bless you for posting this – what a nice, clean little app. Works like a charm. Many thanks, Mari.

  • http://twitter.com/MetroFax MetroFax

    Can you run a contest through Facebook iFrames? Or using Woobox’s Static HTML iFrames? I would think yes so long as you create your own HTML… Anyone know for sure?

  • Gowmukhi

    Hi, the non-fans still can click the wall tab and see the wall. Is there any way to totally restrict them from seeing the wall unless they become fans?

  • Paul Schell

    Very helpful. Thanks.

  • Canis

    Hi, can i know how to create a page that allows people to like my page first before viewing any content?

  • http://www.atomicdc.com/ Dallas Email Marketing

    Mari, thanks for the great article. I also wrote a blog on creating a fan gate but is aimed for people that are doing their own using ASP code. Felt like it may be worth sharing in case people were looking to do their own hosted solution outside of something like Wildfire or some of the others… Keep the great content coming! Here is a link to the Classic ASP code version for creating a fangate:  http://www.atomicdc.com/blog/facebook-iframe-fangate-asp-code.html

  • http://www.volvant.com/ Margaret Esme

    Thanks for sharing this informative article.:)

  • mike lee

    I’m having a problem setting up fan gate so that one has to like the page to access content. If I turn it on I past content a into non fans page box then content b info fans box right

  • http://www.skiggle.com.au/ Skiggle

    We built this one at Skggle and it’s a winner: http://skggle.com/. You don’t need to sign-up, no HTML and you can make it so when you click the image, it’ll go to your home page or wall.

  • http://www.carrotmedia.com/services/facebook-app-development facebook application

    i am having problem to have like page.
    how can i ?

  • http://pimpmyfans.com/ get facebook fans

    The most important feature of having a Facebook Fan Page is to advertise the company’s products or services. It is a great tool which can be used in an engaging way to attract potential customers. It will make sure that there is a prominent increase in the traffic leading to your website. This will in turn ensure that there is increase in sales.

  • Pingback: Mari Smith's Mega List of Facebook Business Resources | DarcelDobbins.com

  • Albert Arens

    you should check out this one for sure; The best mobile coupon app out there, is qr2coupon. When
    advertising loads the gun, this coupon app pulls the
    trigger. Imagine creating mobile
    coupons within a matter of minutes. Digitizing and mobilizing coupons,
    delivering your specials to your customers via Facebook,
    via in-store QR
    Code Signs and via Narrow Casting. Okay, it is NO APP„ http://www.qr2coupon.net