How to make a common header and footer for a website with many pages

As I’ve learned from designing many websites, making separate files for header and footer if you have more than one page makes you write less code and saves your time. Follow below simple steps:

• 1. Headers need to be in a separate file. For Example: header.html

  

• 2. Footers need to be in a separate file. For example: footer.html

  

• 3. For Index.html, We need to add jQuery Plugin, div for header & footer, and load header and footer in a "script" tag.

  jQuery CDN link:

  https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js

  Div for header and footer:

  

  Load header and Footer:

  The "script" tag should put inside the "head" tag. Example of "script" tag:

  

Note: This common header and footer will not work on local machines. In order for it to work, we need to upload it on GitHub or any similar platform.

These simple steps will save you tons of time. Happy Coding!!!!!!!