Documentation

IMPORTANT

This is the outdated SI-documentation which will be adapted soon. A huge part may be obsolete!

Overriding Smileys Emoticons

Overriding Smileys & Emoticons

What is Smileys?
Smileys are combination of several text characters that expresses an emotion, while Emoticons are graphical image that expresses an emotion.

Smileys and emoticons are what makes sharing, commenting, and chatting more fun. EasySocial comes with a set of useful smileys and emoticons that can be used when updating status on dashboard or submitting comments. Here, you will find the list of smileys and emoticons available on EasySocial.

Overriding Smileys

Overriding smileys is really simple. You can find the default storage path for the smileys in the following folder.

/administrator/components/com_easysocial/includes/bbcode/adapters/decoda/library/config/emoticons.json

Then, if you wish to override the existing smileys, you could create a template override for this file and place it in the following directory.

/templates/<YOUR_TEMPLATE>/html/com_easysocial/emoticons/emoticons.json

Overriding Emoticon

By default, EasySocial comes with a different set of emoticons. They are located in the following folder.

/media/com_easysocial/images/emoticons/

You could override this or added new smileys in your template override folder. To do so, simply copy the existing folder above and place it in the following directory.

/templates/<YOUR_TEMPLATE>/html/com_easysocial/emoticons/

Example

This is the example of the override emoticons.json file. Noticed, there is a new smiley added there named jump.

{
    "angry": ["&gt;:("],
    "cool": ["8)"],
    "happy": [":)"],
    "heart": ["&lt;3"],
    "kiss": [":3"],
    "zipper":   [":x", ":X"],
    "sad": [":("],
    "cry": [";(" , "(cry)"],
    "tongue": [":P", ":p"],
    "surprised": [ ":o", "(surprised)" ],
    "confuse":  [ "(confuse)" ],
    "wink": [ ";)", ";]", ";D", ":wink:" ],
    "sweat": ["(:|", "(swt)"],
    "angel": ["|:)" , "(angel)"],
    "devil": ["(devil)"],
    "blush": [":$"],
    "think": [ "(think)" ],
    "lol": [":D", "(lol)"],
    "sleep": [":z", "(sleepy)"],
    "nerd": ["(nerd)" ],
    "jump": ["(jump)"] 
}

Next, you will need to add an emoticon image jump.png in emoticons override folder mentioned below.

/templates/<YOUR_TEMPLATE>/html/com_easysocial/emoticons/jump.png

EasySocial will only retrieve emoticons image in the format of .png. Make sure you're using the correct image format.