modx validation issues

429 Posts

I have recently uploaded a site to www.playlacrosse.co.uk

the problem is that the site does not validate.

The HTML templates on its own validates. The CSS files both validate, but added together with Modx tags the site does not validate.

I wondered if someone might help me understand this

Thanks

☆ A M B ☆
24,524 Posts

sottwell Reply #2, 18 years, 1 month ago

Snippets often generate content which is inserted into the template. The snippet’s content may or may not validate. The WebLogin snippet, for example, inserts some javascript that does not validate.

Studying MODX in the desert - http://sottwell.com
Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
Join the Slack Community - http://modx.org

429 Posts

c-m Reply #3, 18 years, 1 month ago

No reason why i’m using i’m using strict, I don’t even understand the difference.

I’m not a web developer. I just like to have a go, or don’t know anyone else who can do it.

Mmm on the
tags, i’m not sure where come from unless its the TinyMCE editor creating them, as copy is just dropped into there.

I have no idea why the site is loading id tags more than once - that will require more investigation.

When a site is just flat pages I can go in and identify where the error lies, in a dynamic site like this I find it difficult as bits are generated form all over the place.

429 Posts

c-m Reply #4, 18 years, 1 month ago

Hi,

The page is still not valid - in fact it is now worse and does not show correctly in Internet Explorer.

You say that w3c validator tells you why the page is not valid which is fine. I understand that
should be
and that div="id" should only be used once.

The problem is that I do not know where these additional tags are coming from. I have not added them, they are not in the template. Modx seems to be creating them itself and its making my site invalid.

Has anyone else had this?

4,205 Posts

dev_cw Reply #5, 18 years, 1 month ago

div id="menuwrapper">
		<ul id="p7menubar">

Here is an example; these need to be changed to classes, since they are part of the menu I can guess that this will be found in the wayfinder tpl chunks. You will also need to modify the style sheet and change the #menuwrapper (for an id) to .menuwrapper (a class).

<br class="clearit">

This tag needs to be closed <br class="clearit" />, since this is used in the content reiteration I am guessing that it is included in a Ditto tpl chunk.

These are not created by MODx, they exist in some custom output that is being generated by a snippet or chunk that you are using to display the content. Look through the chunks and check for this markup.

[font=Verdana]Shane Sponagle | [wiki] Snippet Call Anatomy | MODx Developer Blog | [nettuts] Working With a Content Management Framework: MODx

Something is happening here, but you don't know what it is.
Do you, Mr. Jones? - [bob dylan]

MODX Staff
2,502 Posts

Jay Gilmore Reply #6, 18 years, 1 month ago

I don’t want to get into a religious debate but if you are learning HTML/CSS now, then Strict Doctypes are a must. The biggest reason is that browsers like IE6 and lower will enter quirks mode when issued a transitional doctype and therefore lead to unpredictable browser compatibility issues--especially where the box model is concerned.

The transitional doctype was intended as a transition between old versions of markup and the new standards not as a default minimum. If you are creating new documents there is no reason you can’t make them work with a strict doctype. You can use some inline JS without the cdata wrapper if you correctly identify the document as text/html in the XHTML standard and validate.

99% of validation issues are a result of incorrect use of ids, improperly nested elements and using obsolete or deprecated attributes like name or border within an element tag.

It is not pedantic to build things to a standard. Do you consider local building codes pedantic? The standard is to ensure a minimum agreement on the methods and execution. The HTML/XHTML standards are not perfect and there may be reasons to deviate on an educated basis from the standard to achieve a result.

If a script that is necessary to complete a project can’t be repaired to meet the strict doctype or its not in the client budget go ahead and use the transitional doctype since it is for those cases that it was intended but if you use it because you think that the strict doctype is just for anal-retentive fusspots you are very wrong.

Personally nearly all but one of the projects I’ve done in the last year have been HTML 4.01 strict and many people will scratch their head saying but that’s old. XHTML was not intended to replace HTML 4.01 but to allow use of XML features within the HTML realm. HTML 5 is at least a year out (or longer since the steering comittee is full of arrogant anal-retentive fusspots).

Strict doctypes are not an annoyance, use them unless the project can’t employ them not because they’re too restrictive (they’re not).

Author of zero books. Formerly of many strange things. Pairs well with meats. Conversations are magical experiences. He's dangerous around code but a markup magician. Blog ✦ Twitter ✦ LinkedIn ✦ GitHub

MODX Staff
2,502 Posts

Jay Gilmore Reply #7, 18 years, 1 month ago

Quote from: ganeshXL at Aug 12, 2008, 08:27 AM

Wow, did I step on your toes there?

No. I think I misunderstood your advice. I ended coming off a little crazy no offense taken or intended.

Quote from: ganeshXL at Aug 12, 2008, 08:27 AM

When someone says something like that, it clearly means he won’t bother learning anything about doctypes, or semantic markup. Somebody with that background/attitude just wants to get things done (in this case, get things done with modx).

I may be wrong, but I guess he just wants to fix the errors and move on. Not spend the next couple of weeks becoming a webdev pro. If you just want a quick personal site / blog, chances are you don’t want to learn about CDATA et al. Remember, the web is a democratic medium.

Based on your points. c-m should just forget validation. doctype is irrelevant if you don’t care or understand the difference between trans and strict. If getting it done is the goal don’t worry about making it valid. Just make it look good in browsers and call it a day.

