Menu problem - repeated <ul> - XHTML validation

For questions and problems with the CMS core. This board is NOT for any 3rd party modules, addons, PHP scripts or anything NOT distributed with the CMS made simple package itself.
brippon
Forum Members
Forum Members
Posts: 18
Joined: Wed Feb 07, 2007 10:28 pm

Menu problem - repeated <ul> - XHTML validation

Post by brippon »

I've hit a problem with menu manager which I can't see see through - CMSMS v 1.2.

I want a left menu to show all of the children of a top-level node called Services - with collapse set to 1:

Code: Select all

{menu collapse='1' start_page='services' template='simple_navigation.tpl'}
It looks and works OK, but it won't XHTML validate as the code looks like:

Code: Select all

<ul>
<ul>
<li> ... </li>
<li> ... </li>
</ul>
</ul>
It's clearly something to do with

Code: Select all

{repeat string="<ul>" times=$node->depth-$node->prevdepth}
in the menu. I've tried variations on the start_level parameter, with no joy.

Any ideas anyone?

Brian
cnymike
Power Poster
Power Poster
Posts: 446
Joined: Sun Jan 22, 2006 3:24 am

[solved] Re: Menu problem - repeated <ul> - XHTML validation

Post by cnymike »

I've got the same problem. I was checking validation on several of my sites just now and they are showing this same problem.

Here is the portion of the invalid markup validation report...

Code: Select all

#  Error  Line 142, Column 3: document type does not allow element "ul" here; assuming missing "li" start-tag.

<ul>

✉
# Error Line 237, Column 15: XML Parsing Error: Opening and ending tag mismatch: ul line 141 and li.

</li></ul></li>

✉
# Error Line 238, Column 5: XML Parsing Error: Opening and ending tag mismatch: li line 139 and ul.

</ul>

✉
# Error Line 239, Column 11: XML Parsing Error: Opening and ending tag mismatch: ul line 139 and li.

<br /></li></ul>

✉
# Error Line 239, Column 16: XML Parsing Error: Opening and ending tag mismatch: div line 135 and ul.

<br /></li></ul>
I'm using CMSMS 1.2.3

And incidentally, the cmsmadesimple.org home page has 10 CSS validation issues

Code: Select all

URI : http://www.cmsmadesimple.org/stylesheet.php?templateid=16
181 		Value Error : min-width Property min-width doesn't exist : 0
181 		Combinator ~ between selectors is not allowed in this profile or version
220 		Unknown pseudo-element or pseudo-class %s
220 		Unknown pseudo-element or pseudo-class :only-child
220 		Unknown pseudo-element or pseudo-class %s
239 		Unknown pseudo-element or pseudo-class %s
239 		Unknown pseudo-element or pseudo-class :only-child
239 		Unknown pseudo-element or pseudo-class %s
244 	* 	Parse Error - *html p.features-more { display:none; }
URI : http://www.cmsmadesimple.org/stylesheet.php?templateid=16&mediatype=print
7 	body * 	Value Error : background-color none is not a color value : none
Last edited by cnymike on Mon Jan 14, 2008 8:24 pm, edited 1 time in total.
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: Menu problem - repeated <ul> - XHTML validation

Post by Dr.CSS »

What does it look like around your menu tags, just before and after including the menu tag, from template...
cnymike
Power Poster
Power Poster
Posts: 446
Joined: Sun Jan 22, 2006 3:24 am

Re: Menu problem - repeated <ul> - XHTML validation

Post by cnymike »

Mark, here is the entire template... and by the way the URL is http://www.fcap.org

Code: Select all

<!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" xml:lang="en" lang="en">
<!-- Change lang="en" to the language of your site -->

<head>

<title>{sitename} - {title}</title>
<!-- The sitename is changed in Site Admin/Global settings. {title} is the name of each page -->

{metadata}
<!-- Don't remove this! Metadata is entered in Site Admin/Global settings. -->

{stylesheet}
<!-- This is how all the stylesheets attached to this template are linked to -->

{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 -->



{literal}
<__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 lte IE 6]>
<style type="text/css">
#pagewrapper {width:expression(P7_MinMaxW(720,950));}
#container {height: 1%;}
</style>
<![endif]-->
{/literal}
<!-- The min and max page width for Internet Explorer is set here. For other browsers it's in the stylesheet "Layout: Top menu + 2 columns" -->


</head>

</__body>

