Hugo: Need multiple static pages - home, about, contact, prices etc.

[lydenyardley]

I'm building a business website with a blog, but can't see how to easily add more static pages beyond the index.html template.

My question/issue is the same as Ryan's here: http://discuss.gohugo.io/t/creating-static-content-that-uses-partials/265

So I need to be able to use partials too. I feel like having an about.html in the layouts file should exist at site.com/about/ ?

Is there something we're missing?

[CalvinMcGee]

Just use hugo new about.md to create new markdown file, if the pages are using the same layout. The url would then be /about/.

If you only need one layout for the other pages except for index, you should create that template in /layouts/_default/single.html and partials you would have to put in /layouts/partials/.

[lydenyardley]

So that second point you made - that's the thing... I need a separate layout for /about/ and /projects/ etc.

[paulsullivan]

When you say static pages do you mean you want to hard code the content and html rather than use markdown and simply include some partials such as headers and footers; or do you mean one off standalone pages that will use content generated from markdown?

[anthonyfok]

Hi @lydenyardley,

So that second point you made - that's the thing... I need a separate layout for /about/ and /projects/ etc.

It has been a while, and I am sure you have found the solution already, but in any case, here is my understanding:

• /layouts/_default/single.html: Applies to /content/about.md, /content/contact.md, etc. (and anything else that aren't covered by other section templates like /layouts/projects/single.html), appearing as http://example.com/about/ and http://example.com/contact/
• /layouts/about/single.html: Applies to /content/about/our-company.md, /content/about/our-products.md, etc., appearing as http://example.com/about/our-products/ etc.
• /layouts/projects/single.html: Applies to /content/projects/red-cross.md, /content/projects/unicef.md, etc., appearing as http://example.com/projects/red-cross/ etc.

Hope this helps!

[anthonyfok]

Hi again @lydenyardley,

If you haven't read it yet, the post by Michael Henderson (@quoha) may be helpful: http://discuss.gohugo.io/t/creating-static-content-that-uses-partials/265/9

and likely better than what I have written in my previous post here. :-)

[flowchartsman]

It has been four months since the last post of the bug reporter. Propose closing this.

[anthonyfok]

Good idea, @alaska! Let's do that then! :-)

[Fjolnir-Dvorak]

I would like to have this issue open again because it is not really solved. There are a few dirty hacks which are far away from beeing simple for newcomers. And in Germany we have to have sites like "impressum" and "privacy". Both are single page static files like @lydenyardley asked for. I think static pre-defined files (however we should call those static-static files) are a very common use-case. It would at least be nice to write a few words about static pages in the documentation to help everyone or to let the developer know he should search another engine that is capable of solving this problem.
This is definetely a problem which is able to disgust developers when searching a static web engine.

[bogem]

I also have an attribution page and I solved this problem in a very simple way: I just added all "static-static" files to static directory. So hugo copies all static files to public dir. Here you can see an example: http://pravosudie-ufa.ru/attribution.html.

[Fjolnir-Dvorak]

I thought of that too. But as far as the documentation says the static files are static and can not be parsed to extract header, footer and other redundant content.

[bogem]

As there are not so many similar pages you can hard-code header/footer/etc to these pages😃
Or use no css/js decoration at all.

[bogem]

Very useful page to read: https://gohugo.io/templates/content/
E.g. you can create /layouts/misc/single.html, add custom partials and add type = "misc" in frontmatter of content file.

[Fjolnir-Dvorak]

which seems to me like a very dirty hack because it makes it more difficult to deploy my template to multiple projects which should be easy to edit for someone not beeing a webmaster. And I do not think redudancy is really the option to choose? Just thinking of the menus on those pages...

What I would suggest is an option to parse the static folder or the creation of a new parsed-static folder. That will solve this problem and will also enable an easy workaround for missing css/js preprocessors.

I read that. For myself I have another workaround which enables the possiblilty of different layouts (_index.md) which I think is still confusing for those who will manage the website later on.

