html5 with Drupal7

This is very similar to Drupa8/9 plugin

you can download it from this link

Create a new field called “gender”

go to : configuration->Account setting, Managed field

Add new field called “gender” (list text)

and put them values : male female

Install the plugin

Go to structures/blocks

and enable Content / html5chat

then edit the chat parameters with your own html5 chat account data

Restrict that block to chat page

Create a new page

and set the URL alias as chat

Congratulations: you just created your html5-chat inside page


Integrate HTML5 chat with chameleon software online

Here is the step to integrate html5 chat with

Create html5chat.php on root and paste there this code:

if (empty($_GET['cmd']) || $_GET['cmd'] != 'lang')
    $area = "login";
$_GET['display'] = get_param('display', User::displayProfile());
$where = ' u.user_id = ' . to_sql(guid(), 'Number');
$webmasterid = xxxxx;
$password = "yyyyyy";
$id = $GLOBALS['g_user']['user_id'];
$avatars = glob("_files/photo/" . $id . "_*_m.jpg");
$avatar = (count($avatars)) ? "//{$_SERVER['SERVER_NAME']}/" . $avatars[0] : '';
switch($GLOBALS['g_user']['gender']) {
case 'C':
$gender = 'male';
case 'F':
$gender = 'female';
$gender = 'male';
$myuser = array(
    'username'  => $GLOBALS['g_user']['name'],
    'password'  => $password,
    'gender'    => $gender,
    'role'      => $GLOBALS['g_user']['role'],
    'image'     => $avatar,
    'profile'   => base64_encode("//{$_SERVER['SERVER_NAME']}/users_online.php?display=profile&uid=$id&offset=1")
$json = json_encode($myuser);
$encoded = file_get_contents("" . base64_encode($json));
<!doctype html>
<html lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Webcam Chat</title>
        html, body {
            width: 100%;
            height: 100%;
    <script src="<?=$webmasterid?>/<?= $encoded ?>"></script>

Replace xxxx and yyyy by your webmasterid and your html5-chat password account.

html5 chat and weebly

You can easily add html5 webcam chat to weebly.
(weebly is a free online website creation tool, wix like)

In weebly, it is extremely simple to integrate the chat:

  1. Create a new page (called “chat” for instance)
  2. Insert a code integration element inside the page
Weebly element to be inserted

insert that :

<div style="width:100%;height:640px">YOUR_HTML5CHAT_SCRIPT</div>

And that’s all: you will have a chat of 100% width and 640px height inside your chat page !

here is the <div> container and the html5 script

Html5chat for phpBB: Extension HTML5 Chat

You can now easily integrate your html5 chat into phpBB. Here are the steps:


You can download the phpBB html5 extension form here


phpBB 3.2.6-RC1+ PHP 7+


Adds some preliminary data and a header link to a custom page.

Quick Install

You can install this on the latest release of phpBB 3.2 by following the steps below:

  • Create toxyy/html5chat in the ext directory.
  • Download and unpack the repository into ext/toxyy/html5chat
  • Enable HTML5 Chat in the ACP at Customise -> Manage extensions.


  • Disable HTML5 Chat in the ACP at Customise -> Extension Management -> Extensions.
  • To permanently uninstall, click Delete Data. Optionally delete the /ext/toxyy/html5chat directory.




Joomla update

The html5 Joomla plugin was updated.

It now works with jomsocial and allows to retrieve avatar and gender

It corrects bugs and adds the correct role mapping:

It handles now the default Joomla roles

  • Administrator
  • Author
  • Editor
  • Guest
  • Manager
  • Public
  • Publisher
  • Registered
  • Super Users

You can download it from:

Installation process

  1. In Joomla top menu: Extensions->Manage->Install
  2.  Choose the tab “install from URL” and set the value to
  3. Go to menu Extensions->plugin and find html5chat (or search for html5chat)
  4. Enable plugin that  html5chat plugin (status check)
  5. click on html5chat plugin. You should then enter the webmasterid and Password
    enableJoomlaYou can get these data when you register the plugin at :
  6. Create an article/page that will contain the chat. Inside that page, insert
    [html5chat width=”100%” height=”800px”]

You will now have the html5 chat inside that page article.

Step by step Joomla Installation

Oxwall and html5-chat integration

Official plugin

There is an official html5-chat plugin made by oxwall team (Skalfa LLC)

which does the job.

How to make it full screen ?

This plugin embeds the chat into the 

<div class="owc_content">

and whose size can be too small for the chat. The idea would be to make it full screen (and just keep the header). For that you need to edit some files

in /ow_includes/config.php change the OW_DEV_MODE to false (this allows to empty cache), after the manipulation, you will set it back to true

define('OW_DEV_MODE', true);

in /ow_plugins/html5-chat-com/views/controllers/chat_index.html add these lines after {style}


.ow_content {
    position: absolute;
    top: 69px;
    left: 0;
    bottom: 0;
    right: 0;
    height: 100%!important;

div.ow_footer {

check it: if everything is ok, then set back the OW_DEV_MODE to false

define('OW_DEV_MODE', false);

To retrieve users roles in Oxwall, use:

$authService = BOL_AuthorizationService::getInstance();
$roles = $authService->findUserRoleList($userId);

html5 chat and wowonder script

How to integrate html5 chat with social wowonder script ?

Edit .htaccess and add that line

RewriteRule ^html5-chat$ index.php?link1=html5-chat [NC,QSA]

Edit index.php and add these lines

case 'html5-chat':

create sources/html5-chat.php  :

<?php if (empty($wo['user'])) {
    header("Location: " . Wo_SeoLink('index.php?link1=welcome'));
$webmasterid = YOUR_WEBMASTERID;
$user = array(
$encrypted = file_get_contents("".base64_encode(json_encode($user)));
<!doctype html>
<html lang="en">
    <meta charset="UTF-8">
    <script src="<?=$webmasterid?>/<?=$encrypted?>"></script>
<?php exit();?>

Just change these 2 parameters:

YOUR_WEBMASTERID : your script webmasterid

YOUR_SCRIPT_CHAT_PASSWORD : your script password

then navigate to :


Wix and html5 chat

wixHow to integrate html5-chat into Wix ?

Wix a a very popular CMS hosted system used by millions of websites.
It is very easy to manage for people who do not have any computer knowledge.

Problem is, you cannot integrate html5-chat into wix: The reason for that limitation is that Wix does not allow neither to insert html code nor Js into his pages, or more precisely, it creates a sandbox iframe to embed the html or JS.

Problem of that iframe, is that this iframes does not have rights to access webcam : now days moderne browsers needs special permissions on iframe to access features as webcam, micro or geolocation.

The only way to have its own html5 chat on wix platform is to create an external link (target=”_blank”) that points to our chat:

<a href ="" target="_blank">My own chat</a>

We hope Wix will change that soon. Meanwhile, we advise to use… wordpress which is for sure the best CMS ever.


html5 chat and phpsocial integration

PHP social is a cool social “facebook” like script.  It is not free but has a moderated price of 49$.

We suppose we want to get a chat page in full screen, auto loggedon and called “chat”.

(You need to be registered and loggedon on to test it)


How can we integrate HTML5-chat into php social ?

Step1 : edit .htaccess and add this line

RewriteRule ^chat/?$        index.php?a=chat          [NC]

Step2 : edit config.php and add

'chat'        => 'chat',

Step3: download this script: chat , unzip it and edit it and change the 2 lines: webmasterid and password

$webmasterid = xxx;
$password = 'xxxx';

Step4: FTP upload chat.php to /sources folder

Step5: Test that your chat works fine on


Here is the source of chat.php 

function PageMain() {
* Change these 2 parameters and put your webmasterid and your chat password here
$webmasterid = 'xxxxx'; // your webmasterid number
$password = 'yyyyy'; // your chat password

global $TMPL, $LNG, $CONF, $db, $user, $settings, $plugins;
if(!isset($user) || !isset($user['idu']) ) {
header("Location: ".$CONF['url']."/index.php?a=welcome");

$json = json_encode(array('id'=>$user['idu'], 'username'=>$user['username'], 'image'=>$CONF['url'].permalink('/thumb.php?t=a&w=112&h=112&src='.$user['image']),
'gender'=>($user['gender'] == 1) ? 'male' : 'female', 'role'=>'user', 'profile'=>$CONF['url']. '/profile/'.$user['username'], 'password'=>$password));
$encoded = file_get_contents("".base64_encode($json));
<script src="<?=$webmasterid?>/<?=$encoded?>"></script>
$script = ob_get_clean();
echo $script;

HTML5 chat and JOOMLA: new html5chat joomla plugin

! WARNING ! A new update of Joomla plugin can be found here !

You can now easily integrate html5 chat into your joomla

The joomla plugin can be downloaded from this link

Here is how to make it run in 2 minutes:

HTML5 allows you to easily add a webcam video chat into your JOOMLA page.

###How to use it:
1) register free on

2) install the plugin and setup the password and webmasterid parameters you got when registered.

3) add a new article and insert a shortcode like

          [html5chat width="100%" height="800px"]

You will get your chat with 100%, 800px dimensions with authenticated user (username, role)