Page 1 of 1

W3C en <__script__...... Hoe valideren i.r.t. Doctype?

Posted: Sat Jan 28, 2012 12:09 pm
by Gregor
Hallo,

Bij het error-vrij krijgen van mijn site loop ik tegen het volgende aan: deze code is volgens mij correct (geplaatst buiten de <__body>):

Code: Select all

<__script__ type="text/javascript" src="http://www.uisge-beatha.eu/uploads/Javascripts/slimbox2.js" defer="defer"></__script>
Bij W3C krijg ik de volgende melding:
Line 634, Column 113: document type does not allow element "script" here
…//www.uisge-beatha.eu/uploads/Javascripts/slimbox2.js" defer="defer"></__script>

The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed).

One common cause for this error is the use of XHTML syntax in HTML documents. Due to HTML's rules of implicitly closed elements, this error can create cascading effects. For instance, using XHTML's "self-closing" tags for "meta" and "link" in the "head" section of a HTML document may cause the parser to infer the end of the "head" section and the beginning of the "body" section (where "link" and "meta" are not allowed; hence the reported error).
Het documenttype is:
XHTML 1.0 Strict
Welk doctype zou ik nou moeten definiëren om het wel valid te krijgen (er zitten nog wel wat uitdagingen (11 Errors, 1 warning(s)) in http://www.uisge-beatha.eu/

Gregor

Re: W3C en <__script__...... Hoe valideren i.r.t. Doctype?

Posted: Sat Jan 28, 2012 1:45 pm
by Rolf
Uhm dit snap ik niet...

Code: Select all

   <__body>

   
   <__script__ type="text/javascript" src="http://www.uisge-beatha.eu/uploads/Javascripts/slimbox2.js" defer="defer"></__script> 
   <__script__ type="text/javascript" src="http://www.uisge-beatha.eu/uploads/Javascripts/slimcycle.js" defer="defer"></__script>

   <__script__ type="text/javascript" src="http://www.uisge-beatha.eu/uploads/Javascripts/sorttable.js" defer="defer"></__script>
   <!--[if IE 6]>
   <__script__ type="text/javascript" src="modules/MenuManager/CSSMenu.js"></__script>
   <![endif]-->
   <!-- The above JavaScript is required for Menu - NCleanBlue-css to work in IE6 * }

   { * the literal below and the /literal at the end are needed whenever there are {"curly brackets"} as smarty will think it's something to process and will throw an error * }
   { * IE6 png fix * } -->
   <!--
   <__script__ type="text/JavaScript">
   //pass min and max - measured against window width
   function P7_MinMaxW(a,b){
   var nw="auto",w=document.documentElement.clientWidth;
   if(w>=b){nw=b+"px";}if(w<=a){nw=a+"px";}return nw;
   }
   </__script>
   //-->
   <!--[if IE 6]>
     <__script__ type="text/javascript"  src="uploads/NCleanBlue/js/ie6fix.js"></__script>
     <__script__ type="text/javascript">
        // argument is a CSS selector      DD_belatedPNG.fix('.sbar-top-left,.sbar-top-right,.sbar-bottom-left,.sbar-bottom-right,.main-top,.main-bottom,#version');
     </__script>
     <style type="text/css">
        /* enable background image caching in IE6 */
        html {filter:expression(document.execCommand("BackgroundImageCache", false, true));} 
     </style>
   <![endif]-->

   <!-- AddThis Button BEGIN -->
   <__script__ type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4f2144ce26244842" defer="defer">
   </__script>

   <!-- AddThis Button END -->

   
</__html>
Tussen <__body> en </__html>. Zou ik in de <head> verwachten...

grtz. Rolf

Re: W3C en <__script__...... Hoe valideren i.r.t. Doctype?

Posted: Sat Jan 28, 2012 3:06 pm
by Gregor
Ik raak in de war... ;)
Tussen <__body> en </__html>. Zou ik in de <head> verwachten...
Op hoofdlijnen is de structuur:
<__html>
allerlei tags en wat Javascript
<head>
</head>
</__body>
<__body>
nog meer JavaScript
</__html>