<div id="pagewrapper">

    <!-- 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 -->


   <!-- Start Header, with logo image that links to the default start page. Logo image is changed in the stylesheet  "For template: Top menu + left submenu + 1 column" -->
   <div id="header">
           <h1>{cms_selflink dir="start" text="$sitename"}</h1>
   <hr class="accessibility" />
   </div>
   <!-- End Header -->


   <!-- Start Navigation -->
   <div id="menu_horiz">
      <h2 class="accessibility">Navigation</h2>
      {menu template='simple_navigation.tpl' number_of_levels='1'}
   <hr class="accessibility" />
   </div>
   <!-- End Navigation -->


   <!-- Start Search-->
   <div id="search">
          {search}
   </div>
   <!-- End Search -->

   <!-- Start Breadcrumbs -->
   <div class="breadcrumbs">
        {breadcrumbs starttext='You are here' root='Home' delimiter='»'}
   <hr class="accessibility" />
   </div>
   <!-- End Breadcrumbs -->


   <!-- Start Content (Navigation and Content columns) -->
   <div id="content">

      <!-- Start Sidebar -->
      <div id="sidebar">

      <!-- Start Sub Navigation -->
      <div id="menu_vert">
         <h2 class="accessibility">Sub Navigation</h2>

          <!-- NB! The <ul><li> below is only added because several default templates use the same menu stylesheet, to "force" the subnavigation to act as if it's the second level in a list -->
          <ul><li>{menu template='simple_navigation.tpl' start_element='4' collapse='1'}<br /></li></ul>
      <hr class="accessibility" />
      </div>
      <!-- End Sub Navigation -->
   <!-- Start addressblock -->
   <div class="addressblock">
      {global_content name='addressblock'}
      <hr class="accessibility" />
   </div>
   <!-- End addressblock -->


      </div>
      <!-- End Sidebar -->


      <!-- Start Content Area -->
      <div id="main">
         <div style="float: right;">{print showbutton=true script=true}</div>
         <h2>{title}</h2>
         {content} <br />



         <!-- Start relational links -->
	 <div class="hr"></div>
	 <div class="right49">
	 	<p>{anchor anchor='main' text='^ Top'}</p>
	 </div>
         <div class="left49">
            <p>{cms_selflink dir="previous" label="Previous page: "} <br />
            {cms_selflink dir="next"}</p>
         </div>
         <!-- 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" -->
	 <!-- End relational links -->

      <hr class="accessibility" />
      </div>
	  <!-- End Content Area -->


   </div>
   <!-- End Content -->


   <!-- Start Footer. Edit the footer in the Global Content Block called "footer" -->
   <div id="footer">
      {global_content name='footer'}
   </div>   
   <!-- End Footer  -->


</div><!-- end pagewrapper -->
<__body>
</__html>
cnymike
Power Poster
Power Poster
Posts: 446
Joined: Sun Jan 22, 2006 3:24 am

Re: Menu problem - repeated <ul> - XHTML validation

Post by cnymike »

It seems that the menu template is somehow generating an extra and tag for reasons I cannot quite grasp.
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: Menu problem - repeated <ul> - XHTML validation

Post by Dr.CSS »

It's in the template, just as I thought, I remember seeing this in a default install...

         
          {menu template='simple_navigation.tpl' start_element='4' collapse='1'}

     
cnymike
Power Poster
Power Poster
Posts: 446
Joined: Sun Jan 22, 2006 3:24 am

Re: Menu problem - repeated <ul> - XHTML validation

Post by cnymike »

So is this a bug in the default template? Should I fix this in the default template file itself?
Last edited by cnymike on Sat Jan 12, 2008 9:49 pm, edited 1 time in total.
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: Menu problem - repeated <ul> - XHTML validation

Post by Dr.CSS »

It's not a bug, as you will see in the comment above it, it was included for times when you may end up using it for a second level menu that starts under a section header that is set to not show in the menu...

{menu start_element="5.1" show_root_siblings="1"}

This call assumes you have 5 set as a section header not shown in menu so it starts at the first page below which would leave out the   because the section header would have been it and show_root_siblings will show all children of 5...

So for how you are using it just take out all marked in red, of course you can remove the comment also...

{menu template='simple_navigation.tpl' start_element='4' collapse='1'}
cnymike
Power Poster
Power Poster
Posts: 446
Joined: Sun Jan 22, 2006 3:24 am

Re: Menu problem - repeated <ul> - XHTML validation

Post by cnymike »

I tried removing the code you had highlighted in red and the page still does not validate. Actually the code ends up looking the same to me...

