Is it possible to have a hugo site with one theme "inside" a hugo site with another theme?


#1

Say I want a typical blog theme for my blog. Theme A for website A which is at www.example.com. But I want to make a presentation using one of the lovely Hugo presentation themes like Reveal or something. I don’t want to host that “website” on another domain… just somewhere like www.example.com/presentation/

  1. Is this possible at all?

  2. Is this possible on Netlify?


#2

Easiest way i can think of is to set the appropriate baseurl for both, build each site separately, then copy the “inner” site to the appropriate location inside the “outer” side.

So, something like:

  • Set baseurl of site A to www.example.com
  • Build site A, copy to destination
  • Site baseurl of site B to www.example.com/presentation/
  • Build site B
  • Create folder presentation/ at the root of site A’s generated files
  • Copy contents of site B’s public/ folder to site A’s presentation/ folder

That should be all you need to do to get that working. I don’t think there’s a way to have Hugo build both together, though.


#3

This is what the “components” theme inheritance is about. It won’t just merge themes as they are listed in the showcase, but themes can be broken into components that load in different ways, such as “by section”, as in your presentation example.


#4

I do what you mentioned for 2 sites of mine except for those 2 last steps. There’s a simple way… a forced 200 redirect (I have an example below using Netlify).

Let’s say I have 2 sites ready at foo.netlify.com and prez.netlify.com, and I want to access the prez site as foo.netlify.com/prez. I can simply add this to the foo.netlify.com site’s _redirects:

/prez/* https://prez.netlify.com/:splat 200!

Here are my real sites where I do this:

Notice the theme difference between those two sites.


#5

That’s a great way. The component theme can have layout defined just for a presentation/ section, or something like that.

When user navigates to YOURSITE/presentation, they’ll see the layouts applied from that component theme.


#6

Ah vaguely recall that now! Thanks, so using that, it should be possible to build it all as one site with the single Hugo command, and it’s all in the same repo, yea? You’re just saying “use this theme for content here, this theme for content anywhere else”.

I’ll have to look into the docs for this. Do you have much experience with this or you just know about it?


#7

I picked it up from reading the issue at the time. I haven’t used it publicly, but I am playing with making just a component-based system, on top of an HTML-only (sans CSS or JS) theme.

You should ask for example sites using components. :slight_smile:


#8