Meteor parses all of the HTML files in your app folder and identifies
three top-level tags: <head>, <body>, and <template>. Everything
inside any <head> tags is added to the head section of the HTML sent
to the client, and everything inside <body> tags is added to the body
section, just like in a regular HTML file.
My question is, if I have a.html:
<body><h1>Hello</h1></body>
and b.html:
<body><h1>Goodbye</h1></body>
How does Meteor figure out the order of elements to load?
Related
If I put all of my CSS in <style> .. </style> tags, will the browser cache that style data and apply it to either reloads of the same page or other pages on my web site?
If your style is part of the HTML page, it is only cached together with the whole page. If you need the style on separate pages, it needs to be loaded everytime. You should use one style file with all the relevant styles in it and refer to it with <link rel="stylesheet" href="stylesheet.css">. This file is then cached (if your HTTP header says so) and can be used in every HTML page.
Our webapp displays untrusted html uploaded by end users. At the moment, we display the html in an iframe, which nicely isolates the html from the rest of the site. Any css contained in the html can't mess up anything outside the iframe.
Unfortunately, the iframes are causing problems as we try to migrate to a mobile-friendly site. We're having trouble getting mobile touch event handlers to function correctly inside an iframe.
Is there any alternative to iframes for this app? We'd like to load the html into a plain <div>, but <html> and <head> tags aren't really valid inside a div and we'd have to play a bunch of games to get the css to work. And then we'd have to prevent the css from affecting anything else on the site.
We could try to sanitize the html, but we really do need to allow end users to apply their own arbitrary css to the html. The nature of the app requires it.
I have standard html files with their own style, and use a common css file for different fonts only. I need to put the FB website thumbnail to all the files through that css.
Is it possible to add the following to the css or .js files? (as there are thousands of html files):
<meta property="og:image" content="http://websitename/image.jpg">
You'll need to add that snippet to the html itself, not the css. Meta tags go into the head of your webpage (between the <head></head> tags). There's no way to insert html into a page via a css file.
OpenGraph is some standard - even if you did put it inside your CSS - nobody would know it's there - so no, it can't be done with CSS.
If some website would process the javascript (but facebook hardly would) you could get lucky but the chances are really low so it is not reliable.
However I suggest you to write a little e.g. PHP skript that would run through all the .html / .htm files and would rewrite <head> with <head> <meta property="og:image" content="http://websitename/image.jpg">
But I suggest that instead of adding only html, it would be much better if you would add an include script that would contain further cross-files changes. So next time you would need to add something to <head> in all your files you would just add it inside your e.g. my_include.php
EDIT:
I would also recommend you to look at the facebook's developer tool that tells you exactly what it sees when it visits your site: https://developers.facebook.com/tools/debug/og/echo?q=YOURSITEURL
I know that there are many similar issues in google, but I can't find one that help me..
When I include a css file in my JSP page it doesn't work:
<link rel="stylesheet" type="text/css" ../../css/car_rental.css">
If I try this:
<%# include file="../../css/style.css"%>
it throws exception
/WEB-INF/view/../../css/style.css" file not found
How can I get rid of WEB-INF/view/ prefix?
P.S. my jsp page is located at /WEB-INF/view/ folder, and my css file at /css/ folder
It looks like you are referencing your style sheet via a server side include. The <%# include file="../../css/style.css"%> tag will inject the contents of the named file into the JSP containing the tag, as if it were copied and pasted. It is unlikely your JSP code will need to modify the contents of your cascading style sheet.
Try replacing the <%# include file="../../css/style.css"%> tag with the HTML tag to include your stylesheet.
<LINK href="/css/style.css" rel="stylesheet" type="text/css">
<%# include file="XYZ" %> statically includes the content of your file as part of compiled servlet response.
So even if it successfully finds the CSS file, its content will be treated as normal text and will be flushed in response.
This means that your page will simply display the content of CSS and there wouldn't be any styling that would actually occur
You need to use the link tag in the head. It directs the browser to apply the style.
Also, relative paths do not work in include, as you can see from the error.
Use:
<link href="../../css/style.css" rel="stylesheet" type="text/css">
How can I set a encoding for my pages served with meteor? Currently my Firefox keeps on outputting this warning:
The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the page must to be declared in the document or in the transfer protocol.
Just set your encoding inside any <head> section of a html file:
<head>
<meta charset="UTF-8">
<title>Whatever</title>
</head>
From Meteor's documentation:
HTML files in a Meteor application are treated quite a bit differently
from a server-side framework. Meteor scans all the HTML files in your
directory for three top-level elements: <head>, <body>, and
<template>. The head and body sections are separately concatenated
into a single head and body, which are transmitted to the client on
initial page load.