Skip to main content

Convert emoji in HTML to fallback images, alt text, title text, and aria labels.

Project description

status release date

Emojificate is a Python implementation of a concept of using fallback images, alt text, title text and aria labels to represent emoji in HTML, a more accessible method than browser defaults.

Installation

emojificate is available on pypi:

pip install emojificate

Usage

To convert a string from the command line:

$ python3 -m emojificate "I 💜 emoji 😊"
I
<img src="https://cdnjs.cloudflare.com/ajax/libs/twemoji/14.0.2/72x72/1f49c.png"
     css="emojificiate" alt="💜" title="Purple Heart"
     aria-label="Emoji: Purple Heart">
emoji
    <img src="https://cdnjs.cloudflare.com/ajax/libs/twemoji/14.0.2/72x72/1f60a.png"
    css="emojificiate" alt="😊" title="Smiling Face With Smiling Eyes"
    aria-label="Emoji: Smiling Face With Smiling Eyes">

Change the class with --css-class (default “emojificate”). To get SVG instead of PNG, use --filetype svg.

Or, if you’ve got a Django project, put emojificate into your INSTALLED_APPS, and then use the following in a template:

{% load emojificate %}
This is some {{ user_content|emojificate }} that has emoji in it.

{% emojified %}
This is some template content that 💜 emoji as well.
{% endemojified %}

Configure with EMOJIFICATE_FILETYPE and EMOJIFICIATE_CSS_CLASS in your settings.py, and add some css to make the emoji not huge.

Implementation

TL;DR: Take a string, split it into tokens, and if a token is emoji, process it into a nice format.

As of 0.4.0, string-splitting is now handled by grapheme.

Given a list of tokens, we can leverage the native unicodedata to:

  • see if a token is a unicode Symbol (an emoji)

  • get the codepoint for the emoji, and

  • get the name of the emoji.

If a token is a grapheme and not a character, there won’t be a record of what it is in unicodedata. In that case emojificate defaults to a human-readable version of the shortcode provided by emoji.

From there, we construct an <img> replacement for the emoji:

  • Use images from twemoji, Twitter’s emoji set (if the URL exists)

  • Have an alt parameter containing the original emoji. This allows for copying-pasting.

  • Use the name of the emoji in the title parameter. This allows for hover-tooltips.

  • Add an aria-label for screen-reader accessibility.

For more information, see Solve For Emoji.

Implementation in other languages

Ruby

require 'gemoji'

def cdn
    "https://cdnjs.cloudflare.com/ajax/libs/twemoji/14.0.2/72x72/"
end

def emojificate(string)
  string.split("").each do |s|
      e = Emoji.find_by_unicode(s)
      if e then
           u = s.ord.to_s(16) # e.g. 1f431
           d = e.description  # e.g. "cat face"
           img = "<img src=\"#{cdn}/#{u}.png\" alt=\"#{s}\" title=\"#{d}\" aria-label=\"Emoji: #{d}\">"
           print img
       else
           print s
       end
   end
 end

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

emojificate-0.7.0.tar.gz (26.3 kB view hashes)

Uploaded Source

Built Distribution

emojificate-0.7.0-py2.py3-none-any.whl (7.5 kB view hashes)

Uploaded Python 2 Python 3

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page