[Fjolnir-Dvorak]

You are right, it is possible to solve this issue (workarounds). But they are far from obviously for someone new to hugo. And I think this is the point where this issue is still an issue and is still relevant.

[bep]

@Fjolnir-Dvorak you are right, and we are in the process of refurbishing the documentation site. But we have a limited set of resources, so we cannot track the issues on this level of detail.

[rdwatters]

@Fjolnir-Dvorak

Here is the explanation of static in the new docs. That said, please do me a favor and open a new thread on the Hugo forums for further discussion since this conversation is unlikely to get much attention as an addendum to a closed issue. I'd love your feedback and thoughts on how to make this easier for new users. (We can also talk with the community about the multilingual proposition you brought up today on Gitter :smile:).

Thanks much for your support of Hugo!

[ingenthr]

I found this after quite a bit of google searching ("hugo" and "single" or "standalone html" make for lots of results) and it solved my problem, but I'd also argue that the description of static in the docs doesn't make it clear that you can have regular .html in the static. Most things were leading to this page: http://gohugo.io/templates/homepage/

Might be worth making it clear there that dropping .html files in to layout won't render them unless there is .md content attached, and the way to do that would be to put them in static.

[liquiddandruff]

Wanted to do the same thing as well, and couldn't find a good solution until I found a hint at https://gohugo.io/content/using-index-md/

In particular, these lines

Here are a couple of examples to make it clearer…
_index.md location Page affected Rendered by
/content/post/_index.md site.com/post/ /layouts/section/post.html

So to get an about page, I placed an empty _index.md in /content/about/_index.md and made the corresponding template in /layouts/section/about.html, which yields example.com/about/ as expected.

Surprisingly, I then tried removing /content/about to see if it would still work (so an empty /content/, and it does! So to get static pages, it seems we'd only need to create the desired x.html in /layouts/section/x.html to get example.com/x/.

The docs should be updated/clarified to reflect this feature (i'll try to do it once free).

EDIT: Well, false alarm. Seems the debug server just cached the results; we'd still need to create the corresponding content for hugo to render the sections layouts. Perhaps there could be a flag to enable this this behaviour anyways to get static pages?

[rdwatters]

@liquiddandruff I am soliciting feedback for the new docs concept. I think everything you mentioned has been detailed on https://hugodocs.info (e.g., lists, section templates, ) more than once. If you can provide feedback, please do so on the forums - https://discuss.gohugo.io - if you wouldn't mind. This type of conversation is much better suited for the forums since any discoveries you make are very unlikely to be discoverable (i.e., beneficial) to the Hugo community within the context of a GH issue. Thanks much for your support of Hugo! :smile:

[bluebrown]

Wanted to do the same thing as well, and couldn't find a good solution until I found a hint at https://gohugo.io/content/using-index-md/

In particular, these lines

Here are a couple of examples to make it clearer…
_index.md location Page affected Rendered by
/content/post/_index.md site.com/post/ /layouts/section/post.html

So to get an about page, I placed an empty _index.md in /content/about/_index.md and made the corresponding template in /layouts/section/about.html, which yields example.com/about/ as expected.

Surprisingly, I then tried removing /content/about to see if it would still work (so an empty /content/, and it does! So to get static pages, it seems we'd only need to create the desired x.html in /layouts/section/x.html to get example.com/x/.

The docs should be updated/clarified to reflect this feature (i'll try to do it once free).

EDIT: Well, false alarm. Seems the debug server just cached the results; we'd still need to create the corresponding content for hugo to render the sections layouts. Perhaps there could be a flag to enable this this behaviour anyways to get static pages?

The issue with that is, that you create a new section. You may not notice it but if you want to rely on some features that of hugos templating engine, being in a different section can cause issues.

For example if you wanted to use the paginator on the about page to paginate posts from the main section. The paginator will paginate the current section which is the about section without any posts. Things like this.