Как добавить собственные эмодзи на сайт?

Question

[WhileAD]

Приветствую!
На многих сайтах замечаю наличие собственных эмодзи платформы, а также возможность добавлять свои. Эти эмоджи можно добавлять в текстовое поле input между слов и символов, это фактически фото внутри строки ввода.

Как можно это реализовать? Что использовать?

Answer 1

[Дмитрий]

Эмодзи - это, в первую очередь, просто символы юникода. Преобразовать эти символы в пиктограммы - задача каждой конкретной платформы. Общий принцип простой: у тебя должно быть настраиваемое поле ввода, в котором ты должен отлавливать вставку эмодзи или ввод их из списка и динамически заменять на свои подготовленные изображения.
Вот для примера скриншот из чата "ВК".


Ссылка на список эмодзи и их Юникод-символы: https://copychar.cc/emoji/

Comments

[Дмитрий]

Забыл упомянуть, что по умолчанию преобразование юникода в пиктограммы берет на себя операционная система. В некоторых случаях - браузер.

Answer 2

[Владимир Коротенко]

Пробуйте

Comments

[Дмитрий]

ТС говорил о том, как запилить свои собственные эмодзи - по тем же принципам, по которым они разные в ВК, Телеграме, WhatsApp и т.д.

[Владимир Коротенко]

Дмитрий, мой подход стандартизирован, как они там с икон паками извращаются не знаю, скорее всего просто гифки или пнг и инлайнятся в текст.
В принците тоже самое но нужен визуальный редактор, и на его панельку вешается какая нибуть картинка, которая по кнопке вставляется

Answer 3

[Александр]

1. Использовать эмодзи, встроенные в систему. Например из Windows 10.

2. Реализовать программно некую "галерею эмодзи" и использовать её для вставки эмодзи в текст (Возможно есть готовые библиотеки).

Литература:
Под капотом у Emoji
Эмодзи?! Нет, не слышал
Почему важно тестить на устройствах, которыми поль...

Дополнительно:
Emojipedia
Get Emoji