Embedding a Widget on Facebook

All What's On, Where to Go, Visitor Information and Brochure Rack Widgets can now be easily embedded onto any business Facebook page, simply follow the guide below to do so.

You will need;

  • Administrative rights to the Facebook page you wish to put the Widget on.

  • The iframe embed code for the Widget, found in the Widget Factory (Note: The block quote code will not work, it must be the iframe code).

Embedding a Widget;

Static HTML.png
  1. Go to https://apps.facebook.com/static_html_plus/ and click on the big green button that says ‘Add Static HTML to a Page'.

  2. Select the page you wish to embed the Widget on from the drop down menu, and click ‘create tab’.

  3. This will take you to the newly created tab on your Facebook page. Click on the green button that says ‘Set up tab’.

  4. This is where you will need the embed code for the Widget. In the text area, delete all of the existing text and paste in the embed code. (TIP: if the right-click menu doesn’t work, press ctrl + v on a PC or cmd + v on a Mac to paste).

  5. The new tab will be called ‘Welcome’ by default. To change this click on ‘Actions’ and then ‘Edit name and image’. Type the desired tab name in the box (for example; What’s On Guide or Visitor Information Centre) and click ‘Save tab name’

  6. Finally, click the blue button that says ‘Save & Publish’

FACEBOOK EMBED.png

The Widget will now be live on your Facebook page.

 

To add another Widget

Once you’ve added one Widget, the process to add more is slightly different.

  1. On your Facebook page, go to the tab that already has a Widget on, click on the green button above the Widget called ‘Edit tab’. This will show you the existing code. Don’t edit it!

  2. To add a new Widget, click on ‘Actions’ and then ‘Add or remove tabs’.

  3. In the ‘Tab name’ box, type in the name you want. You can ignore the other options in this section and click ‘Add tab now’, and then ‘Go to tab’.

  4. This will take you to the new tab, and now you can embed the Widget the same way as before. Click on the green button that says ‘Set up tab’, replace the text with the embed code and click ‘Save & Publish’.