I am trying to validate my document as XHTML 1.0 Transitional (W3C).
I have the following error:
"document type does not allow element "noscript" here; assuming missing "object" start-tag"
which corresponds to this code:
<noscript>
<div style="display:inline;">
<img height="1" width="1" style="border-style:none;" alt=""
src="//googleads.g.doubleclick.net/pagead/viewthroughconversion/1096/?
value=1.00&label=Y-skCMY_QM&guid=ON&script=0"/>
</div>
</noscript>
</head>
But I get this validation failing. What is the problem? Please help me to solve this.
One of your solutions could be to place it in the body instead of the head of your document as following:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Title</title>
<meta name="viewport" content="width=device-width"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<noscript>
<div style="display:inline;">
<img height="1" width="1" style="border-style:none;" alt=""
src="//googleads.g.doubleclick.net/pagead/viewthroughconversion/1096/?
value=1.00&label=Y-skCMY_QM&guid=ON&script=0"/>
</div>
</noscript>
</body>
</html>
This results in:
This document was successfully checked as XHTML 1.0 Transitional!
Additionally, according to this answer, it seams that it doesn’t really make difference (I'm talking about head vs body here):
Have done the move with the Google Ad section outside of HEAD and just
in the BODY part itself. Really doesn't make a difference since when
it was moved, it was just right after the parameters used for the ads
to display.
Solution #2
In case You will need to get rid of the <noscript> at all, You can try to make the following:
<div id='noscript' style="display:inline;">
<img height="1" width="1" style="border-style:none;" alt=""
src="//googleads.g.doubleclick.net/pagead/viewthroughconversion/1096/?
value=1.00&label=Y-skCMY_QM&guid=ON&script=0"/>
</div>
<script>document.getElementById('noscript').style.display='none'</script>
This makes things work absolutely the same as in the first solution. If JavaScript is disabled, <script>...</script> won't be executed, thus <div>...</div> would be shown.
Related
We have integrated AMP analytics script with amp-iframe tag. We can't able to use the amp-analytics tag for various reasons. We need an AMP HTML's referrer information in the iframe for identifying the source of traffic to the AMP page. The amp-iframe src will point to our domain/subdomain. When the AMP page loaded from Google CDN it will be in the different domain. Is there any way to get the referrer of the AMP HTML within amp-iframe HTML?
Please find the example AMP HTML structure
<!doctype html>
<html amp>
<head>
<meta charset="utf-8">
<title>Title of the AMP HTML</title>
<link rel="canonical" href="https://www.example1.com/example-content" />
<script custom-element="amp-iframe" src="https://cdn.ampproject.org/v0/amp-iframe-0.1.js" async></script>
<script src="https://cdn.ampproject.org/v0.js" async></script>
</head>
<body>
<amp-iframe class="amp-analytics" width="1" height="1" sandbox="allow-scripts allow-same-origin" frameborder="0" layout="fixed" src="https://iframe.example.com/amp-analytics?query1=value1&query2=value2">
<amp-img src="https://www.example.com/inc/amp/placeholder.png" height="1" width="1" layout="fill" placeholder></amp-img>
</amp-iframe>
<div>Content</div>
</body>
</html>
I am trying to get the referrer information of the AMP HTML inside the iframe https://iframe.example.com/amp-analytics.
Thank you in advance.
I'm embedding a group into a (non-Google) website and getting a blank page.
I've added the code that the 'Manage your Group' gives, which is below.
<iframe id="forum_embed"
src="javascript:void(0)"
scrolling="no"
frameborder="0"
width="900"
height="700">
</iframe>
<script type="text/javascript">
document.getElementById('forum_embed').src =
'https://groups.google.com/forum/embed/?place=forum/the-sophia-club'
+ '&showsearch=true&showpopout=true&showtabs=false'
+ '&parenturl=' + encodeURIComponent(window.location.href);
I have tried removing the &parenturl with no success.
I also tried saving the code on a simple html doc by itself, and it still gives me a blank page.
Here's the code for the single page...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>
<p>Testing</p>
<iframe id="forum_embed"
src="javascript:void(0)"
scrolling="no"
frameborder="0"
width="900"
height="700">
</iframe>
<script type="text/javascript">
document.getElementById('forum_embed').src =
'https://groups.google.com/forum/embed/?place=forum/the-sophia-club'
+ '&showsearch=true&showpopout=true&showtabs=false'
+ '&parenturl=' + encodeURIComponent(window.location.href);
</script>
</body>
</html>
Any ideas on what is going wrong??
The issue is that your document is xhtml instead of html. The two standards are different and Google doesn't seem to like xhtml.
xhtml seems to be dead unfortunately, so try changing to html5. The only required change should be in the doctype declaration.
Also, the embedding didn't work when I opened the page using my web browser pointing to a local directory. However it did work when I uploaded the page to the web server.
i've checked my XHTML Strict 1.0 code and i faced a lot of errors the validator : validator.w3.org please can you help me fixing errors
code :
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head>
<title> my trip around the US on my very own Segway </title>
</head>
<body>
<h1> Segway'n USA </h1>
<p>
Documenting my trip around the US on my
very own Segway
</p>
<h2> August 20, 2005 </h2>
<img src="images/segway2.jpg"/ alt="segway"/>
<p>
Well I made it 1200 miles already, and I passed
through some interesting places on the way:
</p>
<ol> <!-- ordered list -->
<li>Walla Walla, WA</li>
<li>Magic City, ID</li>
<li>Bountiful, UT</li>
<li>Last Chance, CO</li>
<li>Why, AZ</li>
<li>Truth or Consequences, NM</li>
</ol>
<h2> July 14, 2005 </h2>
<p>
I saw some Burma Shave style signs on the side of the
road today :
</p>
<blockquote>
Passing cars,
When you can't see, May get you,
A glimpse,
Of eternity.
</blockquote>
<p>
I definitely won't be passing any cars.
</p>
<h2> June 2, 2005 </h2>
<img src="images/segway1.jpg"/ alt="segway">
<p>
My frst day of the trip! I can't believe I fnally got
everything packed and ready to go. Because I'm on a Segway,
I wasn't able to bring a whole lot with me: cellphone, iPod,
digital camera, and a protein bar. Just the essentials. As
Lao Tzu would have said, <q>A journey of a thousand miles begins
with one Segway</q>
</p>
</body>
</html>
full code link : http://pastebin.com/L95bt2Yu
thanks guys
Don't use the validator first (use the XML parser first) and don't use old versions of XHTML. You should use HTML5 for HTML and XHTML for the XML parser which will catch about 80% of rendering errors right off the bat and streamline your development. So that means use XHTML5 for the best of both worlds. To use HTML5 you need to use the HTML5 elements. To use the XML parser you need to serve the page as application/xhtml+xml. Locally you need to save a file with a .xhtml extension. Do not let the overwhelming negative attitude towards XHTML undermine the usefulness of the XML parser, the best use the best tools and ignore the masses when they're wrong. As long as you use it in conjunction with HTML5 then you're doing the most you can do and that puts you far ahead of most people.
For servers you need to do content negotiation. When you get to PHP use the following before you send non-header data (e.g. any HTML/echo):
if (stristr($_SERVER['HTTP_ACCEPT'],'application/xhtml+xml'))
{
header('Content-Type: application/xhtml+xml');
}
Until you get to that point use the a program like WinMerge to determine how code is different if for full pages until you're able to narrow it down.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>XHTML5 Example</title>
<meta name="description" content="Manage domain accounts." />
<meta name="keywords" content="example" />
<meta name="language" content="en" />
<meta name="robots" content="noarchive, noindex, nofollow" />
<base href="https://localhost/" />
<link href="blog/rss/" rel="alternate" title="Blog RSS Feed" type="application/rss+xml" />
<link href="favicon.ico" rel="icon" />
<script defer="defer" src="scripts/index.js" type="application/javascript"></script>
</head>
<body>
<h1><span>Example Header, use h1 element only once per page</span></h1>
<main>
<p>Example paragraph.</p>
<ol>
<li><span>Bullet One</span></li>
<li><span>Bullet Two</span></li>
<li><span>Bullet Three</span></li>
</ol>
<ul>
<li><span>Bullet</span></li>
<li><span>Bullet</span></li>
<li><span>Bullet</span></li>
</ul>
<blockquote>
<p>The <code>blockquote</code> element may contain block-level elements.
The <code>q</code> element may only contain inline elements.</p>
</blockquote>
</main>
<aside>
<img alt="Alternative text displayed only if image does not load" src="example.png" />
</aside>
</body>
</html>
I got a weird behaviour in IE 9 (while firefox works fine) when I try to change the font-size of a fixed width texx box from 100% to 200%. The text in the input box got cut off partially. I don't know why and
I put my source and script in the below url.
http://jsfiddle.net/VVyQm/3/
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="language" content="en" />
</head>
<body>
<input style="width:100px;font-size:100%" type="text" value="abc"/>
</body>
</html>
The problem is caused by some settings in the jsfiddle environment. Testing the following document directly in IE 9 does not exhibit the problem:
<!doctype html>
<meta charset=utf-8>
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<input style="width:100px;font-size:100%" type="text" value="abc"/>
<script>
$('body').css('font-size', '200%');
</script>
Thus, if the problem occurs in your environment outside jsfiddle, then it’s apparently caused by some other code, such as a library or framework being used.
For IE you can refresh values in inputs after changing font size. After that displaying will be correct.
<input id="example_id" style="width:100px;font-size:100%" type="text" value="abc"/>
<script>
$('body').css('font-size', '200%'); <!-- change font size -->
$('#example_id').val($('#example_id').val()) <!-- refresh value-->
</script>
On the Internet are several programs in e.g. Ruby or Python which move XHTML CSS styles into tags. They are often called premailer because some older mail programs have problems with header defined stylesheets. Here is a example what a python premailer does: premailer on pypi
What I want to do is to move the json formatted CSS stylesheets from the HTML <style> header inside every related node which has a class attribute.
Example input:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Sometest</title>
<style type="text/css">
/*<![CDATA[*/
ol{margin:0;padding:0}p{margin:0}.c1{vertical-align:top;width:93.6pt;border-style:solid}.c2{vertical-align:top;width:41.8pt;border-style:solid}hr.c1{page-break-before:always}
/*]]>*/
</style>
</head>
<body>
<div>
<p class="c1"><span>Style C2 Text</span></p>
<hr class="c1"/>
<p class="c2">Style C1 Text</p>
</div>
</body>
</html>
My desired output. Look at style in <hr> and <p>:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Sometest</title>
<style type="text/css">
/*<![CDATA[*/
ol{margin:0;padding:0}p{margin:0}.c1{vertical-align:top;width:93.6pt;border-style:solid}.c2{vertical-align:top;width:41.8pt;border-style:solid}hr.c1{page-break-before:always}
/*]]>*/
</style>
</head>
<body>
<div>
<p class="c1" style="vertical-align:top;width:93.6pt;border-style:solid"><span>Style C2 Text</span></p>
<hr class="c1" style="page-break-before:always"/>
<p class="c2" style="vertical-align:top;width:41.8pt;border-style:solid">Style C1 Text</p>
</div>
</body>
</html>
Has anybody done this with XSLT before?
Is this also possible with XSLT 1.0 ?
Rather than do this in XSLT, which is clunky, and no more portable than Python, I suggest you adapt whatever premailer you prefer to use a straight XML parser instead of a tag soup parser.
Depending on how the premailers work, it might even be possible to use their tag soup parser for a first pass, then just use a DOM or SAX parser for the annotation phase.