Emoji's disappears after saving page - CKEditor

[tuxy]

Hello,

When adding Emoji's in the CKEditor it disappears after saving the page.
Someone knows how solve this?

   

Copy/Paste the Emoji's from this website

[Felix]

Are you sure the url is not broken after saving page in CKEditor ?
Download the Emoji you want first local to your harddisk and then store it
in a folder that is part of your GS website (assets or media etc.)
From there import in CKEditor. That must work.

[tuxy]

Are you sure the url is not broken after saving page in CKEditor ?
Download the Emoji you want first local to your harddisk and then store it
in a folder that is part of your GS website (assets or media etc.)
From there import in CKEditor. That must work.

Hi Felix,
Nope, not broken after saving. This is weird, i do it also the same in other cms editors without any problem, no download/upload to the website, just copy/paste.

Found another solution:

1. Toggle the GS-editor to source-mode, adding the emoji from here.
   
2. Adding the Emoji in HTML-format, example: 🦁
   
3. Save the GS-editor
   
4. Toggle from source-mode to normal mode.
   
5. The Emoji shows up in the editor
   

[Felix]

Good you have it working.
Usually these issues with ckeditor (or similar editor) are related to:
1) copying and pasting an emoji or picture directly from the internet will not save it locally and the url will break
2) ckeditor server settings how to handle absolute and relative paths
3) ckeditor security settings stripping out characters it does not like

But the above relates to pictures and graphics.

Must say that I never used emoji's in a website. Seems that an emoji is not a picture or a graphic
but a glyph similar to a font. I believe windows 10 stores them in Windows\Fonts\seguiemj.ttf.

[tuxy]

Are you sure the url is not broken after saving page in CKEditor ?
Download the Emoji you want first local to your harddisk and then store it
in a folder that is part of your GS website (assets or media etc.)
From there import in CKEditor. That must work.

Good you have it working.
Usually these issues with ckeditor (or similar editor) are related to:
1) copying and pasting an emoji or picture directly from the internet will not save it locally and the url will break
2) ckeditor server settings how to handle absolute and relative paths
3) ckeditor security settings stripping out characters it does not like

But the above relates to pictures and graphics.

Must say that I never used emoji's in a website. Seems that an emoji is not a picture or a graphic
but a glyph similar to a font. I believe windows 10 stores them in Windows\Fonts\seguiemj.ttf.

Hi Felix,
Indeed, first i was thinking also for security reasons.
I use emoji's sometimes in my blogposts, see screenshot...
   

The blogpost

Regards,
Christophe

[Felix]

Hi Tuxy
Your post about Emoji's has raised my interest in them because I never used them before.
I did some searching with google and came up with these sources for Emoji use
in websites and text. They might be useful for others as well so I post them here:

https://www.cssscript.com/emoji-picker-button/
https://www.cssscript.com/tiny-emoji-picker/
https://www.cssscript.com/simple-emoji-picker-text-fields-emoji-picker/
https://www.cssscript.com/easy-vanilla-javascript-emoji-picker/
https://github.com/wstoettinger/jquery.emojiarea.js
https://github.com/ili4x/inputEmoji
https://github.com/Je7z/disMojiPicker
https://github.com/wedgies/jquery-emoji-picker
https://github.com/ZRunner/JS-Emoji-Keyboard

F.

[Oleg06]

http://newsmanager.getsimplecms.ru/novosti/how-about-adding-youtube/

Just added 'Smiley' to the gsconfig.php file

Code:

define('GSEDITORTOOL', "['Bold','Italic','Underline','Strike','Subscript','Superscript','NumberedList','BulletedList','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock','HorizontalRule','Table','Link','Unlink','Anchor','Image','Blockquote','CreateDiv','Undo','Redo'],'/',['Styles','Format','FontSize','TextColor','BGColor','Youtube','Video','pbckcode','Iframe','SpecialChar','wenzgmap','Smiley','RemoveFormat','Source']");

[tuxy]

@Felix,
Emoji's gives some 'color' and 'emotion' to the text :-)
Thanks a lot for all the links. i love it ;-)

@Oleg06,
This is really awesome. I used this code until now:

Code:

define('GSEDITORTOOL', 'advanced');

But changed with your code snippet, it has a lot more options, AND the smileys works perfect ;-)

Thanks a lot guys :-)