Documentation

ViralFB 2.0

ViralFB Installation & Requirements

ViralFB is a PHP script built on Laravel (a PHP framework) and has a few system requirements, but the most web servers are meeting these requirements.

Server Requirements

  • PHP >= 5.6.0
  • OpenSSL PHP Extension
  • PDO PHP Extension
  • Mbstring PHP Extension
  • GD Library
  • PHP Fileinfo Extension *common extension on most of the shared hostings

Installation

Unzip the ViralFB downloaded package.

Upload unzipped files from 'ViralFB' folder to your server in desired location.

Create a new database and retains follows information: database name, username, password and hostname.

Navigate to http://< SCRIPT LOCATION >/install.php

Example: http://mysite.com/install.php

First time,the script will check for server requirements. If your server does not meet all requirements, an error with unfulfilled requirements will be returned (contact your hosting provider to enable them, or move to a different host), else the installation will start successfully.

Database Setting: provide the database details created earlier.

Please provide details from an empty database to prevent eventual conflicts of tables.

If entered database details are correct and a database connectivity error is not returned, it follows two steps who check folder permissions and some requirements.

Also, the installer will automatically create the necessary tables for running ViralFB.

After you have completed all these steps, you have finished the installation.

Now you can login to Admin Panel with default username by accessing http://<SCRIPT LOCATION>/dashboard or http://<SCRIPT LOCATION>/vf-admin .

Default login details:

  • Username: admin
  • Password: admin

It's recommended to change admin login details immediately after install (Admin Panel -> Admin Config).

How to install the multiple friends plugin?

Easy,multiple friends is not needed any extra files,you just need VrialFB v2.2+ version and a license of multiple friends.
Either or only the multiple friends plugin license or complete pack license or ViralFB v2.2 Multiple friends package.
Each from the above licenses are auto approved to use the multiple friends API.

How to update to latest version from v2.0 to v2.2

Unzip the ViralFB Update downloaded package.

Upload unzipped files from 'ViralFB Update' folder to your server in desired location.

Please make sure you make a backup before doing a update!


Step One - upload this files to desired locations:

css\sitestyle.css - For theme
local\resources\views\singleApp.blade.php
local\resources\views\layouts\admin\configuration.blade.php
local\resources\views\layouts\admin\boradtemplate.blade.php
local\resources\views\layouts\admin\dashbaord.blade.php
local\resources\views\layouts\admin\plugins.blade.php
local\resources\views\layouts\admin\update.blade.php
local\resources\views\layouts\admin\create\combinedScript.blade.php
local\resources\views\layouts\admin\create\edit-text.blade.php
local\resources\views\layouts\admin\create\edit.blade.php
local\app\Http\Controllers\imageController.php
local\app\Http\Controllers\AdminController.php
local\app\Http\Controllers\AppControiller.php
local\app\Http\routes.php
local\app\SaferCrypto.php - Upload this file
admin\js\results-editor-action.js
admin\js\createappset.js
admin\js\update.js
images/ put all the images files from here to inside images folder on root script

Step Two:

Now navigate to admin panel and go to Update page,in that page click on button "Do Update".

For manually insert to database:

1.Create at the database the following paramaters:
Navigate to configs table-->insert new column.
nume = activate, valoare=true

2.Edit column "basic" and Add at the end of the line between the { } like so:
{............. "fbsecretid":"","multiplayermode":"true","userposts":"true","userphotos":"true"}
For example add the paramaters like in the color text between the { }:
{"sitename":"ViralFB","sitemetaname":"Viral facebook apps for entertainment",
"sitedescription":"Real entertainment source, hottest apps from the internet are on us.",
"logo":"files\\logoforsite.png","favicon":"files\\favicon.png",
"fburl":"https:\/\/www.facebook.com\/facebook\/?fref=ts","fbappid":"xxxxxxxxx","fbsecretid":"",
"disp-latest-app":"on","disp-fb-comm":"on","disp-share-modal":"on","modal-time":"5",
"modal-title":"Share on Facebook","modal-text":"Don't forget to share on Facebook. Your friends will appreciate this.",
"graphtitle":"ViralFB - Viral facebook apps for entertainment",
"graphdescription":"Real entertainment source, hottest apps from the internet are on us.",
"graphimg":"","headcode":"","bodycode":"","fbsecretid":"","multiplayermode":"true","userposts":"true","userphotos":"true"}

ViralFB Configuration

Once the installation was completed, it's time to configure site, based on your preferences.

To configure your site, go to Admin Panel -> Configuration

Basic configuration

  • Site name
  • Site Title
  • Site Description
  • Site Logo (180 x 60 px - recommended)
  • Site Favicon

Facebook configuration

  • Facebook App ID

Go to developers.facebook.com and create a new application, after that, copy the newly created application ID to "Facebook App ID" in Admin Panel -> Configuration -> Facebook Configuration.

This step is very important because without a Facebook app id or if your Facebook app is not correctly configured, the apps created with our script will not work.

