Beautiful Hugo Not able to read logo site param

My site can be found on github at: GitHub - eriksalt/cryptic_cabal_test

I made a new hugo site, included the Beautiful Hugo theme, and updated the logo. When built and run, the logo is not displayed, there is no underlying html tag being rendered.

In the themes nav.html I updated to add this trace:

    tktesting1
    {{ if isset .Site.Params "logo" }}
    tktesting2
    <div class="avatar-container">
      <div class="avatar-img-border">
        <a title="{{ .Site.Title }}" href="{{ "" | absLangURL }}">
          <img class="avatar-img" src="{{ .Site.Params.logo | absURL }}" alt="{{ .Site.Title }}" />
        </a>
      </div>
    </div>
    {{ end }}

When I build and run, I see tktesting1 in the source of the page but not tktesting2.
Here is the top of my hugo.toml with the logo param:

baseURL = 'https://www.crypticcabal.com/'
languageCode = 'en-us'
theme = "beautifulhugo"
title = "Cryptic Cabal"
logo = "img/avatar-icon.png"

I have had issues like this whenever I use themes and have ended up having to make my site design from scratch each time, so any help would be greatly appreciated!

What is the path to your image from the root directory of your project?

\static\img\avatar-icon.png

sorry, that is root-directoy\static\img\avatar-icon.png

The custom parameters in your site configuration need to be under the params key. For example:

baseURL = 'https://example.org/'
title = 'My Site'

[params]
subtitle = 'My subtitle'

And the path to the image should begin with a slash:

logo = "/img/avatar-icon.png"
1 Like

Thank you! I had to play with location of params but got it working!

Including the top part of my hugo.toml here for others with same problem.

baseurl = "https://www.mysite.com"
DefaultContentLanguage = "en"
title = "Sample Title"
theme = "beautifulhugo"

[Params]
# homeTitle = "Beautiful Hugo Theme" # Set a different text for the header on the home page
subtitle = "A collection of people"
mainSections = ["post", "posts"]
logo = "/img/avatar-icon.png" # Expecting square dimensions
favicon = "img/favicon.ico"
dateFormat = "January 2, 2006"
commit = false
rss = true
comments = false

readingTime = true
wordCount = true
useHLJS = true
socialShare = true
delayDisqus = true
showRelatedPosts = true

This path should also begin with a slash.

1 Like

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