-1

I have a static website with lots of similar pages. The site is very simple, basically just some information for me and a few other people. I'd basically like to spend as little time as possible maintaining it.

Certain pieces show up on every page, and change every so often (the header and footer, for example, but other similar pieces are repeated too). I currently copy-paste them on every page they appear on, but this obviously is error-prone and is very frustrating for me to maintain.

My initial thought was JS to load similar pieces of the site, but this feels like overkill for such a simple site, and makes reading the site offline (in a text editor or terminal for example) a giant pain because one has to jump between different files.

My second thought was to just use the C preprocessor to generate the HTML files, for example doing #include "repeated_section.html" and a few macros to build up the HTML from pieces. This seems to work well, (the generated HTML works, and is nice and readable in a text editor), but feels kind of hackey. Is there a "proper" tool for doing this? Has anyone tried my way and run into any problems?

Improve this question
4
  • 1
    There are many, many, many static site generators and template engines specifically for your use case. The C preprocessor is horrible here because it still tries to tokenize your HTML as if it were C, in order to apply any macros. Note that GH pages has built-in support for the Jekyll static site generator. Commented Mar 22, 2019 at 18:36
  • @amon, yes, I realize the C preprocessor is not ideal for this use case, which is why I asked this question in the first place Commented Mar 22, 2019 at 18:39
  • downvoter, care to explain? Commented Mar 22, 2019 at 18:46
  • Use a static site generator. Gatsby with React seems popular. Commented Mar 23, 2019 at 16:40

1 Answer 1

Reset to default
3

Your web-server itself can do this with Server Side Includes.

Use the include directive in your page to insert a header and/or footer file.

<!--#include virtual="/footer.html" -->

Sadly, this doesn't work with GitHub Pages, but they do have a similar feature.

from Configuring GitHub Pages

GitHub Pages can include other files, similarly to SSI or PHP includes, but in this case the files to be included must be located in a top-level subdirectory called _includes. 

{% include nav.html %}
Improve this answer
3
  • I forgot to mention, I have nothing server side, it's all hosted with GH pages. Would this still work? Commented Mar 22, 2019 at 18:34
  • @CoffeeTableEspresso No, this depends on the server (like Apache). Commented Mar 22, 2019 at 18:37
  • It also works for nginx and IIS Commented Mar 22, 2019 at 18:40

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.