“Facebook All-In-One” Documentation by “TivaTheme” v1.0

Facebook All-In-One

Created: 14/12/2019
By: TivaTheme
Email: tivatheme@cloodo.com

Thank you for purchasing my product. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!

Overview
System Requirements
Installation
Usage

A) Overview - top

Facebook is one of the best and biggest social media platform, millions of people are on Facebook now. It is the greatest way to connect with your friends and customers. It's easy and free!

Facebook All-In-One is the ultimate and most advanced script to integrate Facebook content into your PHP website. With this script, you can display the Facebook Events, Facebook Feed (Post, Photos, Albums, Videos), Facebook Messenger and Facebook Likebox on your web. So it will help you to increase the audience of Facebook page and the number of sales.

B) System Requirements - top

Your website must have SSL certificate (https).
You must have admin permission with Facebook page from which you want to display events.
Your Facebook page and events must be public.

This product is compatible with :

PHP : > 5.2.0

Compatible Browsers :

IE10, IE11
Firefox
Safari
Opera
Chrome
Edge

C) Installation - top

Step 1: Firstly, you need create Facebook application on https://developers.facebook.com. You can refer how to do it here: https://developers.facebook.com/docs/apps/register/. Your Facebook application must be on status In Development. Remember the ID and Secret of application.

Step 2: Upload script package (facebook-all-in-one.zip) to your host, then extract it.

Step 3: Create new MySQL database, then import file : config/database.sql.

Step 4: Open file config/database.php, then edit the config info to connect to the database which you have created (host, database, username, password).

Step 5: Go to the admin site:

Url: http://yourdomain/facebook-all-in-one/admin
User: admin
Pass: admin

On Facebook Connection configuration, enter the ID and Secret of your Facebook Application (Step 1), then click Save button to save the info of your app. Then copy the link on the browser (see below image). Note: Your website must run on https (SSL certificate).

Step 6: Go to your Facebook Application again, then create new Product with type Facebook Login.

Step 7: On the settings of product, enter the link which you have copied from Step 5 on the Valid OAuth Redirect URIs.

Step 8: Go to the Facebook Application on admin again, then click Login with Facebook button. Then give the permission for application to access the info of your pages.

If the process is successful, you will see your Avatar, User ID, Access Token and all the Facebook pages which you manage. Select the Facebook page from which you want to display events. Then click Save button.

D) Usage - top

1. Backend

Go to Settings to set configuration for Facebook Events Calendar, Facebook Feed, Facebook Messenger, Facebook Likebox.

Facebook Events Calendar

Layout: Layout of calendar. There are 2 options: Full and Compact.
Year Range: Range of year to get the events. For example: If Year Range is 2, current year is 2019, the events will be got from 2017 - 2021.
Initial View: Initial view of calendar. There are 2 options: Calendar and List.
Start Date: Start date on calendar. There are 2 options: Sunday and Monday.
Switch Button: Show or hide switch Calendar/List button. There are 2 options: Show and Hide.
Events List Count: Number events which are shown on list view.
Events List Filter: Time filter for events which are shown on list view. There are 3 options: All Events, Upcoming Events and Past Events.
Events List Filter Title: Show or hide title on list view. There are 2 options: Show and Hide.
Time Format: Time format. There are 2 options: 12 and 24.
Date Format: Date format. Refer the format characters here.

Facebook Feed

Year Range: Range of year to get feed content. For example: If Year Range is 2, current year is 2019, the feed will be got from 2017 - 2021.
Initial View: Initial view of feed. There are 4 options: Post, Photo, Album and Video.
Switch Button: Show or hide switch button. There are 2 options: Show and Hide.
Read More button: Show or hide Read More button. There are 2 options: Show and Hide.
Number of items: Number items which are shown on feed.
Date Format: Date format. Refer the format characters here.

Facebook Messenger

Language: Language for the Messenger.
Hide on mobile: Hide Messenger on Mobile or not. There are 2 options: Yes and No.
Position on the page: Position of Messenger on website. There are 3 options: Left, Right and Center.
Greeting text: Greeting text on the Messenger.

Facebook Likebox

Language: Language for the Likebox.
Hide on mobile: Hide Likebox on Mobile or not. There are 2 options: Yes and No.
Width (px): Width of Likebox.
Height (px): Height of Likebox.
Content: Content displayed on the Likebox. There are 3 checkboxs: Timeline, Events and Messages.
Position on the page: Position of Likebox on website. There are 3 options: Left, Right and Popup.

2. Frontend

To use the script, firstly include component php files:

include_once('component-events-calendar.php');
include_once('component-feed.php');
include_once('component-messenger.php');
include_once('component-likebox.php');

Then include some CSS and JS files. If your website has already bootstrap, font-awesome, jquery, magnific-popup, imagesloaded, masonry don't need include them.

<link rel="stylesheet" href="assets/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/font-awesome.min.css">
<link rel="stylesheet" href="assets/css/magnific-popup.css">
<link rel="stylesheet" href="assets/css/main.css">


<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.magnific-popup.js"></script>
<script src="assets/js/mediaelement.min.js"></script>
<script src="assets/js/imagesloaded.pkgd.min.js"></script>
<script src="assets/js/masonry.pkgd.min.js"></script>
<script src="assets/languages/lang.js"></script>
<script src="assets/js/calendar.js"></script>
<script src="assets/js/main.js"></script>

To display Facebook Events Calendar, call function:

tiva_facebook_events_calendar();

To display Facebook Feed, call function:

tiva_facebook_feed();

To display Facebook Messenger, call function:

tiva_facebook_messenger();

To display Facebook Likebox, call function:

tiva_facebook_likebox();

Once again, thank you so much for purchasing this product. As I said at the beginning, I'd be glad to help you if you have any questions relating to this product. No guarantees, but I'll do my best to assist. If you have a more general question relating to the product on CodeCanyon, you might consider visiting the forums and asking your question in the "Item Discussion" section.

TivaTheme

Go To Table of Contents