Hi guys,
I was wondering if there is a way that one can include part of another html document in another file.
As one can include a separate css file in the main file, so then when it is parsed, it looks as if the included styling is in the main file.
<!Doctype HTML>
<html lang="en">
<head>
<meta charset="utf=8" />
<title> Main HTML Document </title>
<!--Pseudo HTML--><include src="conditional.html" /><!-- End Psuedo HTML-->
</head>
<body>
<p>Hello I am some content that was already here</p>
</body>
</html>
So that when the viewer html from conditional.html is a part of the main html document, but it can not be seen in the source unless they view the source of conditional.html ?
You can use server-side includes, where you put a bit of code like
<!--#include virtual="/menu.htm" -->
in the page, and it inserts the contents of menu.htm into the document at that point … but that happens on the server, before it’s sent to your computer. So if you view the source, you see the full code inserted in the right place, with no indication that it has been pulled from another file. Which is kind of the opposite of what you want…
In a way it is, because what I was truly looking for was like a link tag where it includes the linked files content, but does not display it in the view source.
However, I really appreciate your solution and I might go ahead an use it unless we can find something like the link.
I guess if this:
<!–#include virtual=“/menu.htm” –>
is the only solution, then I will go with that.
However, there isn’t a way one can link a .html file with the <link> tag?
Also, in the menu.html or the file that will be included, does one have to have a doctype and html and body tags like a formal web page or can it just be the tags that need to be included?
I mean, if one has includes an html document with a body tag inside another html document, won’t the second document have a body within a body?
With includes you don’t write a full page again only the code you want to add/insert. Think of it [include] as cut-and-paste text where the include can be inserted into several documents automatically.
So let’s say your ‘navigation menu’ is duplicated; you only pick the code you want inserting, e.g. the ‘navigation menu’ start and end DIV tags, and the menu hyperlinks would have their own separate include file.
If you don’t want something to show up in the source code you need to add it with JavaScript after the page has loaded. I’m not sure what you’re trying to achieve so I can’t say if this is the approach you should use.
The <link> tag can only appear in the <head>, not in the <body>, so there would be no way to specify where in the document you wanted the file inserted.
Also, in the menu.html or the file that will be included, does one have to have a doctype and html and body tags like a formal web page or can it just be the tags that need to be included?
I mean, if one has includes an html document with a body tag inside another html document, won’t the second document have a body within a body?
It would, so you don’t
The file you include should be, more technically, a file fragment. In other words, it’s just the HTML that you want to include, not a full page. It doesn’t even need to be valid in itself - eg, it could end half-way through an element without closing it, as long as you always completed it in the main page after each include.
Can not use link because that validly only exists in the head
and I use only the html i want in the file I am including.
Well all I am looking for is neater source code.
I do not want to have parts of the page be dependent on javascript however.
So I think my best choice is to use the include.
Although it will still show when the user views the source, I guess it will be neater for me. However, isn’t using the include creating a new header request?
So now I am wondering if it is worth the cost of another header request just to make the source cleaner for me, but not for anyone who views the interpreted scource
Any suggestions?
And, again, my goal is to make the source cleaner by removing the conditional comments and noscript tags and have them included or linked in some way.
I appreciate all your help and feedback,
Team 1504
The reason for using includes is not to make the source code neater, but to make maintenance and development easier. If you’ve got a site with a thousand pages - or even just a dozen pages - and you’ve hard-coded the menu into each and every one, any time you want to make a change to it, you’ve got a big job to do. Whereas if you’ve used an include, you just need to change one file and … shazam … as if by magic, the whole site is done in one go.
I attempted using the include to include an html file with my IE conditional comment code. Here is what I used, did I do something wrong or invalid for the W3C validator to find that as invalid?
Line 231, Column 14: Consecutive hyphens did not terminate a comment. – is not permitted inside a comment, but e.g. - - is.
<!–#include virtual="assets/html/ieConditionalWithMainNavForLayout.h…
Line 231, Column 14: The document is not mappable to XML 1.0 due to two consecutive hyphens in a comment.
<!–#include virtual="assets/html/ieConditionalWithMainNavForLayout.h…
Line 232, Column 11: Bogus comment.
<![endif]–>
Line 232, Column 19: The document is not mappable to XML 1.0 due to two consecutive hyphens in a comment.
<![endif]–>
Line 232, Column 20: The document is not mappable to XML 1.0 due to a trailing hyphen in a comment.
<![endif]–>
Do you, or would you or anyone be able to help me fix these errors?
I hope I did not make a stupid mistake.
I really appreciate your guys’ help and I hope to hear from you soon.
A common error is to include a string of hyphens (“—”) within a comment.
You have two nested comments, one for IE CC one for include. Unfortunately, the end comment for include is considered the end comment for IE CC instead.
Comments must start with the four character sequence U+003C LESS-THAN SIGN, U+0021 EXCLAMATION MARK, U+002D HYPHEN-MINUS, U+002D HYPHEN-MINUS (<!–). Following this sequence, the comment may have text, with the additional restriction that the text must not start with a single U+003E GREATER-THAN SIGN character (>), nor start with a U+002D HYPHEN-MINUS character (-) followed by a U+003E GREATER-THAN SIGN (>) character, nor contain two consecutive U+002D HYPHEN-MINUS characters (–), nor end with a U+002D HYPHEN-MINUS character (-). Finally, the comment must be ended by the three character sequence U+002D HYPHEN-MINUS, U+002D HYPHEN-MINUS, U+003E GREATER-THAN SIGN (–>).
Comments must start with the four character sequence U+003C LESS-THAN SIGN, U+0021 EXCLAMATION MARK, U+002D HYPHEN-MINUS, U+002D HYPHEN-MINUS (<!–). Following this sequence, the comment may have text, with the additional restriction that the text must not start with a single U+003E GREATER-THAN SIGN character (>), nor start with a U+002D HYPHEN-MINUS character (-) followed by a U+003E GREATER-THAN SIGN (>) character, nor contain two consecutive U+002D HYPHEN-MINUS characters (–), nor end with a U+002D HYPHEN-MINUS character (-). Finally, the comment must be ended by the three character sequence U+002D HYPHEN-MINUS, U+002D HYPHEN-MINUS, U+003E GREATER-THAN SIGN (–>).
You usually don’t validate the file before it gets parsed by the server (with the raw naked include syntax/information still visible). You do it ‘after’ the includes have been inserted, i.e. end result as seen by the browser.
Wow, thank you noonnope. I really appreciate the documenas that completely explained things.
So I have to.remove the ie cc if I want to use the include due to hyphen conflict.
hmm however, my goal was to clean up non-ie users source by not showing them the code, but include it if the browser is ie because the code that is being included is, itself, all ie conditional code.
Sorry for the passive voice and if it was too confusing.
And I apologise if this is too much to ask, but does anyone know of any method, even if it entails another coding language, that I can use to only include a file inside conditional comments?
Yes, that makes sense and I was planning on doing so, but I wanted to make sure everything else was valid first.
Of just get rid of the IE CC altogether since if that’s for CSS, you should probably just FIX your layout so it just works instead of screwing around with that IE conditional NONSENSE and a separate file. I have NEVER seen a legitimate reason to use IE conditionals to wrap anything other than javascript other than broken page building methodologies.
Which would be a LOT easier if you bothered to use a doctype where the validator does something useful instead of that HTML 5 nonsense.
Or just get rid of the 2000’s concept of trying to fit one code in every hole, and that html 4.01 is the future or else.
I never saw the reason to literally murder CSS code just to avoid the truth, that special browsers have special needs. Apart form the fact that you should step away from descending selectors as being the only ever possible CSS selector you’ll use. Since the descendant selector is also the weakest selector.
And, may I remind you, media queries are the same thing with IE CC.
Some clarifications, the only reason I am using the include is to include ie conditional code for ie5:eye:
Maybe I should give up that because almost no one uses ie5 anymore.
I mean IE6 is dying
The reason why the include file is called ieConditionalWithMainNavForLayout.html is because the conditional code also has css that gives .gif images for my background images instead of .png when the browser is ie6 or below.
The main chunk of the ie conditional comments is for outdated browsers
Also, this website that I am working on is another project, not team1504.com
Sorry for the confusion.
Maybe I should stop trying to fill all holes and drop ie 5 support.