Op aangeven van Yslow heb ik diverse Javascripts na <__body> en voor </__html> geplaatst. Yslow gaf een melding met als strekking, 'try to put Javascript at the bottom of your site'. Of heb ik dat iets te letterlijk genomen??? ;)

De hele template (door de tab's is de lay-out een beetje rommelig):

Code: Select all

{process_pagedata}
<!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" xml:lang="nl-NL">
<head>
   {cms_stylesheet}
   {* This is how all the stylesheets attached to this template are linked to * }
   {if isset($canonical)}<link rel="canonical" href="{$canonical}" />{elseif isset($content_obj)}<link rel="canonical" href="{$content_obj->GetURL()}" />{/if *}

   {if $canonical != ''}
      {* detail pagina mobiel http://m.xxx.nl/log/99/munge_string_to_url_title/ *}
      {* canonical =  http://www.xxx.nl/blog/99/munge_string_to_url_title/ *}
      <link rel="canonical" href="{$canonical}" />
   {elseif $page_name == 'lbjaar'}
      {* index pagina mobiel www.m.xxx.nl/blog/ *}
      <link rel="canonical" href="http://www.uisge-beatha.eu/logboek/" />
   {/if}

   {strip} 
   {* 28nov11  use strip to get rid of whitespace -- http://www.i-do-this.com/blog/48/Put-your-CMSMS-Metatags-on-autopilot *}
   {content assign='get_content'}
   {if !isset($get_title)}
      {title assign='get_title'}
   {/if}
   {/strip}
   {* The sitename is changed in Site Admin/Global settings. {title} is the name of each page *}

   {tracewatch}
   {metadata}
   {* Don't remove this! Metadata is entered in Site Admin/Global settings. *}
   {autometa}

   {cms_selflink dir="start" rellink=1}
   {cms_selflink dir="prev" rellink=1}
   {cms_selflink dir="next" rellink=1}
   {* Relational links for interconnections between pages, good for accessibility and Search Engine Optmization *}
   {cms_jquery cdn='false' exclude='jquery.ui.nestedSortable-1.3.4.js, jquery.json-2.2.js, jquery-ui-1.8.14.min.js'}

   {* <__script__ type="text/javascript" src='http://www.uisge-beatha.eu/uploads/Javascripts/jquery.js'>
   </__script>
    var addthis_config = {"data_track_clickback":true};
   </__script>
   <__script__ type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#async=1#pubid=xa-4f2144ce26244842" defer="true"></__script> 
   http://www.masternewmedia.org/how-to-speed-up-your-website-page-load-performance-by-delaying-the-load-of-javascript-and-widgets-part-2/ *}

   {literal}
   <__script__ type="text/javascript" src='http://www.uisge-beatha.eu/uploads/Javascripts/cycle.js' defer="defer"></__script>

   <__script__ type="text/javascript">
        $(document).ready(function() {
        $('.slider').cycle({
            fx: 'scrollUp',
            timeout: 8000,
            pause: 2
            });
        });
   </__script>
   {/literal}
   
   {CGFeedMaker action='autodiscovery' feed='news'}
   {analitics urchin="UA-3361592-1"}
</head>
</__body>
   <div id="header">
      {* start accessibility skip links *}
      <ul class="accessibility">
         <li>{anchor anchor='menu_vert' title='Skip to navigation' accesskey='n' text='Skip to navigation'}
         </li>
         <li>{anchor anchor='main' title='Skip to content' accesskey='s' text='Skip to content'}</li>
      </ul>
      {* end accessibility skip links *}
      <hr class="accessibility" />
      {* Horizontal ruler that is hidden for visual browsers by CSS *}
      <h1>{cms_selflink dir="start" text="$sitename"}</h1>
      {* Start Search, the input "Submit" is using an image, CSS: div#search input.search-button *}
      <div id="header_banner"> 
          {rotate path="uploads/Flash/flash_banner/" height="180" width="775"}
      </div>
      <div id="search" class="core-float-right">
         {* search search_method="post" *}
         {global_content name='google_zoek'}
      </div>
	  {* End Search *}
   </div>   
   {* Start Navigation, stylesheet "Navigation: ShadowMenu - Horizontal" *}
   {* <div id="menu_vert"> *}
      <h2 class="accessibility">Navigation</h2>
      {menu template="schaduw"}
      <hr class="accessibility" />
   {* </div> *}
   {* End Navigation *}
   {* Start Bar *}
   <div id="bar">
      {* Start Breadcrumbs, a bit of letting you know where your at *}
      <div class="breadcrumbs">
         {breadcrumbs starttext='Waar ben ik' root='Home' delimiter='&raquo;'}
      </div>
      {* End Breadcrumbs *}
      <div class="icons">
         {CGFeedMaker action='rsslink' feed='news' imageonly='' image='http://www.uisge-beatha.eu/uploads/images/cms/images.jpg'}
         {global_content name='twitter'}
         <div id="print" class="core-float-right">
            <div>{print showbutton=true script=true}</div>
         </div>
      </div>
      <hr class="accessibility" />
   </div>
   {* End Bar *}
   {* <div id="pagewrapper" class="colmask threecol"> *}
   <div id="pagewrapper" class="colmask {if $page_alias == "home"}threecol{else}leftmenu{/if}">
	  <div class="colmid">
	     <div class="colleft">
		    <div class="col1">
		       {* Column 1 start Middle Column 
			   <div id="content">
                  { con tent }
               </div> *}
               <div id="main">
                  {$get_content}
                  <br />  {* to insure space below content *}
                  {global_content name='SocialMedia'}
                  {* Start relational links *}
                  {* note this is the right side, when you float: divs you need to have float: right; divs first *}
                  <div class="right49">
                     <p>{anchor anchor='main' text='^ Top'}</p>
                  </div>
                  <div class="left49">
                     <span>
                        {cms_selflink dir="previous" label="Vorige pagina: "}&nbsp;
				        {* The label parameter doesn't need to be there if you're using English, but is here to show how it's used if you don't want the English text "Previous page" *}
           	     </span>
           	     <span>
                        {cms_selflink dir="next" label="Volgende pagina: "}&nbsp;
                     </span>
                  </div>
                  {* End relational links *}
                  {adsense ad_client="pub-3514636835854223" ad_slot="3675148844" ad_width="728" ad_height="90" ad_format="728x90_as"}
                  <hr class="accessibility" />
                  <div class="clear"></div>
               </div>
			<!-- Column 1 end -->
			</div>
			<div class="col2">
			   <!-- Column 2 start / left side -->
               <div id="logboek">
                  <h2>{cms_selflink page="lbtochten" text="Logboek"}</h2>
			      {CGBlog pagelimit="3" detailpage="logboekpagina" lang="nl_NL" summarytemplate="UB_Logbook_frntpg" category="Logboek,Tochten"}
               </div>
               <!-- Start News -->
               <div id="nieuwtjes">
                  <h2>{cms_selflink page="Nieuwtjes" text="Nieuwtjes"}</h2>
                  {CGBlog number="3" detailpage="Nieuwtjes"  lang="nl_NL" summarytemplate ="UB_Nieuwtjes_frntpg" category="General,Motor,Te water lating,Binnenboord,Onderhoud,Statistiek,Hardlopen"}            
               </div>
               {* End News *}
            {* Column 2 end *}
		   </div>
         {if $page_alias == "home"}
			   <div class="col3">
			   {* Column 3 start / right side *}
               <div id="tweets">
                  <h2>Tweets</h2>
                  {cms_module module="Twitter" limit="3" template="frntpg_timeline"}
               </div>
               <div id="tagcloud">
                  <h2>Tag cloud</h2>
                  {CGBlog browsecattemplate="Tagcloud" action="browsecat"}
               </div>

               <div id="zeiluitspraken">
                  <h2>Zeiluitspraken</h2>
                   {* cms_selflink page="zeiluitspraken" text="Zeiluitspraken" *}
                  {global_content name='Zeiluitspraken'}
               </div>
			   {* Column 3 end *}
			   </div>
			{/if}
		 </div>
	  </div>
      <span class="util-clearb">&nbsp;</span>
   </div>
   {* Start Footer. Edit the footer in the Global Content Block called "footer" *}
   <div id="foot-wrapper">
      <div id="footer">
      {* stylesheet  "Navigation: FatFootMenu" *}
         <div class="block core-float-left">
            {menu loadprops=0 template='minimal_menu.tpl'  number_of_levels='1'}
         </div>
         {* second foot menu if active page has children *}
         <div class="block core-float-left">
            {menu loadprops=0 template='minimal_menu.tpl'  start_level="2"}
         </div>
         {* edit the footer in the Global Content Block called "footer" *}
         <div class="block cms">
         {global_content name='footer'}
            <div class="w3c">
               {valid_css}
            </div
         </div>
         <div class="clear"></div> {* <span class="util-clearb">&nbsp;</span> *}
      </div>
   </div>
   {* End Footer *}
<__body>
{* <__script__ type="text/javascript" src="http://www.uisge-beatha.eu/uploads/Javascripts/resize_iframe.js"></__script> *}
{literal}
   
   <__script__ type="text/javascript" src="http://www.uisge-beatha.eu/uploads/Javascripts/slimbox2.js" defer="defer"></__script> 
   <__script__ type="text/javascript" src="http://www.uisge-beatha.eu/uploads/Javascripts/slimcycle.js" defer="defer"></__script>
   <__script__ type="text/javascript" src="http://www.uisge-beatha.eu/uploads/Javascripts/sorttable.js" defer="defer"></__script>
   <!--[if IE 6]>
   <__script__ type="text/javascript" src="modules/MenuManager/CSSMenu.js"></__script>
   <![endif]-->
   <!-- The above JavaScript is required for Menu - NCleanBlue-css to work in IE6 * }

   { * the literal below and the /literal at the end are needed whenever there are {"curly brackets"} as smarty will think it's something to process and will throw an error * }
   { * IE6 png fix * } -->
   <!--
   <__script__ type="text/JavaScript">
   //pass min and max - measured against window width
   function P7_MinMaxW(a,b){
   var nw="auto",w=document.documentElement.clientWidth;
   if(w>=b){nw=b+"px";}if(w<=a){nw=a+"px";}return nw;
   }
   </__script>
   //-->
   <!--[if IE 6]>
     <__script__ type="text/javascript"  src="uploads/NCleanBlue/js/ie6fix.js"></__script>
     <__script__ type="text/javascript">
        // argument is a CSS selector      DD_belatedPNG.fix('.sbar-top-left,.sbar-top-right,.sbar-bottom-left,.sbar-bottom-right,.main-top,.main-bottom,#version');
     </__script>
     <style type="text/css">
        /* enable background image caching in IE6 */
        html {filter:expression(document.execCommand("BackgroundImageCache", false, true));} 
     </style>
   <![endif]-->

   <!-- AddThis Button BEGIN -->
   <__script__ type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4f2144ce26244842" defer="defer">
   </__script>
   <!-- AddThis Button END -->

   {/literal}
</__html>
Grtz., Gregor

Re: W3C en <__script__...... Hoe valideren i.r.t. Doctype?

Posted: Sat Jan 28, 2012 3:16 pm
by Rolf
Zelf doe ik het altijd zo om het geheel overzichtelijk te houden
Even een voorbeeld om een idee te krijgen!! Fictief natuurlijk.

Code: Select all

</__body>
<div id="sidebar-left">
	{global_content name='sidebar-left'}
</div>

<div id="content">
	{content}
</div>

<div id="sidebar-right">
	{global_content name='sidebar-right'}
</div>

<div id="footer">
	{global_content name='footer'}
</div>

{global_content name='analytics'}
<__body>
Je houdt zo het html-sjabloon leeg en overzichtelijk. Alle 'rommelige' code staat in html-blokken

®olf

Re: W3C en <__script__...... Hoe valideren i.r.t. Doctype?

Posted: Sat Jan 28, 2012 4:25 pm
by Gregor
Ja, die schoningsslag moet ik nog maken... Vormt een onderdeel van een algehele opruiming in de backend; na bijna 6jr gebruik is daar toch wat overbodig materiaal in gekomen.

Om terug te komen op het punt in de eerste post, heb je daar wellicht een idee hoe ik dat kan oplossen?

Thnks! Gregor

Re: W3C en <__script__...... Hoe valideren i.r.t. Doctype?

Posted: Sat Jan 28, 2012 5:02 pm
by Rolf
In zekere zin is dat toch wel de basis :) In een opgeruimd sjabloon is het gemakkelijker fouten opsporen ;)

Als doctype zou ik gebruiken:

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed).
Hier verwees ik ook al na. De Javascript/Stylesheets e.d. onder in het sjabloon hoort in de <head>

Re: W3C en <__script__...... Hoe valideren i.r.t. Doctype?

Posted: Sat Jan 28, 2012 5:07 pm
by Rolf
Een verdwaalde </div

Code: Select all

<div class="w3c">
               <a href="http://jigsaw.w3.org/css-validator/check/referer"><img src="http://jigsaw.w3.org/css-validator/images/vcss" alt="valid CSS 2.1" width="88" height="31" border="0" /></a>
            </div
         </div>
         <div class="clear"></div> 
		 </div>

Re: W3C en <__script__...... Hoe valideren i.r.t. Doctype?

Posted: Sat Jan 28, 2012 6:45 pm
by Gregor
Auw Rolf ::)

Helaas leidt dit nog steeds tot eenzelfde aantal foutmeldingen. Zal eens verder gaan spitten in de meldingen van W3C.

Grtz. Gregor

Re: W3C en <__script__...... Hoe valideren i.r.t. Doctype?

Posted: Sat Jan 28, 2012 6:49 pm
by Rolf
Rolf wrote:Als doctype zou ik gebruiken:

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Dit zou in ieder geval het target="_blank" probleem oplossen...

Re: W3C en <__script__...... Hoe valideren i.r.t. Doctype?

Posted: Sat Jan 28, 2012 7:02 pm
by Gregor
Hihihi, dat doet het inderdaad.

Ik weet niet in hoeverre jij er de validator op hebt losgelaten... wat mij opvalt is deze melding:
Line 85, Column 7: end tag for "head" which is not finished
Terwijl die netjes wordt gesloten en ook alle scripts e.d. Eerst eten ;)

Grtz., Gregor

Re: W3C en <__script__...... Hoe valideren i.r.t. Doctype?

Posted: Sat Jan 28, 2012 7:06 pm
by Rolf
Juhh, daar zat ik ook al een tijdje na te kijken...
Ik zie het nog niet... :o\

Re: W3C en <__script__...... Hoe valideren i.r.t. Doctype?

Posted: Sat Jan 28, 2012 7:27 pm
by Gregor
Dit bedenk je niet; de 'regels' schrijven blijkbaar voor dat....

Code: Select all

<title> Whatever </title>
in de head-sectie moet voor komen :-\

One down, seven to go ;)

Re: W3C en <__script__...... Hoe valideren i.r.t. Doctype?

Posted: Sat Jan 28, 2012 7:27 pm
by Rolf
Gregor, ik zou hier eens naar kijken, dit staat waarschijnlijk in de content

Code: Select all

<p>
<em>Het woord whisky is afkomstig van uisge beatha, Keltisch voor levenswater</em>. De correcte uitspraak is “<span style="font-weight: bold;">ooskeh bayuh</span>”, alhoewel de meningen daarover nogal uiteen lopen. De vorige eigenaar heeft de boot zo gedoopt en naar goed gebruik wijzig je de naam van de boot niet als deze van eigenaar verandert. 
<div class="rotate" style="display:none;height:180px;">
		<img src="uploads/images/rotatepages/homepage/P1130018.jpg" width="150px" height="180px" alt="P1130018.jpg" />
		<img src="uploads/images/rotatepages/homepage/P1000676.jpg" width="150px" height="180px" alt="P1000676.jpg" />
		<img src="uploads/images/rotatepages/homepage/P8140135.jpg" width="150px" height="180px" alt="P8140135.jpg" />
		<img src="uploads/images/rotatepages/homepage/CIMG2131.jpg" width="150px" height="180px" alt="CIMG2131.jpg" />
		<img src="uploads/images/rotatepages/homepage/Cobbles_s.jpg" width="150px" height="180px" alt="Cobbles_s.jpg" />
		<img src="uploads/images/rotatepages/homepage/P1130022.jpg" width="150px" height="180px" alt="P1130022.jpg" />
</div>

<__script__ type="text/javascript">$(document).ready(function(){$('.rotate').css('display', 'block');$('.rotate').cycle({fx:'fade',timeout:5000,speed:2000});});</__script> 

Mocht hier wel toe besloten worden, dan schrijft datzelfde gebruik voor dat de oorspronkelijke naam aan de binnenzijde op de romp wordt geschreven. Ik heb er wel over nagedacht de naam te wijzigen en besloten het niet te doen; wat ik er nl. 

<a title="Uisge Beatha" onclick="window.open('uploads/images/uisge-beatha.jpg','Net de eerste meters van de kraan naar de box gevaren','scrollbars=yes,width=800,height=600,left='+(screen.availWidth/2-400)+',top='+(screen.availHeight/2-300)+'');return false;" href="uploads/images/uisge-beatha.jpg" target="_blank">
<img class="freeleftside" style="float: right;" src="uploads/images/uisge-beatha.jpg" alt="Opgetuigd en wel aan de steiger" width="200" height="150" />
</a>
mooi aan vind, is dat er een verhaal aan de naam zit: Uisge Beatha...
</p>
De <p></p> tags worden onderbroken door <div> en <__script__>. Dat mag niet van W3c...

Moet dus worden:
<p> </p>
<div> </div>
<p> </p>


Pagina http://www.uisge-beatha.eu/hanse_311.html
Warning: printf() [function.printf]: Too few arguments in /home/efacti/public_html/uisge-beatha.eu/plugins/function.autometa.php on line 121

Re: W3C en <__script__...... Hoe valideren i.r.t. Doctype?

Posted: Sat Jan 28, 2012 9:43 pm
by Gregor
Dank je Rolf! Dit betekent dus dat de rotate-plugin niet binnen een paragraaf, maar erbuiten moet worden opgenomen. Dit aangepast.

De autometa, is blijkbaar alleen voor News (zie help). Daarom werkt het op andere pagina's niet. Ook weer opgelost :)

Thnks., Gregor

Re: W3C en <__script__...... Hoe valideren i.r.t. Doctype?

Posted: Sun Jan 29, 2012 8:14 am
by Gregor
Homepage is valid :-)

Als Yslow zegt Javascript onderaan de pagina (template?) plaatsen, dan bedoelt ie dat het nog wel voor <__body> staat.

Verder met controleren rest van de site en het onderbrengen GCB.

Grtz.,
Gregor