New to Hugo and Web Dev, need help recreating a website

I’m trying to recreate a website and I almost got it to look the way I want which is something like this:

|------------------------|
| L |
| e |
| f |
| t |
| |
| S | Content Area |
| i |
| d |
| e |
| b |
| a |
| r ||
|------------------------|

The sidebar menu currently lives in /partials/menu.html and I was able to make is display on my blog posts page by including the line {{ partial “menu.html” . }} in my list.html file.

How do I make the sidebar menu display on every page on the site?

My second problem is that I need this blog posts page to display on the homepage instead of at /posts/ . How can I achieve this in Hugo?

Look at the themes, and pick one that looks like you want. Study it so you can learn how.

I tried starting with a theme and ended up changing way more code than I felt should be necessary and broke a ton of stuff. I’ve made more progress starting from scratch and I’m looking to create an almost 1:1 replica of an existing website.

I’m using list.html from hugo-initio to display my blog posts because I don’t fully know how Paginator works and it’s correctly displaying my posts under the url /posts/ . I copied this code into my home.html to get the posts to display on the homepage but this feels like bad practice and instead of only displaying files in /posts/ it also displays any files in any subdirectory under /content/ and I don’t know how to fix that.

I like Blackburn and it is a similar look to what you’ve described. You may end up loving it.

Is there an easy way to make that kind of sidebar menu in Blackburn scroll along with the page instead of staying in place?

Scroll? Like how? Its a side bar (and if page is too narrow, turns into a menu button)

So if I’m scrolling through those blog posts I’d like the side menu to scroll along with it and just have empty space at the bottom if the list of content is longer than the menu itself.

Sorry, I’m a dummy. New to blogging and not a web dev. I don’t know what you mean. I just use the side bar and it looks great. Good luck!

Sorry I don’t think I’m explaining it very well. I want the page to act as though the side menu and main content are glued together side-by-side, so when I scroll my mouse wheel both the side menu and the page content scroll at the same time, acting as one big page.

SO you want a background and two columns.

Use a single page template: https://gohugo.io/templates/single-page-templates/

And the homepage template for the home page: https://gohugo.io/templates/homepage/

You may also want to look into base templates to avoid copying things: https://gohugo.io/templates/base/

But in general, start reading here: https://gohugo.io/templates/ :wink:

/E