reworked site icons, added generator script

This commit is contained in:
Gabriele Musco 2021-04-19 09:57:44 +02:00
parent 95bb68db0f
commit 45a2cae2d1
No known key found for this signature in database
GPG Key ID: 8539FD3454380B83
12 changed files with 75 additions and 11 deletions

View File

@ -1,4 +1,4 @@
![logo](static/img/icon.svg) ![logo](static/logo.svg)
# Ficurinia # Ficurinia
@ -36,8 +36,13 @@ summaryLength = 70 # number of words for article summaries
author = "Gabriele Musco" author = "Gabriele Musco"
description = "A description for my website" # this will be added as metadata description = "A description for my website" # this will be added as metadata
logo = "/images/mylogo.png" # It's best to put these icons in the "static" folder of your site
favicon = "/images/myfavicon.png" logo = "/logo.svg"
favicon = "/favicon.png"
faviconIco = "/favicon.ico"
appletouch = "/apple-touch-icon.png"
svgicon = "/logo.svg"
showTags = true # show the Tags menu item; default true showTags = true # show the Tags menu item; default true
showRss = true # show the link for the RSS feed; default true showRss = true # show the link for the RSS feed; default true
@ -178,6 +183,27 @@ Following is an example configuration:
| `featured` | Boolean, indicate if the post should be shown as featured | | `featured` | Boolean, indicate if the post should be shown as featured |
| `image` | The main image representing the post | | `image` | The main image representing the post |
## Generate icons
It's best to use the provided `generate_icons.sh` script to generate all necessary icons for your website. This script requires ImageMagick, that you will need to install separately.
For the best results, place your logo in svg format inside the `static` directory of your website, rename it to `logo.svg` and then call `./themes/hugo-ficurinia/generate_icons.sh static/logo.svg`.
The script will take care of generating all the icons you need.
Finally, make sure to edit your config.toml to include the following:
```toml
# ...
[params]
logo = "/logo.svg"
favicon = "/favicon.png"
faviconIco = "/favicon.ico"
appletouch = "/apple-touch-icon.png"
svgicon = "/logo.svg"
# ...
```
## Inject custom content ## Inject custom content
Ficurinia supports injecting custom content into the theme. There are several files you can create in `layouts/partials/inject` that will be included inside the theme in different places. Ficurinia supports injecting custom content into the theme. There are several files you can create in `layouts/partials/inject` that will be included inside the theme in different places.

18
generate_icons.sh Executable file
View File

@ -0,0 +1,18 @@
#!/bin/bash
if [ -z "$1" ]; then
echo "Usage: $0 path/to/icon.svg"
exit 1
fi
FNAME=$1
if [ ! -f "$FNAME" ]; then
echo "Error: file $FNAME doesn't exist"
exit 1
fi
DESTDIR="$(dirname "$FNAME")"
convert -density 1200 -background none -resize 32x32 "$FNAME" "$DESTDIR/favicon.ico"
convert -density 1200 -background none -resize 32x32 "$FNAME" "$DESTDIR/favicon.png"
convert -density 1200 -background none -resize 180x180 "$FNAME" "$DESTDIR/apple-touch-icon.png"
convert -density 1200 -background none -resize 192x192 "$FNAME" "$DESTDIR/android-chrome-192x192.png"
convert -density 1200 -background none -resize 512x512 "$FNAME" "$DESTDIR/android-chrome-512x512.png"

View File

@ -15,7 +15,7 @@
{{ end }} {{ end }}
{{ end }} {{ end }}
<link rel="shortcut icon" href='{{ .Site.Params.favicon | default "/img/favicon.png" }}' type="image/x-icon" /> {{- partial "head_icons.html" . -}}
<title> <title>
{{ if and (.Title) (ne .Title .Site.Title) }} {{ if and (.Title) (ne .Title .Site.Title) }}

View File

@ -0,0 +1,20 @@
<link
rel="icon"
href='{{ .Site.Params.favicon | default "/favicon.png" }}'
/>
<link
rel="shortcut icon"
href='{{ .Site.Params.faviconIco | default "/favicon.ico" }}'
type="image/x-icon"
/>
<link
rel="apple-touch-icon"
href='{{ .Site.Params.appletouch | default "/apple-touch-icon.png" }}'
/>
{{ if .Site.Params.svgicon }}
<link
rel="icon"
href='{{ .Site.Params.svgicon | default "/logo.svg" }}'
type="image/svg+xml"
/>
{{ end }}

View File

@ -2,7 +2,7 @@
{{- partial "inject/header-before.html" . -}} {{- partial "inject/header-before.html" . -}}
<div class="titleAndSearchContainer"> <div class="titleAndSearchContainer">
<div id="titleContainer"> <div id="titleContainer">
<img src='{{ .Site.Params.Logo | default "/img/icon.svg" }}' /> <img src='{{ .Site.Params.Logo | default "/logo.svg" }}' />
<div> <div>
<div class="titleAndHamburger"> <div class="titleAndHamburger">
<h1>{{ .Site.Title | default "Ficurinia" }}</h1> <h1>{{ .Site.Title | default "Ficurinia" }}</h1>

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

BIN
static/apple-touch-icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.9 KiB

BIN
static/favicon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.2 KiB

BIN
static/favicon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.3 KiB

View File

@ -13,17 +13,17 @@
viewBox="0 0 67.733331 67.733335" viewBox="0 0 67.733331 67.733335"
version="1.1" version="1.1"
id="svg8" id="svg8"
inkscape:version="1.0 (4035a4fb49, 2020-05-01)" inkscape:version="1.0.2 (e86c870879, 2021-01-15, custom)"
inkscape:export-filename="/home/gabmus/git/gabmus.gitlab.io/themes/hugo-ficurinia/static/img/favicon.png" inkscape:export-filename="/home/gabmus/git/hugo-ficurinia/static/img/appletouch.png"
inkscape:export-xdpi="48" inkscape:export-xdpi="67.5"
inkscape:export-ydpi="48"> inkscape:export-ydpi="67.5">
<defs <defs
id="defs2" /> id="defs2" />
<sodipodi:namedview <sodipodi:namedview
inkscape:window-maximized="1" inkscape:window-maximized="1"
inkscape:window-y="27" inkscape:window-y="32"
inkscape:window-x="0" inkscape:window-x="0"
inkscape:window-height="1376" inkscape:window-height="1371"
inkscape:window-width="2560" inkscape:window-width="2560"
showguides="true" showguides="true"
inkscape:snap-global="true" inkscape:snap-global="true"

Before

Width:  |  Height:  |  Size: 7.6 KiB

After

Width:  |  Height:  |  Size: 7.6 KiB