Emoticons

You can download different sets of emoticons at our download center. We also provide a simple click-and-select tool to build your own emoticon list by choosing from 900 animated images: Emoji Tool

Lists of emojis and emoticons are displayed when users click on the yellow icon on the left of the text box.

BlaB! WS Pro supports two types of emoticons - native emoji and image emoticons incl. animated images. Native emojis are preinstalled on all recent phones and computers as a single image font. Native emoji can be inserted in a message directly from the provided list, from a display keyboard on IOS and Android devices and there are emoji extensions for the desktop browsers.

The list of image emoticons can be found as a PHP array in the file emocodes.php. There are no image files, all emoticons in WEBP or SVG format are base64 encoded entries in emoticons.css. A single emoticon from emocodes.php looks like this:

$emoticons[]=':code: css_selector 1';

There are three parameters separated by a blank space: [1] an emoticon code to post with, [2] a CSS selector from emoticons.css, [3] visibility - (1 or 0) which determines if the emoticon is displayed in the list of emoticons. If 0, the emoticon can be posted in chat with its code but neither code nor image is visible in the list of image emoticons. We call this an alias.

emocodes.php

$emoticons[] = ':anguished: svg_emo_anguished 1';
$emoticons[] = ':astonished: webp_emo_astonished 1';
$emoticons[] = ':bandage: svg_emo_bandage 1';
$emoticons[] = ':coldsweat: webp_emo_coldsweat 1';
// etc etc

emoticons.css

.svg_emo_anguished    {background-image: url("data:image/svg+xml;base64,...")}
.webp_emo_astonished  {background-image: url("data:image/webp;base64,...")}
.svg_emo_bandage      {background-image: url("data:image/svg+xml;base64,...")}
.webp_emo_coldsweat   {background-image: url("data:image/webp;base64,...")}
/* etc etc */

When you make any changes in emoticons.css - Rebuild & Uncache with the pink button - AdminCP » Settings

Why a single CSS file and not multiple image files? This allows all emoticons to be downloaded and cached on the user device with a single HTTP request which greatly reduces the load time.