Introduction
This guide will help you through the installation process and get CometChat running on your site.
Installation is very straight forward, only taking about 5 minutes from uploading the files to viewing the CometChat bar on your site.
Before you begin, you will need an FTP client, if you do not have one, you can download a free client like FileZilla.
You do not need programming knowledge to install CometChat, but a working knowledge of FTP functions is a plus.
This guide assumes that you have successfully downloaded the latest release of CometChat and have the zip file “unzipped” and ready to go. If not, you can download the package from the CometChat Client Area.
The instructions will term the zip file you downloaded as cometchat.zip.
Uploading
At this point, you should have the zip archive cometchat.zip and find a single folder- cometchat.
If you don’t know already, find out the folder in which Woltlab Suite is installed.
If you access your Woltlab Suite site via http://www.domain.com, then look for the webroot directory.
The webroot directory is usually public_html or www, but this varies from server to server so if you’re unsure, contact your hosting provider.
Using your FTP client, copy the /cometchat folder inside your Woltlab Suite folder. e.g. http://www.domain.com/cometchat
Installation
Step 1
You should now run the installer file through your web browser by entering the URL into your browser’s address bar (if you have followed our example, type in http://www.domain.com/cometchat/install.php, naturally substituting domain.com for your web address).
If the installation was completed successfully, you will receive the link for CometChat Admin Panel.
Also the page may display a list of files and folders which may require additional permissions. Please CHMOD those files/folders to 777.
Step 2
Login to CometChat Admin Panel and click on the Install CometChat tab. Follow the on-screen instructions and copy the code that you need to add to your site.
Docked Layout
If you using the Docked Layout, you need to edit your site template.
- Edit
/templates/header.tpl - Immediately after the opening
<head>tag add the copied HTML code:
<link type="text/css" href="/cometchat/cometchatcss.php" rel="stylesheet" charset="utf-8">
<script type="text/javascript" src="/cometchat/cometchatjs.php" charset="utf-8"></script>"
Embedded Layout
If you are using the Embedded Layout, you can add the copied HTML code into any site page.
CometChat installation instructions
Step 1 :
Goto your Woltlab Suite project and open templates/header.tpl file. Add the following code in <head> tag.
<script type="text/javascript">
//fields marked with asterisk '*' are mandatory
var chat_id = "{@$__wcf->user->userID}"; // * always an integer
var chat_name = "{$__wcf->user->username|encodeJS}"; // * this is an empty string for guests
var chat_link = "{@$__wcf->user->getLink()}"; // this is user's profile link
var chat_avatar ="{@$__wcf->getUserProfileHandler()->getAvatar()->getURL(128)}";
</script>
Step 2 :
To add Docked or Embed layout :
Login to your CometChat Client Area.
Go to : Install CometChat tab on left panel, see Add CometChat step.
» To add Docked Layout :
Step 2a :
Click on Add To Site
Step 2b :
Copy this code and add this code to the head tag just below the previously added javascript code.
» To add Embed Layout :
Step 2a :
Log in to your website with your administrator account.
Eg: https://www.yoursite.com/
Step 2b :
Goto the page you need CometChat to be embeded on and click Edit Page.
Step 2c :
You will be now taken to the page editor. Add the CometChat embed code under Content tab as shown in the image below.
Now click submit and preview the page to see CometChat Embed layout added to your webpage.
That’s It! CometChat has now been integrated into your website.
Go ahead and customize CometChat from your CometChat Client Area.