preaction / Statocles

Static website CMS
http://preaction.me/statocles
Other
84 stars 33 forks source link

Add easy emoji syntax plugin #510

Open preaction opened 7 years ago

preaction commented 7 years ago

A lot of websites and applications are standardizing on the :<name>: syntax for emoji and icons, like Github here.

It would be nice if we could put :+1: in our content and have it appear as :+1:. This would probably be best achieved with a new plugin class called Statocles::Plugin::Emoji. The plugin should run after the build and scan the text content of every page to replace :<name>: with the matching icon. If an icon doesn't match, the text should remain the same and a warning printed out to warn the user that we didn't find the icon they wanted.

This plugin should be made part of the default set of plugins built by the site create command.

There needs to be a way to escape the emoji replacement. Likely by putting an escape backslash \ in front of the first colon.

Since we already have font-awesome, and at least one OS fallback font has a wide array of Unicode emoji, we should be able to map a bunch of names to either font-awesome icons or Unicode emoji. It's up to you to decide what icons should be font-awesome, and what icons should be Unicode emoji.

It would be preferable if building the mapping of <name> to icon/emoji were automatic. If necessary, the proper Unicode specification could be downloaded, the names extracted and mapped to characters, and the appropriate font-awesome or Unicode character printed out. Otherwise, Perl has internal syntax for named Unicode characters (but that syntax is kind of obtuse).

The unicode characters will only work if we're writing out our pages using a Unicode encoding (like UTF-8). See #278 for work that needs to be done handling encodings better.

The work of short, memorable names for these icons/emoji may already exist on CPAN. If it doesn't this work may be spun out into its own CPAN distribution which we can then depend on.

One interesting part of this will be content awareness: Any content being rendered to an RSS or Atom feed, or anything that cannot have attached stylesheets with custom fonts, must be rendered using some kind of default/fallback. Right now, if I use a FontAwesome icon in a blog post, the corresponding RSS feed just shows up as a blank space. So, if it's important information (such as a twitter link for the author of the post), the information gets lost. This is very inconvenient.

ferki commented 7 years ago

Text::SlackEmoji might be interesting here for the replacement (and for generating the emoji list from Unicode specs too, I believe).

preaction commented 7 years ago

Yes, that is perfect! So we basically just need to wrap this in a Statocles plugin.