Code: Select all

   <!-- Start Content (Navigation and Content columns) -->
   <div id="content">

      <!-- Start Sidebar -->
      <div id="sidebar">

      <!-- Start Sub Navigation -->
      <div id="menu_vert">

         <h2 class="accessibility">Sub Navigation</h2>

          <!-- NB! The <ul><li> below is only added because several default templates use the same menu stylesheet, to "force" the subnavigation to act as if it's the second level in a list -->
           

<ul>
<ul>

<li class="sectionheader">FCAP Main Menu


</li>

<li><a href="http://www.fcap.org/index.php?page=about-fcap"><dfn>4.2: </dfn>About FCAP</a>

</li>
Is it the simple_navigation.tpl causing the problem?
cnymike
Power Poster
Power Poster
Posts: 446
Joined: Sun Jan 22, 2006 3:24 am

Re: Menu problem - repeated <ul> - XHTML validation

Post by cnymike »

Mark,

When I remove the code you had in red and revalidate, I get 5 vaiidation errors

Code: Select all

Validation Output:  5 Errors

   1. Error Line 142, Column 3: document type does not allow element "ul" here; assuming missing "li" start-tag .
      <ul>
      ✉
   2. Error Line 237, Column 15: XML Parsing Error: Opening and ending tag mismatch: ul line 141 and li .
      </li></ul></li>
      ✉
   3. Error Line 238, Column 5: XML Parsing Error: Opening and ending tag mismatch: div line 135 and ul .
      </ul>
      ✉
   4. Error Line 309, Column 6: XML Parsing Error: Opening and ending tag mismatch: body line 55 and div .
      </div><!-- end pagewrapper -->
      ✉
   5. Error Line 310, Column 7: XML Parsing Error: Opening and ending tag mismatch: html line 4 and body .
      <__body>
     ✉

When I put the code in red back in and validate, I get this...

Code: Select all

Validation Output:  7 Errors

   1. Error Line 142, Column 3: document type does not allow element "ul" here; assuming missing "li" start-tag .
      <ul>
      ✉
   2. Error Line 237, Column 15: XML Parsing Error: Opening and ending tag mismatch: ul line 141 and li .
      </li></ul></li>
      ✉
   3. Error Line 238, Column 5: XML Parsing Error: Opening and ending tag mismatch: li line 139 and ul .
      </ul>
      ✉
   4. Error Line 239, Column 11: XML Parsing Error: Opening and ending tag mismatch: ul line 139 and li .
      <br /></li></ul>
      ✉
   5. Error Line 239, Column 16: XML Parsing Error: Opening and ending tag mismatch: div line 135 and ul .
      <br /></li></ul>
      ✉
   6. Error Line 309, Column 6: XML Parsing Error: Opening and ending tag mismatch: body line 55 and div .
      </div><!-- end pagewrapper -->
      ✉
   7. Error Line 310, Column 7: XML Parsing Error: Opening and ending tag mismatch: html line 4 and body .
      <__body>
      ✉
cnymike
Power Poster
Power Poster
Posts: 446
Joined: Sun Jan 22, 2006 3:24 am

Re: Menu problem - repeated <ul> - XHTML validation

Post by cnymike »

Source code of page without removing the code in red...

Code: Select all

<!-- Start Sub Navigation -->
      <div id="menu_vert">
         <h2 class="accessibility">Sub Navigation</h2>
          <!-- NB! The <ul><li> below is only added because several default templates use the same menu stylesheet, to "force" the subnavigation to act as if it's the second level in a list -->
          <ul><li> 
<ul>
<ul>
<li class="sectionheader">FCAP Main Menu
</li>
<li><a href="http://www.fcap.org/index.php?page=about-fcap"><dfn>4.2: </dfn>About FCAP</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=resources"><dfn>4.3: </dfn>Resources</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=weekly-briefing"><dfn>4.4: </dfn>Weekly Briefing</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=fcap-world-news"><dfn>4.5: </dfn>FCAP World News</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=training-seminars"><dfn>4.6: </dfn>Training Seminars</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=links-to-fcap-groups"><dfn>4.7: </dfn>Links to FCAP Groups & Ministry Partners</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=events"><dfn>4.8: </dfn>Events</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=prayer-fellowship"><dfn>4.9: </dfn>Prayer Fellowship</a>
</li>
<li class="sectionheader">FCAP Worldwide Contacts
</li>
<li><a href="http://www.fcap.org/index.php?page=africa"><dfn>4.11: </dfn>Africa</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=asia"><dfn>4.12: </dfn>Asia</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=canada"><dfn>4.13: </dfn>Canada</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=caribbean"><dfn>4.14: </dfn>Caribbean</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=europe"><dfn>4.15: </dfn>Europe</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=mexico"><dfn>4.16: </dfn>Mexico</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=south-america"><dfn>4.17: </dfn>South America</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=south-pacific"><dfn>4.18: </dfn>South Pacific</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=united-states"><dfn>4.19: </dfn>United States</a>
</li></ul></li>
</ul>
<br /></li></ul>
      <hr class="accessibility" />
      </div>
      <!-- End Sub Navigation -->
