The Facebook App and Pages


Prerequisites:

1) Install your Theme (tutorial here)

2) Create a Facebook Page (tutorial here)

 

New Facebook Mandated Security Requirements:

Please read the official announcement by Facebook: https://developers.facebook.com/docs/oauth2-https-migration/

The content you serve using any app (even from other providers) must be delivered from a secure server.

This means you need to get an SSL certificate on your hosting server where your content is being delivered from.

The App itself is hosted on a Secure Server by Expand2Web.

In response we create the following posts with more details on how to set up SSL:
http://www.expand2web.com/blog/facebook-page-ssl-wordpress/
http://www.expand2web.com/blog/facebook-page-tab-ssl-options/

 

—– Overview Video —–

Please use the video in “addition” to the Step by Step Guide below and not as replacement :-)

 

—– Step by Step Guide —–

Creating Facebook Ready WordPress Pages:

1) Log into WordPress.

2) Click on “Pages” -> “Add New”.

3) Enter your content as usual -consider the 520px width for Facebook when using images.

4) In the right sidebar of the WordPress Editor select your desired “Facebook Page Template”.
You have 3 choices A) Reveal Page B) Regular Facebook Page C) Facebook Page with Navigation menu.

WordPress Facebook Page Template

5) Publish your page and repeat steps 2-4 for addition pages if desired.

 

Hiding the Facebook Pages from your Main Website Menu:

1) Click “Appearance” -> “Menu”.

2) Create your “main” menu for your regular website – exclude all your Facebook page(s).

-New to the WordPress Menu Builder? Read and watch an Intro here

 

Optional: Creating a Menu for your Facebook Pages:

1) Click the “+” tab next to your main menu and create an additional menu called “Facebook” menu.

wordpress facebook page menu

2) Exclude all your regular pages.

3) If you want to do a Facebook Reveal page for Fans vs Non Fans- don’t include the reveal page in the menu.

 

Setting the Menu Theme Location:

1) Set the according Menu in the “Theme Locations” options and Save. (This steps gets often forgotten)

 

Preview Facebook Pages and get URL’s:

1) Click on “Pages” to preview your Facebook Homepage and Menu.

facebook fan pages with wordpress

2) Copy your URL for later use when configuring your Smallbiz Facebook App.

 

Connecting Your Page(s) to Facebook:

1) In WordPress – Click on “Appearance” -> “Smallbiz Options”.

2) Expand the “Facebook Page Setup” tab and click on the “App Link”.

3) Facebook will open in a new Window and you will greeted by the “Smallbiz WP Tabs App”.

4) Follow the onscreen instructions (click the “Add Tab” button and give permission to the App).

5) Step 5) Look for the SmallBiz App icon and click the “Welcome” tab.

welcome-tab-set-URL

6) Enter the URL(s) of your Facebook page.

You can use the URL’s as they appear in your browser bar or use your SSL URL’s

secure-facebook-app-links

Pro Tip:

Make sure you use (or create) a second personal Facebook profile for testing. Facebook Page Admins see different things compared to regular visitors.

 

_________________________________________________________________________

 

Question:

I need to change the Facebook Pages URL(s) after submitting

 

Answer:

Use the following link if you need to change your URL’s: https://apps.facebook.com/smallbiz-wp-tabs/

 

_________________________________________________________________________

 

Question:

I would like to set my Facebook Page as the “Default” page rather then the Facebook Wall.

 

Answer:

The new Facebook Timeline Page does not allow for any changes on what page is displayed – the Wall is always first.

 

_________________________________________________________________________

 

Question:

I would like to change the Facebook App image.

Answer:

edit-tab-icon

 

_________________________________________________________________________

 

Question:

I would like to show all my blog posts on my Facebook Page.

 

Answer:

You would actually not use our Facebook App, because Blog Posts display best on your “Facebook Wall”.

We highly recommend: http://twitterfeed.com/

Don’t let the name be misleading – they can also feed your Facebook.

Alternatively you can use dlvr.it and feedburner – here is how.

To get setup you need an RSS feed URL. Every WordPress blog has an RSS feed build in – here is how to get your feed URL

http://codex.wordpress.org/Wor…..ress_Feeds

 

_________________________________________________________________________

 

Important Facebook Security Update and Why your page may come up blank:

IF a Facebook User has https turned on in their Facebook Settings (meaning that their Facebook sessions are only over https) then the Facebook Page Tabs will not work, unless you are hosting the content on a server that has https enabled. Please contact your hosting provider on how to enable https.

To test your page without having your it hosted on a secure server do the follwing: Go to your FB Account settings (upper right) -> Account Security -> Uncheck “Secure Browsing”