Other configurations

  • Visibility of some elements
    • Display latest app section in home page: YES/NO
    • Display FB Comments: YES/NO
    • Display Share Modal: YES/NO
      • Display Share Modal after X second after the result is generated
      • Modal title
      • Modal description
  • Open graph configuration - Open graph details are data fetched by Facebook when a link is shared on this social network.
    • Home Page - open graph title
    • Home Page - open graph description
    • Home Page - open graph image
  • Custom code - Advanced
    • Header section code
    • Do not insert html code to be displayed to users! The code inserted here will be included inside <head> </head> tags. Here you can insert code for Meta tags, CSS/JS files. Eq.: Google analytics code, Google webmaster verification code, etc.
    • Footer section code
    • Code to be included just before the closing </body> tag.

Creating a new app

After you have configured your site, let's create a new application!

Go to Admin Panel -> Apps -> Create New App and create a new app in three simple steps:

Adding Basic App Details

First simple step consists adding the basic details: app title (1), app description (2) and app image (3).

The image below illustrates where will be displayed the information provided in this step.

Adding Results

Here you will create the magic of your apps. To do this, "FB Editor" will be your friend.

FB Editor has multiple functions: upload images, add user FB profile picture, add text, resize images, set position of layers using drag and drop.

To add a layer, use the left "Actions" panel in "FB Editor".

The "Actions" panel contains on top a navigation bar with 4 buttons: image, fb image, text, layers.

Image

Here you can open Pixlr image editor (to easily create the best design for your apps) or you can upload an image from your computer by clicking on "Upload an image " button.

About Pixlr Editor:

Pixlr Editor is a free image editor and is the best online editor. It can be accessed in browser at https://pixlr.com/editor, but we have integrated this editor in our app to ease your work. If you don't like this editor, you can create your images in another editor like Photoshop and upload them using "Upload an image" button.

When you want to save an image from Pixlr to your project, go to File -> Save -> Referrer .

If you want to minimize Pixlr editor and reopen it later, you can use the small blue button from right top corner. A new orange button will appear in the "FB Editor" title bar (this button will make easy to show/hide Pixlr). By clicking this button, Pixlr Edior will be opened again.

In the example below, we have 2 images. The first image (the background with the car) was created with Pixlr Editor, and the second image (the question mark .png image) was uploaded using "Upload an image" button.

FB Image

By clicking "Add User FB Profile Picture" a default profile image will be added to result, but this image will be replaced with the real profile picture of users who try the application.

You can have multiple FB profile pictures in one result.

FB Image with rounded picture

Please follow the next video to make rounded picture,future updates could be choose profile picture rounded or square.

Text

Simply add a text to result using the "Add Text Layer" button.

In text you can include these shortcodes:

  • [first-name] - for facebook user first name
  • [last-name] - for facebook user last name
  • [full-name] - for facebook user full name

If the text you want to add not contains a shortcode, you can add the text to image when you create the image with an image editor (for more fonts, styles etc.).

Layers

"Layers" is a sortable list of your added layers which help you to change the position of layers (to back / to front) or to delete a layer.

If you finished to adding content to the result, it's time to save the result by clicking the "Save as X" button (depends on the current number of the result), but before that, you can set the gender for which the current result will be available by checking/unchecking the "Current result will be available for:" checkboxes.

Final settings

Here you need to set the Open Graph details of your new application.

The title and the description can contain these shortcodes:

  • [first-name] - for facebook user first name
  • [last-name] - for facebook user last name
  • [full-name] - for facebook user full name

Regarding the image, you have 2 options:

  • Default app image (the image set at "Basic details")
  • Random generated image with user profile picture

Widgets

A widget is a small block that performs a specific function (for example a Facebook plugin, advertisements etc.). You can add widgets in 10 areas destined for widgets:

  • Header bar
  • Below the header bar
  • Sidebar
  • Above the Login button
  • Below the Login button
  • Above the Share button
  • Below the Share button
  • Above the apps list
  • Above the footer bar
  • Footer bar

The widget areas are illustrated with images in Admin Panel -> Widgets in right side of the page.

Adding/Editing a widget

  • Go to Admin Panel -> Widgets
  • Click on the "Add new widget" button
  • Add widget title
  • Add widget content (text, images etc.). To add HTML code to the widget, click on the "<>" button (this button is circled in red in the image above).
  • Set widget visibility
  • Save widget

To change position of widgets, drag them up/down.

Pages

Adding a new page

  • Go to Admin Panel -> Pages -> Add New Page
  • Set the page title
  • URL: By default, a based on title URL is auto generated. If you want to use a custom url, check 'Use custom URL' option, and insert your url( it's recommended to separate the url words with "-" character).
  • Add page content. To add HTML code, click the "<>" button (the last button in the instruments bar).
  • Save page

Languages

Adding a new language

  • Go to Admin Panel -> Languages
  • Click on "Add New Language" button
  • Add language name - Eq.: English, French etc.
  • Add language code - Eq.: en, fr etc.
  • Edit langage strings.
  • Save language

Setting active language

At bottom of page you will find an option list with saved languages. Choose the language which you want to be active and after this, click on the "Save settings" button.

Color scheme

To change the color scheme of your website, go to Admin Panel -> Color Scheme

Here we have 2 options:

  • Simple colors editor
  • Advanced colors editor

To change a color, click on the small square (which represent the current color) from right side of the form. A color picker will appear.

After that, click on the "Save color scheme" button.

Admin Config

Here you can change admin username and password.

  • Go to Admin Panel -> Admin config
  • Enter new username
  • Enter new password
  • Repeat new password
  • Save settings

Support

If you have any problems or questions, please send us a support request at yaleyolosup@gmail.com .

Thanks!