CODEWITHSUNDEEP
github-pages
anshul
anshul

Reputation: 3131

Syncing code on static site between multiple html pages?

I have a large website with several consistent text, like the nav, contact, footer, etc. I was wondering how I could keep all of these consistent on my static website (hosted on github pages) by loading the code from another file or any other method, since currently I have to manually update everything and it takes a while.

Upvotes: 0

Views: 173

Answers (1)

Adrian J. Moreno
Adrian J. Moreno

Reputation: 14859

Github pages uses Jekyll as the underlying static site generator. You can break down your site into multiple smaller html pages that can be included into a main layout.

https://jekyllrb.com/docs/includes/

The include tag allows you to include the content from another file stored in the _includes folder:

{% include footer.html %}

Jekyll will look for the referenced file (in this case, footer.html) in the _includes directory at the root of your source directory and insert its contents.

Read the documentation on this and you can easily find repeated text/html and replace them with includes.

If you're not already, this site has instructions so you can run jekyll locally to verify changes before pushing the changes to Github.

Upvotes: 1

Related Questions