Partials not work with static files

support
1

Hi everyone!
Tell me please what i’m doing wrong
I create new custom theme
something like this

project/theme/layouts/

  • /_default 

  •  /partials/header.html and footer.html

  •  /item/item.html

  •  index.html

  • 404.html

In default archetype project/archetypes/default.md
i’m add params like type: "item"
item.html look like this

{{partial “header.html” }}
Some content
{{partial “footer.html” }}

when i create new page - hugo new test.md
it creates me page with item type - it’s ok
but on this page header and footer not works like on project/static/index.html

all css and js files saved in project/static
why style from static folder not work in nested layout with using partial?
Thanks!

2

1st You missed the dots

3

Yes but it not very help
Nothing changes

4

Your template should be called /item/single.html if it’s for single pages or /item/list.html if it’s for list pages.

Also the above comment above the dot is right.

To clear things up please have a look at:

5

If I’m reading your source organization correctly (on my phone), you also need to move the partial directory up one level (ie, not under _default).

6

Ok i see
Now i created project/theme/layout/item/single.html
Then created new file hugo new a.md with type “item”
And nothing changes
All my css and js in {{partial "header.html" . }} - not visible on a.md
Here question is where i need to store css and js - by default they store in /project/static

partial directory exist on the same level near _default not in _default

7

The path is wrong.

It should be /project/themes/<theme name>/layouts/ and then everything else.

If you’re still having trouble then please post a link to your Hugo project’s source code so that we can troubleshoot this further.

8

Hi everyone!
Here example with simple hugo site and theme
example repo
Maybe i’m doing something wrong
Thanks!

9

I looked at your repo and it seems to me that you missed some important parts of building sites with hugo. You have index.html in folder static and not in layouts (where it belongs). And you have the same HTML code in partials/header.html as well as in static/index.html. Also your partial footer.html is completely empty. So your generated page is not compliant to HTML. It’s also missing the closing <body> and <html> elements.

When I started with Hugo some time ago the videos from Giraffe Academy helped me a lot: Hugo - Static Site Generator.

Hope this helps.

10

added closed tags in footer - creating new file and nothing happens
Little confused about stored index.html file in static folder and in theme/layouts folder - but ok done
Nothing changes again

11

If you want to implement a template in archetypes/default.md the front matter of type might not be enough. Please read my post about binding templates to content files: My experiences with Hugo's template lookup order

12

Cool post
i’m using in project/archetypes/default.md this code

title: "{{ replace .Name "-" " " | title }}"
date: {{ .Date }}
draft: true
type: "items"
layout: "single"

So i define type /project/themes/theme/layouts/items
-------and layout /project/themes/theme/layouts/items/single.html

In single.html layout i’m calling {{partial "header" . }} and {{partial "footer" . }}
With correct html tags and using /project/static/css/main.css
but problem here is why not working css files in content file item.md after hugo new item.md =(

13

You still have the same HTML code in your layouts/index.html as in your partials/header.html. This is not how it should be. index.html also is a layout (template) - don’t forget. The content, front matter and the URL for your front page (the generated index.html) usually come from content/_index.md and then your layouts/index.html could look like this:

{{ partial "header.html" . }}

{{ .Content }}

{{ partial "footer.html" . }}

But it’s much better workflow to have a layouts/_default/baseof.html where the frame of every page is included. You should read the docs: https://gohugo.io/templates/base/#readout. Without this knowledge you’ll not be able to develop good Hugo sites. And again: Watch the videos from Mike - they’re really good and ideal for beginning with Hugo.

Tipp: If you want to see your generated site in your editor you can use hugo server -d build/dev which creates a build/dev folder in the root of your project where you can examine the generated files. This works in real time if you make changes to your templates, partials, config etc.