Sharing same content across multiple html pages | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
+ 17

Sharing same content across multiple html pages

I am developing a website using bootstrap, for maintainance purpose is there a way i can include common bootstrap files or common header and footers across all html pages, without rewriting or copying and pasting in each pages

21st Dec 2019, 2:51 PM
BlackRose Mike
BlackRose Mike - avatar
12 Answers
21st Dec 2019, 3:06 PM
Thống Nguyễn
Thống Nguyễn - avatar
+ 17
Thống Nguyễn and Emmanuel Joshua can i achieve this using J's
21st Dec 2019, 3:22 PM
BlackRose Mike
BlackRose Mike - avatar
+ 16
Thống Nguyễn then i have to convert my extension to .php if i intend to use php includes ?? WhyFry thankx foe listing out this serverside ways to doing this Sergei Romanov thankx too. Im working with php for backend so i should go with php then
21st Dec 2019, 3:49 PM
BlackRose Mike
BlackRose Mike - avatar
+ 13
Thankx was looking for a JavaScript but thankx anyways
21st Dec 2019, 3:17 PM
BlackRose Mike
BlackRose Mike - avatar
+ 4
You will need a server side language to achieve this. E.g. PHP If you have a folder that stores all the files you want to add (includes), you can add this to the desired pages: if(file_exists("/includes/header.php")){ require("/includes/header.php"); } Adding the above to the top of a page will pull in all the contents inside header.php. The same can be used for footer. So, you simply edit one file instead of multiple files.
21st Dec 2019, 3:08 PM
Emmanuel Joshua
Emmanuel Joshua - avatar
+ 3
Hi, what about vue.js templates? Or angular. Maybe they can do it. Or some server side framework/language. I would recommend Django.
21st Dec 2019, 3:20 PM
SergeiRom
+ 2
Did you hear about SPA? Single page application. Use Angular
23rd Dec 2019, 11:57 AM
Joseph
+ 1
BlackRose Mike basically yes, just turn your header - footer into a variable then print out any where you want then if you want some change, simply edit the declaration. Some thing like this: <!DOCTYPE html> <html> <head> <title>Page Title</title> <script> var header = "<h1>This is my header</h1>"; </script> </head> <body> <script> document.write(header); </script> </body> </html> But the best way is using a special delicated for this purpose language like PHP....
21st Dec 2019, 3:29 PM
Thống Nguyễn
Thống Nguyễn - avatar
+ 1
BlackRose Mike Yes, no need any special convert. Just simply change your file name from *.html to *.php. (It's very simple) Please watch the youtube tutorial above for more detail!
21st Dec 2019, 3:53 PM
Thống Nguyễn
Thống Nguyễn - avatar
+ 1
Ko Kyaw Give answer regarding to question. I saw you just joined but before knowing anything don't post anywhere if there is no relationship with that problem.
21st Dec 2019, 5:58 PM
A͢J
A͢J - avatar
+ 1
I have done this with jquey.load. It takes some logic and structuring but I think it can be very flexible and quite easy to do simple stuff. https://api.jquery.com/load/
23rd Dec 2019, 1:20 AM
erik lenells
erik lenells - avatar
- 2
myanmar
21st Dec 2019, 5:47 PM
Ko Kyaw
Ko Kyaw - avatar