Language switcher does not apply style.css style

Hey! I found a simple language switcher and was even able to integrate it for “my” theme, but found that it does not apply the style from style.css. I had to add < style> < /style> to the switch code, which is not very convenient. The switch code looks like this:

          <ul class="language-list">
              {{ range $.Site.Home.AllTranslations }}
              <li><a href="{{ .Permalink }}">{{ .Language.LanguageName }}</a></li>
              {{ end }}

What am I missing?

Please read:

Include a link to the source code repository of your project, because we really need the context of seeing your templates and partials to be able to help you. It is trivial to do a quick git clone on your repo, then run hugo server in your project, to help you out. On the other hand, recreating your code from screenshots, or sort of guessing at it, is not.

If you can’t share your repository for whatever reason, consider creating a dummy repo that you can share, which reproduces the problem you’re experiencing.

I am using etch for the base and replaced the colors (background, links color)

This is the theme repository. Please share the repository for your project.

I don’t have it! I used this theme, changed a few lines, added to config.toml

DefaultContentLanguage = "en"
    languageName = "En"
    weight = 1
    languageName = "pl"
    weight = 2

opened themes/etch/layouts/partials/header.html and added the code from the first post to the very top. Well, I created a couple of pages with and

I am not trying to be difficult. Please help me to help you. If you do not have a public git repository, perhaps you can zip up your entire project directory and post it somewhere.

The purpose of sharing your project code is to make is easy for someone else (me, for example) to reproduce the behavior locally.


Hope the dropbox will fit

I am unable to reproduce this problem when I run hugo server.

Also, instead of editing a theme template, it is better to override a theme template. For example:

mkdir -p layouts/partials/
cp themes/etch/layouts/partials/header.html layouts/partials/

I managed to solve the problem using

.language-list, li, a {

in style.css

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