daviddarnes · daviddarnes · Mar 13, 2019 · Mar 13, 2019 · Mar 13, 2019 · Mar 13, 2019
diff --git a/README.md b/README.md
@@ -121,7 +121,7 @@ There are a number of optional settings for you to configure. Use the example [`
 
 ### Site settings
 
-You'll need to change the `description`, `title` and `url` to match with the project. You'll also need to replace the `/assets/logo.svg` and `/assets/default-social-image.png` with the project logo and default social image. Setting the site language can be done with `lang`, the theme will default to `en-US`. The `email` needs to be changed to the email you want to receive contact form enquires with. The `disqus` value can be changed to your project username on [Disqus](https://disqus.com), remove this from the `/_config.yml` file if you don't want comments enabled. Look for the `Site settings` comment within the `/_config.yml` file. The `repo` setting is optional, for now, and can be removed entirely, if you wish.
+You'll need to change the `description`, `title` and `url` to match with the project. You'll also need to replace the logos, default social and default offline images in the `/assets/` directory with your own graphics. Setting the site language can be done with `lang`, the theme will default to `en-US`. The `email` needs to be changed to the email you want to receive contact form enquires with. The `disqus` value can be changed to your project username on [Disqus](https://disqus.com), remove this from the `/_config.yml` file if you don't want comments enabled. Look for the `Site settings` comment within the `/_config.yml` file. The `repo` setting is optional, for now, and can be removed entirely, if you wish.
 
 Google Analytics can be enabled via the site configuration too. Add your tracking ID to the `/_config.yml` file in the following method: `google_analytics: 'UA-XXXXXXXX-1'`
 

diff --git a/_config.yml b/_config.yml
@@ -6,7 +6,8 @@
 # 5. Collections
 # 6. Jekyll collections settings
 # 7. Site settings
-# 8. Site navigation
+# 8. Site favicons & manifest icons
+# 9. Site navigation
 
 # 1. Files excluded from Jekyll builds
 exclude:
@@ -83,19 +84,26 @@ defaults:
 encoding: utf-8 # Make sure the encoding is right
 lang: en-GB # Set the site language
 title: "Alembic" # Site name or title, also used in jekyll-seo-tag
-logo: "/assets/logo.svg" # Site logo, also used in jekyll-seo-tag
+logo: "/assets/logos/logo.svg" # Site logo, also used in jekyll-seo-tag
 description: "Alembic is a starting point for Jekyll projects. Rather than starting from scratch, this boilerplate is designed to get the ball rolling immediately" # Site description and default description, also used in jekyll-seo-tag
 url: "https://alembic.darn.es" # Site url, also used in jekyll-seo-tag
 baseurl: ""
 repo: "https://github.com/daviddarnes/alembic"
 email: "me@daviddarnes.com"
 # disqus: "alembic-1" # Blog post comments, uncomment the option and set the site ID from your Disqus account
-avatarurl: "https://www.gravatar.com/avatar/6c0377abcf4da91cdd35dea4554b2a4c" # Uses avatars for favicons to get multple sites, eg Gravatar, Twitter, GitHub
 # google_analytics: ''
 # service_worker: false # Will turn off the service worker if set to false
 css_inline: true # Will insert all styles into a single <style> block in the <head> element and remove the style <link> reference
 
-# 8. Site navigation
+# 8. Site favicons & manifest icons
+favicons: # Favicons are also used in the manifest file. Syntax is 'size: path'
+  16: '/assets/logos/logo@16px.png'
+  32: '/assets/logos/logo@32px.png'
+  96: '/assets/logos/logo@96px.png'
+  512: '/assets/logos/logo@512px.png'
+  1024: '/assets/logos/logo@1024px.png'
+
+# 9. Site navigation
 navigation_header:
   Home: /
   Elements: /elements/

diff --git a/_includes/site-favicons.html b/_includes/site-favicons.html
@@ -1,4 +1,6 @@
-<link rel="icon" type="image/png" href="{{ site.avatarurl }}?s=16" sizes="16x16">
-<link rel="icon" type="image/png" href="{{ site.avatarurl }}?s=32" sizes="32x32">
-<link rel="icon" type="image/png" href="{{ site.avatarurl }}?s=96" sizes="96x96">
-<link rel="shortcut icon" href="{{ site.avatarurl }}">
+{% if site.favicons %}
+  {% for icon in site.favicons %}
+    <link rel="icon" type="image/png" href="{{ icon[1] }}" sizes="{{ icon[0] }}x{{ icon[0] }}">
+  {% endfor %}
+{% endif %}
+<link rel="shortcut icon" href="{{ site.avatarurl + '?s=32' | default: site.logo }}">
diff --git a/_layouts/default.html b/_layouts/default.html
@@ -30,7 +30,7 @@
       <link rel="stylesheet" href="{{ "/assets/styles.css" | relative_url }}">
     {% endif %}
 
-    {% if site.avatarurl %}{% include site-favicons.html %}{% endif %}
+    {% if site.favicons or site.avatarurl %}{% include site-favicons.html %}{% endif %}
 
     {% if site.google_analytics %}{% include site-analytics.html %}{% endif %}
 

diff --git a/assets/logo.svg → assets/logos/logo.svg b/assets/logo.svg → assets/logos/logo.svg
diff --git a/assets/logos/logo@1024px.png b/assets/logos/logo@1024px.png
diff --git a/assets/logos/logo@16px.png b/assets/logos/logo@16px.png
diff --git a/assets/logos/logo@32px.png b/assets/logos/logo@32px.png
diff --git a/assets/logos/logo@512px.png b/assets/logos/logo@512px.png
diff --git a/assets/logos/logo@96px.png b/assets/logos/logo@96px.png
diff --git a/assets/manifest.json b/assets/manifest.json
@@ -8,12 +8,16 @@ layout: none
   "short_name": "{{ site.title | replace: ' ', '' }}",
   "theme_color": "{{ site.manifest.theme_color | default: '#24292e' }}",
   "background_color": "{{ site.manifest.background_color | default: '#ffffff' }}",
-  "icons": [
-    {
-      "src": "{{ site.logo }}",
-      "sizes": "512x512"
-    }
-  ],
+  {% if site.favicons %}
+    "icons": [
+      {% for icon in site.favicons %}
+        {
+          "src": "{{ icon[1] }}",
+          "sizes": "{{ icon[0] }}x{{ icon[0] }}"
+        }{% if forloop.last != true %},{% endif %}
+      {% endfor %}
+    ],
+  {%- endif -%}
   "start_url": "/",
   "display": "standalone"
 }