How to make your own simple Facebook App

Discussion in 'Social Media, SEO/SEM & Online Marketing' started by Lace, Sep 10, 2012.

  1. Lace

    Lace Retired Moderator

    Mar 21, 2011
    Ever since the launch of Timeline, Facebook tabs also known as landing pages have long gone. They have been replaced by Facebook Apps which allow brand pages to extend interactivity with followers. Some brands have intricate contest and quiz apps while some pages use apps to simply offer more information.

    So how can online wholesalers and retailers use Facebook apps? Here are some ideas:

    1. Make your product catalog more accessible – you can use Facebook apps as download link holders for users to easily access product info

    2. Offer promo codes to use in your ecommerce site

    3. Let users subscribe to your mailing list

    4. Run simple contests for your fans to win prizes

    5. Promote special and discounted offers

    If you have basic knowledge of HTML, you can potentially do these by yourself. Here’s how:

    1. Install the Static HTML: iframe tabs app on your page. This app sounds familiar because it’s the same app used to create Facebook landing pages before the Timeline was rolled out.

    2. Once installed, go to your page and look for the Welcome app to start editing.


    3. You are given a choice whether to make your app available to the public or to your fans alone. If for example, you want to publish a promo code then it’ll help to make it exclusive to your fans. This will provide a good incentive for other users to like your page.

    4. You can use HTML, CSS, and Javascript language. Some business pages simply upload a 760px image that contain promo codes, product information, etc.

    In that case, you can code it with a simple <img src= “link here”> tag and it will show up as a Facebook app. Here’s an example:


    P.S. I am sure you or your designer can do a much better job :)

    5. If you want to hold competitions and collect answers from your fans, you can always make use of online forms via Google Docs. The code is easily embeddable inside the Static HTML: iframe tabs.

    6. To make your very own Facebook app more visible, change the thumbnail image by clicking on the pencil icon atop your app. Click on ‘edit settings’ and then ‘change image’. You can also change the app name from the default ‘welcome’ via this route.


    Here’s how your final Facebook app can look like:

    Please let me know if this mini tutorial was helpful or, if you are an HTML expert and have useful codes for Facebook apps – please share them below :)
Back to top

Share This Page