Add emoji by clicking the button on the toolbar or type a colon (:) in the content.
<!DOCTYPE html>
<html>
<head>
<title>Redactor</title>
<meta charset="utf-8">
<!-- css -->
<link rel="stylesheet" href="/your-folder/redactor.css" />
</head>
<body>
<!-- element -->
<textarea id="entry">...</textarea>
<!-- js -->
<script src="/your-folder/redactor.js"></script>
<script src="/your-folder/plugins/emoji/emoji.js"></script>
<!-- call -->
<script>
Redactor('#entry', {
plugins: ['emoji']
});
</script>
</body>
</html>
By default, the plugin has a ready-made set of preset and frequently used emoji in the form of an object divided into groups:
items: {
favorites: {
faceTearsJoy: '😂',
...
},
smileys: {
slightlySmilingFace: '🙂',
...
},
...
}
You can expand the emoji object:
Redactor('#entry', {
plugins: ['emoji'],
emoji: {
items: {
favorites: {
faceScreamingFear: '😱',
moneyBag: '💰'
}
}
}
});
Or replace it completely with your object:
Redactor('#entry', {
plugins: ['emoji'],
emoji: {
items: {
set: true,
favorites: {
faceScreamingFear: '😱',
moneyBag: '💰'
}
}
}
});
By default, the dropdown menu with emoji is called when you type the ':' character, you can change this:
Redactor('#entry', {
plugins: ['emoji'],
emoji: {
trigger: '%'
}
});
By default, the plugin adds its button to the toolbar and context bar. To remove it from the context bar, disable the context
setting:
Redactor('#entry', {
plugins: ['emoji'],
emoji: {
context: false
}
});