search

zwbetz-gh / cupper-hugo-theme

An accessibility-friendly Hugo theme, ported from the original Cupper project.
https://cupper-hugo-theme.netlify.app/
MIT License
300 stars 190 forks source link

Bit confused about how to move dark theme switch to sidebar and add image in sidebar #48

Closed talkingnews closed 3 years ago

talkingnews commented 3 years ago

This theme is great for people with visual impairment, but it's probably better if the dark theme switch could be in the sidebar, as well as an icon.

If you look at https://www.talking-news.info/, all I want to do is move the switch and the AWS cert (including a hyperlink) to the sidebar (below the links, not to replace the site logo)

No matter what I try, it just messes up. I've worked everything else out but not this.Sorry if I'm being thick, guidance much appreciated.

zwbetz-gh commented 3 years ago

I've added a new param called moveFooterToHeader. If you set this to true then it will move the footer, including the theme switcher, to the header.

For technical details see commit https://github.com/zwbetz-gh/cupper-hugo-theme/commit/78021345d9f3bd1f342d87d82333d9718786e327

Screenshots

moveFooterToHeader as false

moveFooterToHeader as false

moveFooterToHeader as true

moveFooterToHeader as true

andreseduardop commented 3 years ago

If you look at https://www.talking-news.info/, all I want to do is move the switch and the AWS cert (including a hyperlink) to the sidebar (below the links, not to replace the site logo)

@talkingnews, You can do this by modifying the header.html partial template.

talkingnews commented 3 years ago

@zwbetz-gh - that's genius! Thank you. @andreseduardop - thanks also. Hugo theming is a bit new to me so I'd never had thought of looking at header for sidebar. But I prefer @zwbetz-gh's new easy solution 👍🏻

It appears that somewhere along the line I've messed something up so that dark theme isn't now filling the full main content frame on the right for a short page (even though 100vh looks right) but I think that's a "me" problem rather than a theme problem. Thanks again.

andreseduardop commented 3 years ago

@talkingnews When I started with Hugo I also preferred to leave everything as it was. :smile: However, I now enjoy making minor adjustments to the templates. To avoid breaking something, you can copy the theme file and paste it directly into your Hugo folder.

I explain. For example, to change the template "header.html" located in "\my-hugo-site\themes\cupper-hugo-theme\layouts\partials", I first make a copy of it in "\my-hugo-site\layouts\partials". Then I modify this last copy. Keeping the original theme template intact. In the Build process, Hugo will give priority to the file stored in my /layouts/ folder. And it will discard the file of the same name stored in the /layouts/ folder of the theme.