When I was starting out I was just happy that a design looked and worked as it should in IE and (then Opera 0.80 ) so I do understand the position.

@ganeshXL you are right the web is for many voices and I felt like shouting. I have regained my pragmatic sanity. Cheers all.

Author of zero books. Formerly of many strange things. Pairs well with meats. Conversations are magical experiences. He's dangerous around code but a markup magician. Blog ✦ Twitter ✦ LinkedIn ✦ GitHub

429 Posts

c-m Reply #8, 18 years, 1 month ago

Quote from: dev_cw at Aug 12, 2008, 06:39 AM

div id="menuwrapper">
		<ul id="p7menubar">
Here is an example; these need to be changed to classes, since they are part of the menu I can guess that this will be found in the wayfinder tpl chunks. You will also need to modify the style sheet and change the #menuwrapper (for an id) to .menuwrapper (a class).
<br class="clearit">
This tag needs to be closed <br class="clearit" />, since this is used in the content reiteration I am guessing that it is included in a Ditto tpl chunk.

These are not created by MODx, they exist in some custom output that is being generated by a snippet or chunk that you are using to display the content. Look through the chunks and check for this markup.

All of the things that break the site (apart form p7menubar) have not been added me. As i said my template validates strict (before modx necessary code such as [!wayfinder!] etc.. is added and so does my css. My chunks also validate individually. its when everythign is thrown together.

id tags and
(without the /) appear all over the place and i have no idea why.

On a normal website I can go into the HTML find the line of code that is wrong and change it. On the Modx site I don’t know where that line of code comes from. For some reason <div id="mainnav" appears in every menu option rather than just the menu as a whole. Why would that be?

below is my template:

<!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-US" xml:lang="en-US">
<head>
	<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
	
	<base href="[(site_url)]"/>
	
		<link rel="stylesheet" href="[(base_url)]assets/templates/ecmodx/p7exp/p7exp.css" />
	<link rel="stylesheet" href="[(base_url)]assets/templates/ecmodx/css/style.css" />
<script type="text/javascript" src="[(base_url)]assets/templates/ecmodx/p7exp/p7exp.js"></script>


	<title> [*pagetitle*] | [(site_name)]</title>
	
	
</head>



<body onLoad="P7_ExpMenu()">
	<div class="dropshadow">
		<div id="wrapper">
			<h1 class="banner"><span>East Coast Lacrosse</span></h1>
			
			
			<div id="navigation">
[[Wayfinder? &config=`project-seven`]]  

</div>
			
			
			<div id="maincontent">

<div id="rightcontent">
{{googlesearch}}

<div id="hello">

		<h2><span>hello</span></h2>
</div>
 [!WebLogin? &tpl=`FormLogin` &loginhomeid=`[(site_start)]`!]

{{links}}
</div>

				<div id="leftcontent">
    	<div class="padding">

<div id="content-main">
		[*content*]	
</div>
</div> <!-- end content-main -->

			</div>					


			</div>
		</div>
	</div>
	
<div id="footer">
	{{cixfooter}}

	</div><!-- end of site-info -->

	
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>

<script type="text/javascript">
_uacct = "UA-2350585-1";
urchinTracker();
</script>


</body>
</html>

4,205 Posts

dev_cw Reply #9, 18 years, 1 month ago

[[Wayfinder? &config=`project-seven`]]

The navigation chucks may be included as part of the config file. I would look there for more on this.

The developer who coded the site may have nested the snippets within chunks and used external files as templates (if you can;t find them in the chunk list).

On a normal website I can go into the HTML find the line of code that is wrong and change it. On the Modx site I don’t know where that line of code comes from. For some reason <div id="mainnav" appears in every menu option rather than just the menu as a whole. Why would that be?

MODx works in the same way, but the output is devided into parts that are normally stored in chunks. I am sure that wayfinder is configured to output this code. I would contact the person who coded the site and have them correct this.

[font=Verdana]Shane Sponagle | [wiki] Snippet Call Anatomy | MODx Developer Blog | [nettuts] Working With a Content Management Framework: MODx

Something is happening here, but you don't know what it is.
Do you, Mr. Jones? - [bob dylan]

429 Posts

c-m Reply #10, 18 years, 1 month ago

I coded the site - thought someone on these forums helped me with the p7 menu code.

I created a file called project-seven.config.php which contains the following:

<?php
	
	$startId = 0;
	$level = 2;
	$hereClass = ''; 
    $firstClass = '';
    $selfClass = ''; 
    $lastClass = '';
    $levelClass = '';
    $innerClass = '';
	$parentClass = 'trigger';
	$outerClass = '';

	$outerTpl = '@CODE:<div id="main-nav">
	<div id="menuwrapper">
		<ul id="p7menubar">
			[+wf.wrapper+]
		</ul>		
<br class="clearit">
	</div>
	</div>';

	$rowTpl = '@CODE:<li[+wf.classes+]><a href="[+wf.link+]" title="[+wf.title+]">[+wf.linktext+]</a>[+wf.wrapper+]</li>';

	$parentRowTpl = '@CODE:<li><a [+wf.classes+] href="[+wf.link+]" title="[+wf.title+]">[+wf.linktext+]</a>[+wf.wrapper+]</li>';
	
?>

then i have the following call for the menu

[[Wayfinder? &config=`project-seven`]]