Add favicon to risotto theme website

Using Themes
1

How to add favicon? I have tried using favicon generater and adding html to layouts/partials/head/custom.html and favicons to static but doesnt work

2

Is this is the theme?

3

Yes sir. That is the theme I am using

4

I’m afraid that you have to override the template via creating the following file, since the head/custom won’t will imported by the theme automatically.

layouts/partials/head.html 
<title>{{ with .Title }}{{ . }} &ndash; {{end}}{{ .Site.Title }}</title>
{{ with .Site.Params.about }}<meta name="description" content="{{ .description }}">{{ end }}
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8"/>
{{ if .Site.Params.noindex }}<meta name="robots" content="noindex" /> {{ end }}

<!-- FontAwesome <https://fontawesome.com/> -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.2/css/all.min.css" integrity="sha512-1sCRPdkRXhBV2PBLUdRb4tMg1w2YPf37qatUFeS7zlBy7jJI8Lf4VHwWfZZfpXtYSLy85pkm9GaYVYMfw5BC1A==" crossorigin="anonymous" />

<!-- Academicons <https://jpswalsh.github.io/academicons/> -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/academicons/1.9.1/css/academicons.min.css" integrity="sha512-b1ASx0WHgVFL5ZQhTgiPWX+68KjS38Jk87jg7pe+qC7q9YkEtFq0z7xCglv7qGIs/68d3mAp+StfC8WKC5SSAg==" crossorigin="anonymous" />

<!-- risotto theme -->
<link rel="stylesheet" href="{{ printf "css/palettes/%s.css" (.Site.Params.theme.palette | default "base16-dark") | absURL }}">
<link rel="stylesheet" href="{{ "css/risotto.css" | absURL }}">
<link rel="stylesheet" href="{{ "css/custom.css" | absURL }}">

// import the custom partial.
{{ partialCached "head/custom" . }}
1 Like
5

The simplest way to add a favicon (I don’t know about manifest files) is with

<link rel="icon" type="image/x-icon" href="path/to/favicon.ico">

Whether there’s already a default favicon or not in a theme is simple, just search in your files for rel=icon or rel=“icon”.
Write the link tag in custom.html so it’s not overwritten by new updates, then put the icon at the root of static for simplicity’s sake…) and you’re good to go.

6

You have to call the partial to your head.html like @razon commented.

7

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.