This Jekyll plugin adds:
Tested with:
Check if it is already installed by running:
$ convert --version | grep Version
Version: ImageMagick 7.0.8-46 Q16 x86_64 2019-05-19 https://imagemagick.org
If you are having pixeled icons or if you have a problem converting SVG files, you may need to install the package librsvg2-bin. For example, in Ubuntu/Debian systems:
sudo apt install librsvg2-bin
You may need to install librsvg before installing the RSVG renderer.
Check the devcontainer's Dockerfile for more practical details.
Add this line to your application's Gemfile:
gem 'jekyll-favicon', '~> 1.1.0', group: :jekyll_plugins
If you are going to use this plugin in a hosted build/service, be sure that they include your plugins as part of the process. You can check gh-pages branch for a working example.
As Github Pages doesn't load custom plugins, this plugin won't be included on the build process. As a workaround, you can build your site and push all files (for example, build to docs, version it and push it, although this works only for project pages).
By installing the plugin, it will be automatically activated without further configurations.
You can override these settings in your sites's _config.yml. The simplest configuration would be this:
favicon:
source: custom-favicon-png-or.svg
This plugin works best if you use an SVG with a square viewbox as the source, but you can also use a PNG instead (at least 558x588). Check the fixtures favicon.svg or favicon.png as examples.
To get the links and meta, just add the favicon tag {% favicon %}. For example, on your index.html
---
---
<!DOCTYPE html>
<html>
<head>
{% favicon %}
</head>
<body>
</body>
</html>
The plugin customization goes in the favicon key in the _config.yml file. There are four key parameters:
| attribute name | type | default | description |
|---|---|---|---|
| source | hash/string | name: favicon.svg | SVG or PNG file relative to site's source. Any favicon without explicit source will use this attribute as default. |
| background | string | transparent | Color keyword or Hex representation. Any favicon without explicit convert background will use this attribute as default. |
| dir | string | . | Path relative to site's source. Any favicon without explicit source dir will use this attribute as default. |
| assets | array | see defaults | Array of asset configuration. Any asset define here will be controlled with this plugin. |
The assets is an array of file spec:
| attribute name | type | default | description |
|---|---|---|---|
| name | string | file's basename. Required. | |
| dir | string/symbol | :site_dir | file's dir, relative to site's destination |
| source | hash | file's source. Required. | |
| convert | hash | {} | see convert defaults |
| tags | array | [] | see tags defaults |
| refer | hash | [] | see refer defaults |
Symbol values:
:background: favicon's global background:site_dir: favicon's global dir:href: favicons absolute URL pathThe convert configuration is specific for each type of convertion: SVG to ICO/PNG/SVG and PNG to ICO/PNG.
| attribute name | type | default | description |
|---|---|---|---|
| alpha | string | see convert config | see imagemagick alpha docs |
| background | string/symbol | see convert config | see imagemagick background docs |
| define | string/symbol | see convert config | see imagemagick define docs |
| extent | string/symbol | see convert config | see imagemagick extent docs |
| gravity | string | see convert config | see imagemagick gravity docs |
| resize | string | see convert config | see imagemagick resize docs |
| size | string | see convert config | see imagemagick size docs |
Symbol values:
:auto: if sizes is not a square, then sizes:max: 3 times the largest dimensionThe tags configuration is a list of hashes with only one key, link or meta, and only one value, a hash with the HTML attributes associated to the key. See tags defaults for more details.
The refer configuration is a list of hashes with only one key, webmanifest or browserconfig, and only one value, a hash that will override the associated file. See refer defaults for more details.
If you want to add something, just make a PR. There is a lot to do:
Bug reports and pull requests are welcome on GitHub at https://github.com/afaundez/jekyll-favicon. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the Contributor Covenant code of conduct.
The gem is available as open-source under the terms of the MIT License.
Everyone interacting in the Jekyll Favicon project’s codebases, issue trackers, chat rooms, and mailing lists is expected to follow the code of conduct.
Notoriously inspired by jekyll/jekyll-seo-tag and jekyll/jekyll-sitemap.
FAQs
Unknown package
We found that jekyll-favicon demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
In this segment of the Risky Business podcast, Feross Aboukhadijeh and Patrick Gray discuss the challenges of tracking malware discovered in open source softare.
Research
Security News
A threat actor's playbook for exploiting the npm ecosystem was exposed on the dark web, detailing how to build a blockchain-powered botnet.
Security News
NVD’s backlog surpasses 20,000 CVEs as analysis slows and NIST announces new system updates to address ongoing delays.