From f6ed90cb0107ad9bcdf97608da8371f0627796ed Mon Sep 17 00:00:00 2001 From: Jake Jarvis Date: Wed, 8 Apr 2020 10:26:06 -0400 Subject: [PATCH] Update README.md --- README.md | 24 +++++++++++++++--------- 1 file changed, 15 insertions(+), 9 deletions(-) diff --git a/README.md b/README.md index b11e325..c489ef6 100644 --- a/README.md +++ b/README.md @@ -1,10 +1,12 @@ # hugo-mod-twemoji 📦 -[**Twemoji**](https://twemoji.twitter.com/) (Twitter Emoji) is an open source library of over 3,000 Unicode emojis in both PNG and SVG formats. It also provides a script to swap out system-native emojis for these graphics to achieve a uniform appearance across all browsers and platforms. +![twemoji-smileys-2014 (1)](https://user-images.githubusercontent.com/1703673/78717950-64b01680-78ef-11ea-9010-1055e014abbf.png) -This [Hugo Module](https://gohugo.io/hugo-modules/) can be used to import the Twemoji graphics and scripts locally into your Hugo project, rather than making external calls to Twitter's CDN. +[**Twemoji**](https://twemoji.twitter.com/) (Twitter Emoji) is an open-source library of every Unicode emoji ([all 3,245 of them!](https://emojipedia.org/twitter/)) uniquely redesigned in both SVG and PNG formats. It also provides a script to swap out system-native emojis for these graphics to achieve a uniform appearance across all browsers and platforms. 🙌 -## Usage +This [Hugo Module](https://gohugo.io/hugo-modules/) can be used to import the Twemoji graphics and scripts locally into your Hugo project, rather than making external calls to Twitter's CDN for each individual icon. + +## 🤖 Usage Add the module to your Hugo project's `config.toml`: @@ -14,15 +16,15 @@ Add the module to your Hugo project's `config.toml`: path = "github.com/jakejarvis/hugo-mod-twemoji" ``` -The graphics will be mounted in `static/twemoji/png` and `static/twemoji/svg`, and the scripts in `static/twemoji/js`. +The graphics will be mounted in `static/twemoji/svg` and `static/twemoji/png`, and the minified script in `static/twemoji/js`. You'll want to call the script somewhere in your template or theme's ``, for example: -```go +```html ``` -...and then in order to actually swap out the emojis, you need to call the script's `.parse` method. This is where you can choose between PNGs or SVGs and tell the script where we've placed the graphics. A good starting point is: +...and then in order to actually swap out the emojis, you need to call the script's `twemoji.parse` method. This is where you can choose between SVGs (recommended) or 72x72 PNGs and tell the script where we've placed the graphics. The [official readme](https://github.com/twitter/twemoji#api) has a _lot_ of information about the API, but a good starting point is this one-liner: ```html ``` -After building the site this script will turn into something like: +After building the site this small script will turn into something like: ```html ``` -## License +## 🌎 Examples -Twemoji graphics are licensed under [Creative Commons Attribution 4.0 International](https://creativecommons.org/licenses/by/4.0/) (CC-BY-4.0) by Twitter, Inc. and other contributors. Code is licensed under the [MIT License](http://opensource.org/licenses/MIT). +- [https://jarv.is/](https://jarv.is/) ([Source](https://github.com/jakejarvis/jarv.is)) + +## 📜 Licenses + +Twemoji graphics are licensed under [Creative Commons Attribution 4.0 International](https://creativecommons.org/licenses/by/4.0/) (CC-BY-4.0) by Twitter, Inc. and other contributors. Code (both Twitter's and this repository) is released under the [MIT License](http://opensource.org/licenses/MIT). Refer to the main [Twemoji repository](https://github.com/twitter/twemoji) or [website](https://twemoji.twitter.com/) for more information.