Ad

How To Include An External HTML-Head?

- 1 answer

I'm back to coding a small business website and it seems silly to have like 40% duplicate code (head and menu) across 10 HTML-pages. On the other hand, it also seems overkill to throw something like Next.js at such a small project.

Is there a simple way to mitigate the duplicate code by including a head.html within every page either server- or client-side?

Ad

Answer

I prefer PHP. Change your .html (static) pages into .php (dynamic) pages. Just 'save as'. You can separate pretty much anything into templates.

You have the following simplified file structure:

index.php

header.php

home.php

footer.php

style.css

The index.php contains + calls the header.php + home.php + footer.php

The header.php has your menus, etc.

the home.php can have your slider, and more sections, etc.

the footer.php has your menus + copyright, etc.

the style.css has your styles and you can have many .css files depending what you want styled.

You can expand this to your other pages: about.php, services.php, contact.php, etc.

Into index.php file you add something like

<?php require ('your-folder-for-content/header.php'); ?>

<?php require ('your-folder-for-content/home.php'); ?>

<?php require ('your-folder-for-content/footer.php'); ?>

Close </html> bracket at the end of your footer.

One page or little repeated sections call the other and redundancy is prevented.

Ad
source: stackoverflow.com
Ad