I have a html "head" template and a navigation template that I want to include in all my other html files for my site. I found this post:
Include another HTML file in a HTML file
And my question is... what if it's the header that I want to include?
So for example, I have the following file structure:
/var/www/includes/templates/header.html navigation.html
header.html might look like this:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="description" content=""> <meta name="author" content=""> <title>Test Portal</title> </head>
In a case like this, can I still follow the example in the other post where they create a div and populate the div via jquery?
You could use an <iframe> in order to display an external webpage within your webpage. Just place the url of the webpage that you want to display inside the quotes of the src attribute. Show activity on this post. Either you use an iframe or you load the site via AJAX into a div (e.g. using jQuerys load() method).
Copy the HTML: Press the CTRL+C shortcut to copy, or right-click on your selected text and click Copy.
Using HTML <iframe> tag.
Method 1:
I think it would be best way to include an html content/file into another html file using jQuery.
You can simply include the jQuery.js and load the HTML file using $("#DivContent").load("yourFile.html");
For example
<html> <head> <script src="jquery.js"></script> <script> $(function(){ $("#DivContent").load("another_file.html"); }); </script> </head> <body> <div id="DivContent"></div> </body> </html>
Method 2:
There are no such tags available to include the file but there are some third party methods available like this:
<!DOCTYPE html> <html> <script src="http://www.w3schools.com/lib/w3data.js"></script> <body> <div w3-include-html="content.html"></div> <script> w3IncludeHTML(); </script> </body> </html>
Method 3:
Some people also used server-side-includes (SSI):
<!--#include virtual="a.html" -->
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With