Website Editing Guide

1. Start Here



2. Youtube Videos



3. Online Manual

Home -> Design -> Facebook Look & Feel
 

Facebook Look & Feel

This section allows you to create a version of your website that can be integrated with Facebook

The Facebook Look works the same as the Traditional Look, with a few exceptions

  • There is a limited amount of templates specifically formatted for facebook (CSS can be used to format the templates to resemble your main website)
  • Certain modules and functionalities will automatically be disabled in the Facebook version of your website
  • The Save/Load Template and Advanced Options buttons are disabled and these functions are not available in the Facebook Look
  • The Change Logo function allows limited functionality. You can only add or edit the Template Specific Logo
  • You cannot edit your Mobile Website Colours in your Facebook Look. This can only be done in the Traditional Look

When making changes to the content of your main website, the changes will automatically be transferred to your Facebook sitelet.

There are two main steps to this process.

  1. You need to create a facebook friendly version of the website in your Kwikwap Management Portal
  2. You need to activate and import this formatted website into your Facebook Business page

1. Create a  Facebook friendly version of your website

  • Use the Facebook Look to make changes to your current Facebook Sitelet
  • If you want your Facebook page to resemble the look of your Traditional page, you can use CSS to change the look of the available Facebook templates. When making changes in the CSS, please refrain from making changes to the width of the template. Your Facebook Look has to be a lot 'thinner' than your Traditional Look in order for it to 'fit' into Facebook properly.

2. Creating a Facebook Business Page

  1. Log into your personal profile on facebook
  2. While logged into your profile, go to the following url: https://www.facebook.com/pages/create.php
  3. Decide on the type of page you want to create and follow the on screen steps to complete the setup
  4. To learn more about facebook and Facebook Pages, go to this url: http://www.facebook.com/help/pages
3. Activate/Import your Kwikwap Facebook look into your Facebook Business page

To do this, you obviously need to have a Facebook Business page

  1. Log into your Facebook Profile and go to your Facebook Business page
  2. Enter the following into the search bar at the top of the page: Static HTML: iframe tabs. This will take you to the Static HTML facebook page. You can also use this link: https://www.facebook.com/apps/application.php?id=190322544333196
  3. Click on the button
  4. Use the dropdown to make sure you select your page name next to the 'Add this application to:' text
  5. Click on the button
  6. You will automatically be taken back to your Facebook Business page and the following link/picture will now appear in the middle the your page under your cover page:
  7. Click on the link to go to Static HTML setup page. You will see a page similar to the example on the right
    1. Click here to go to the FAQ & Help Center. Use this if you want to learn more about additional Static HTML functionality
    2. Click here to do any changes to suite your Facebook Sitelet e.g. changing of icon or removing sidebars
    3. Enter the following code into this text box:
      1. <html>
          <head>
          <meta http-equiv='Refresh'
                content='0; url=http://www.yoursite.co.za/fb_wmenu.php' />
          </head>
        </html>
      2. Replace the red text above with your own site url
    4. You can have different pages display for fans and non fans of your page. A tutorial that explains this in more detail will be added at a later stage. For now, just leave this area blank
    5. Click here to Save the changes made
    6. Click on Preview to see how the Facebook Sitelet looks. Just remember that only the person that is listed as the admin of the Facebook Business Page can see this Static HTML setup page, other people that click on Welcome will immediately go to the Facebook Sitelet.

  8. You can change the “Welcome” button’s wording to something to suite you Facebook Page better e.g. “Website” through the following steps:

    1. On  you Facebook Business Page, go to the Admin panel at the top, click on Manage and then Edit page

    2. On this new page you will see a lot of links on the left, click on

    3. On this page go to ‘Static HTML:iframe tabs’ application and click on edit setting, under the heading

    4. In this pop-up box type in the word to replace “Welcome” in the box were it says custom tab name

    5. Click save and okay, and return to you Facebook Business Page.



Facebook has a strong policy that you can't use autoplaying media (i.e. videos or sound files that play automatically when the tab is loaded). If your page has auto-playing files it may be shut down. 


4. Ask a Question