WP-dTree 3.3.2 doesn’t validate: ul tags followed by div, no li tags

Experiment. Worst case scenario is that the output looks jumbled in your browser.

I haven’t read the XHTML specs, but I have (just recently) begun using validation (through the Web Developer plugin in firefox). I’ll try and make sure the next release of WP-dTree validates correctly – but there’s a lot of different setups that needs to be tested.

If you manage to validate your fix, please post it here. It would save me some time. ??

Okay, So I rolled up my sleeves and played around a little here are my findings:

1. Adding <li>‘s after the <ul>‘s and </li>‘s before the </ul>‘s validates but you get a bullet and you get an ugly white space of 1em before and after the tree.
2. Changing the <ul>‘s and </ul>‘s to <br />‘s validates and rids you of the bullet but you still get the ugly white space of 1em before and after the tree.
3. Changing the <ul>‘s to <p>‘s and </ul>‘s to </p>‘s and changing the<div id="dtree...">‘s to <span id="dtree..."> is the best solution that validates (even without the <p>‘s)

So problem solved?? NO!!! I managed to change the closing </div> tags but I can’t find the opening <div> tag anywhere. Any piece of code that would generate the <div> with the ID tag doesn’t seem to influence the opening tag at all.

I’m at a loss. If anyone knows what to change to turn the <div> in a <span> I’d be a real happy camper.

The opening div is written on line 23 in wp-dtree_gen-functions.php:
$tree .= "\n<div id=\"dtree" . $treetype . "wrapper\">\n";

and it’s closed in the function wp_dtree_get_[treetype]() found in wp-dtree_arc-functions.php, wp-dtree_cat-functions.php and wp-dtree_pge-functions.php respectively.

Hope this helps. Good work so far!

Unfortunately no. I had already changed that div to span but it still generates a <div id="dtreepgewrapper">, <div id="dtreearcwrapper"> and <div id="dtreecatwrapper">. That’s what’s so frustrating to me. I scanned all PHP files for a possible piece of code that could be the cause of this but I can’t find anything. But then I’m no PHP buff at all. All attempts to write my own PHP code have failed so far resulting in a blank page. But I’m just getting started.

For now I’ve fixed it for myself using the <br /> tags instead of the <ul> and </ul> tags and worked around the white space with CSS using negative margins. Like this:

#wp-dtree-pages br, #wp-dtree-archives br, #wp-dtree-categories br {
	margin: -0.5em;
}

I’ve placed it in my theme’s stylesheet (style.css) but it would probably also work if you place it in the plugin’s style.php. (haven’t tried it though).
It’s a work around that validates but it’s not the right way to do it. Just like a seatbelt will keep your pants up as long as you don’t get out of the car.

You’ve probably run into the cache you know. ??

ie. your changes were probably right, but you kept getting the old tree from the DB. Just go to the dtree config page and press “update settings” whenever you need to force a tree refresh.

YES!! that was it. Thank you!
I was thrown off by the fact that the closing </span> tag did appear in the code. After refreshing the plug-in settings the starting <span> tag was generated.
Thank you for your help.

PS. if you want to learn more about the XHTML specs, don’t dig through the W3C documents. That’s really dry reading. Instead check out Patrick Griffiths’ HTMLDog website. (https://www.htmldog.com. He has HTML & CSS tutorials on 3 different levels where he teaches it the right way. (Did you know that 85% of all websites don’t validate?)

Okay, now a recap for those people who prefer to skip to the end of a thread to read the answer.

To get the WP-dTree 3.3.2 generated XHTML to validate make the following changes.

Changes to wp-dtree.php.
lines 134, 148 and 162 change the <ul> into <p>.
lines 140, 154 and 168 change the </ul> into </p>.

Changes to wp-dtree_gen-functions.php.
line 26 change the <div id=\... into <span id=\...
so that the line looks like this:
$tree .= "\n<span id=\"dtree" . $treetype . "wrapper\">\n";

Changes to wp-dtree_arc-functions.php, wp-dtree_cat-functions.php and wp-dtree_pge-functions.php.
Find the line
echo "</div>\n";
in each file and change it to
echo "</span>\n";

That’s it!
Don’t forget to push that update settings button on the WP-dTree settings page to clear the cache.

Thank you! Great work. I’ll make sure to implement your changes in the next release.