I’ve looking for this for years, but it’s actually much simpler than I thought. You can build your HTML website with universal header and footer (so you don’t have to repeat update multiple files over and over again) by adding a simple JavaScript/Jquery line without using any programming PHP scripts.
HTML
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script>
$(function(){
$("#header-template").load("header.html");
$("#footer-template").load("footer.html");
});
</script>
<div id="header-template"><!--Your header.html placeholder--></div>
<!--Your content start here-->
Hello World!
<!--Your content end here-->
<div id="footer-template"><!--Your footer.html placeholder--></div>
Instruction
- Create a
header.htmland put all the header portion starting with<!DOCTYPE html>. - Create a
footer.htmland put all the footer portion end with</html>. - Create a
index.htmland copy and paste the HTML code (from the top of this article) into your HTML document. - Build your own content by replacing the text “Hello World!” and save.
- Open the
index.htmland review yourself.
You can duplicate the index.html and rename it differently for any additional pages you wish to create. This JavaScript works on a server environment, so this will not be able to load header and footer if you are opening the files from your desktop which means you need to upload your files via FTP and access your HTMLs live.
Now, you’ve created a website without using any programming scripts.
Sir Its not working plz help
How can I help you?