#Importing an html into another html file

7 messages · Page 1 of 1 (latest)

dapper pasture
#

Hello everyone!
I am developing my first web app and I would need help from somebody more experienced then me!

I have created a sidebar that ideally should always be available to the user, on each page of the app, and I called it sidebar.html. In this file there is the full html code, the css and js script for the sliding animation of the sidebar when clicked on it.
Now I would like to import this code to the other pages, starting from index.html but I can't seem to find a correct way to do it. The closest I got was using the the <iframe> tags, but then the sidebar is available only in the frame itself and not on the rest of the page.
Is it possible import this into other files? What would be the correct way to proceed for it?

Thanks a lot in advance for the attention and for the answers 🙂

sand lotus
#

Ideally you'd want your server to handle this like via php or whatever you're using

If you just have vanilla HTML/CSS/JS you'll have to set up some JS for it
https://www.w3schools.com/howto/howto_html_include.asp

W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

dapper pasture
#

thanks for your answer!
yes, only I have used only html/css/js.
Just a couple of question: the w3-include-html goes in the <head> or <body>? and do I need to open a script tag dedicated only to this or can I use one already existing?

dapper pasture
#

or can I setup the whole sidebar in the styles.css file that is imported at the beginning of each page?

sand lotus
#

Styles.css is for css it's unrelated

#

You dont need an exclusive script tag

#

The w3-include-html attribute goes on the element you want to replace with the import just like the tutorial shows