Source code when your code in red is removed...

Code: Select all

<!-- Start Sub Navigation -->
      <div id="menu_vert">
         <h2 class="accessibility">Sub Navigation</h2>
         <!-- NB! The <ul><li> below is only added because several default templates use the same menu stylesheet, to "force" the subnavigation to act as if it's the second level in a list -->
<ul>
<ul>
<li class="sectionheader">FCAP Main Menu
</li>
<li><a href="http://www.fcap.org/index.php?page=about-fcap"><dfn>4.2: </dfn>About FCAP</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=resources"><dfn>4.3: </dfn>Resources</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=weekly-briefing"><dfn>4.4: </dfn>Weekly Briefing</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=fcap-world-news"><dfn>4.5: </dfn>FCAP World News</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=training-seminars"><dfn>4.6: </dfn>Training Seminars</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=links-to-fcap-groups"><dfn>4.7: </dfn>Links to FCAP Groups & Ministry Partners</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=events"><dfn>4.8: </dfn>Events</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=prayer-fellowship"><dfn>4.9: </dfn>Prayer Fellowship</a>
</li>
<li class="sectionheader">FCAP Worldwide Contacts
</li>
<li><a href="http://www.fcap.org/index.php?page=africa"><dfn>4.11: </dfn>Africa</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=asia"><dfn>4.12: </dfn>Asia</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=canada"><dfn>4.13: </dfn>Canada</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=caribbean"><dfn>4.14: </dfn>Caribbean</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=europe"><dfn>4.15: </dfn>Europe</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=mexico"><dfn>4.16: </dfn>Mexico</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=south-america"><dfn>4.17: </dfn>South America</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=south-pacific"><dfn>4.18: </dfn>South Pacific</a>
</li>
<li><a href="http://www.fcap.org/index.php?page=united-states"><dfn>4.19: </dfn>United States</a>
</li></ul></li>
</ul>
<br />
      <hr class="accessibility" />
      </div>
      <!-- End Sub Navigation -->
So it looks like a more complicated issue than just removing the code in red.

Thanks for your help on this.

Micihael
cnymike
Power Poster
Power Poster
Posts: 446
Joined: Sun Jan 22, 2006 3:24 am

Re: Menu problem - repeated <ul> - XHTML validation

Post by cnymike »

Mark, or anyone...

It seems that there needs to be some additional logic in the simple_navigation.tpl file to deal with this issue don't you think? A site should validate and if a legitimate option to build a menu is used, the site should still validate. But it's not validating because of the extra code that is being put in.
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: Menu problem - repeated <ul> - XHTML validation

Post by Dr.CSS »

What does your page structure look like, in Content > Pages?...

I have a default install and it uses the same template and it doesn't do this...

        Sub Navigation

                      These are in the template like above just before the {menu tag



3.1: CMSMS tags in the templates




By the way I like the google calendar embed...
RonnyK
Support Guru
Support Guru
Posts: 4962
Joined: Wed Oct 25, 2006 8:29 pm

Re: Menu problem - repeated <ul> - XHTML validation

Post by RonnyK »

I noticed the same behaviour as described, but only when the "Section Header" was used as content-type....

Ronny
KO
Power Poster
Power Poster
Posts: 562
Joined: Mon Nov 06, 2006 7:55 pm

Re: Menu problem - repeated <ul> - XHTML validation

Post by KO »

Is that start_element='4' in second menu call "Section Header" ? i blieve simple_navigation.tpl will not cope very well in that situation. Neighter will any other template.

What you could do is to copy that simple_navigation.tpl and make simple_navigation2.tpl where you have removed first and last then make you menu call like:

{menu template='simple_navigation2.tpl' start_element='4' collapse='1'}

Then it probably validates as long as that start_element remains section header.
Post Reply

Return to “CMSMS Core”