I’m learning Hugo to convert my html/css business web site to Hugo and add components (blog, search). I’ve read two books (Atishay Jain’s “Hugo In Action” and Brian Hogan’s “Build Websites with Hugo”) as well as many web pages for insights on specifics. Because there are alternate ways of developing web sites with Hugo I would like clarification on some of what confuses me.
My immediate need is better understanding of what should go in the web
site’s root directory and what in a theme’s directory. For example, both the root directory and the themes directory have layout/ subdirectories with _default/, partial/, and others, as well as baseof.html and other html
files.
What belongs in the root layout/ directory tree and what in a theme’s
layout/ directory tree?
Similarly, does the navigation menu go in the root config.yaml/.toml (or
config/config.*) or in a theme’s config file?
You might want to review Hugo's Lookup Order | Hugo since that probably explains it as fully as you’re likely to need. The short and over-simplified answer is that root-level items will override corresponding theme items.
If you are developing a site from scratch (no ready made theme) you can opt to build your own theme or put everything in the root “layout”, “assets” etc. directories. It makes no difference function wise.
If you plan to reuse the templates etc. on multiple sites I recommend building your own theme since that makes it portable.
If you use a ready made theme to get started the root directories are used to override files from the theme. If you e.g. want to change the “single.html” template you copy it over to the root “layout” directory and edit it there.
This way you do not need to edit the theme itself and can easily upgrade to new versions etc.
If you are developing a site from scratch (no ready made theme) you can
opt to build your own theme or put everything in the root “layout”,
“assets” etc. directories. It makes no difference function wise.
Fredrik,
I’ve dug myself into a hole using parts from the “Hugo In Action” book and
parts from “Build Web Sites With Hugo” book. They use different approaches
which apparently incompatible. Sigh.
While I’d like to use the Hugo template Tikva I don’t know enough to modify
it for my company web site so I’ve tried building my own theme, again using
parts from both books. I’ve used only html and css for my company web site
since 1994 and despite many upgrades (now using html5 and css3) I need the
capabilities provided by Hugo. My company web site is the only one; I’m not
in the computer industry so there are no other web sites of interest to me.
If you use a ready made theme to get started the root directories are used
to override files from the theme. If you e.g. want to change the
“single.html” template you copy it over to the root “layout” directory and
edit it there.
This way you do not need to edit the theme itself and can easily upgrade
to new versions etc.
That’s a great idea and I’ll take your recommendation. But, my lack of Hugo
knowledge means that I don’t understand most of what’s in the Tikva theme’s
exampleSite/config.toml if I copy it to my web site’s root directory.
Now, when I run the hugo server, I see the index page, but no longer see an
unformatted menu system. When I could access the menus I was able to
navigate to all pages. If I can get the server to load the menu it will
allow me to learn bootstrap so I can control the presentation of the pages.
Create new issues for any other specific questions you have. For most issues you will get better help if you post a link to your repo so people here can test your code.
Without the code we need to guess or read your mind, neither an easy task :-).
I took your advice and copied the hugo tikva theme’s config.toml to my
site’s root directory, then modified it. Running ‘hugo server’ I still don’t
see the menu. I’m sure there are either errors in my modifications or
necessary components I’ve not provided.
The config.toml is 398 lines long. I’ve posted that file to fileconvoy.com where
it will be available for 5 days. The url is: <tinyurl.com/539sz9r8>.