Includes for Common html
I am trying to find a method of including common html statements into my html pages. In the example below I have the same "Footer Section" and "Bulletin" in all of my pages for a site. I know that it does not seem like much but I would like to keep all of the statements in the "Footer Section" and "Bulletin" in a seperate file and find some way of including them in all of the pages. I know that I can write directly into the page using javascript but I would like these in all pages for browsers that do not have scripting enabled as well. I have thought that a 'link' might do this but it cannot be used in the body. I know that this example may not seem like much but I would like to know if and how I could do it before I start making more complex web sites.
Thanks Raney
Original: MyPage.html
<body class = "Screen">
<div class = "P开发者_Python百科age">
<div class = "Header Section">
</div>
<div class = "Content Section">
</div>
<div class = "Footer Section">
<div class = "EMail">
<a href = "mailto:Support [Support@Company.com]
?subject=Inquiry">
Support@Company.com
</a>
</div>
<div class = "Organization">
<ul>
<li>Company</li>
<li>City, ST</li>
<li>(123)456-7890</li>
</ul>
</div>
<div class = "Copyright">
Copyright ©
2007 Company.<br>
All rights reserved.
</div>
</div>
<noscript>
<div class = "Bulletin"
id = "Notice">
<b>Notice:</b> This Web-Page uses Active scripting!
Active scripting is not enabled in your web browser.
</div>
</noscript>
</body>
I would like to move common statements to seperate files.
File: MyFooter.html
<div class = "Footer Section">
<div class = "EMail">
<a href = "mailto:Support [Support@Company.com]
?subject=Inquiry">
Support@Company.com
</a>
</div>
<div class = "Organization">
<ul>
<li>Company</li>
<li>City, ST</li>
<li>(123)456-7890</li>
</ul>
</div>
<div class = "Copyright">
Copyright ©
2007 Company.<br>
All rights reserved.
</div>
File: MyBulletin.html
<noscript>
<div class = "Bulletin"
id = "Notice">
<b>Notice:</b> This Web-Page uses Active scripting!
Active scripting is not enabled in your web browser.
</div>
</noscript>
Then in my MyPage.html file have some way to include the others.
<body class = "Screen">
<div class = "Page">
<div class = "Header Section">
</div>
<div class = "Content Section">
</div>
<<Some way to Include: MyFooter.html>>
</div>
<<Some way to Include: MyBulletin.html>>
</body>
You can use <iframe>
for your simple case:
<div class = "Content Section">
</div>
<iframe src="MyFooter.html"></iframe>
Using CSS you can style the frame so it will have no borders, fixed size etc..
You should use a server-side templating language, such as ASP.Net.
You can then include other source files on the server, or use more sophisticated techniques such as master pages.
HTML desn't allow this. You are requiring a dynamic web site. There are many frameworks/solutions for this out there. Take your pick.
If you only want to generate static sites, have a look at jekyll: http://jekyllrb.com/
You set up your files according to a certain directory structure and run jekyll on it. It processes the files and generates the HTML pages.
You can use
- JavaScript with AJAX requests and DOM insertion
- server-side includes (SSI)
- any other server-side processing, such as with a Python, PHP or C# application
A little more checking and I did not like the single noscript.html page.
I did find exactly what I needed with Java Server Pages. Just use terms like "include file" to include a file.
精彩评论