Menu Problem

For discussion and questions related to CMS Specific templates and stylesheets (CSS), and themes. or layout issues. This is not a place for generic "I don't know CSS issues"
Post Reply
earcandy
Forum Members
Forum Members
Posts: 58
Joined: Sat Jan 11, 2014 4:37 pm

Menu Problem

Post by earcandy »

I just cannot get this menu to work properly. An example of how it should appear at https://californiaschooloflaw.com

Here is the menu:

Code: Select all

{* CSS classes used in this template:
#menuwrapper - The id for the <div> that the menu is wrapped in. Sets the width, background etc. for the menu.
#primary-nav - The id for the <ul>
.menuparent - The class for each <li> that has children.
.menuactive - The class for each <li> that is active or is a parent (on any level) of a child that is active. *}

{assign var='number_of_levels' value=10000}
{if isset($menuparams.number_of_levels)}
  {assign var='number_of_levels' value=$menuparams.number_of_levels}
{/if}

{if $count > 0}
<ul class="sf-menu">
{foreach from=$nodelist item=node name=menuitem}
{assign var=next_index value=$node->index+1}
{if $node->depth > $node->prevdepth}
{repeat string='<ul class="unli">' times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string='</li></ul>' times=$node->prevdepth-$node->depth}
</li>
{elseif $node->index > 0}</li>
{/if}

{if $node->parent == true or $node->current == true}
  {assign var='classes' value='menuactive'}
  {if $node->parent == true}
    {assign var='classes' value='menuactive menuparent'}
  {/if}
  {if $node->children_exist == true and $node->depth < $number_of_levels}
    {assign var='classes' value=$classes|cat:' parent'}
  {/if}
  <li id="{$node->alias}" class="{$classes}{if $nodelist[$next_index]->depth < $node->depth} last{/if}"><a class="{$classes}" 
{elseif $node->type == 'sectionheader' and $node->haschildren == true}
  <li id="{$node->alias}" class="menuparent{if $nodelist[$next_index]->depth < $node->depth} last{/if}"><a class="menuparent"><span class="sectionheader">{$node->menutext}</span></a>
{elseif $node->type == 'sectionheader'}
  <li id="i{$node->alias}"><a><span class="sectionheader">{$node->menutext}</span></a>
{elseif $node->type == 'separator'}
  <li id="{$node->alias}" style="list-style-type: none;"> <hr class="menu_separator" />
{elseif $node->children_exist == true and $node->depth < $number_of_levels and $node->type != 'sectionheader' and $node->type != 'separator'}
  <li id="{$node->alias}"class="menuparent{if $nodelist[$next_index]->depth < $node->depth} last{/if}"><a class="menuparent" 
{else}
  <li id="{$node->alias}"{if $nodelist[$next_index]->depth < $node->depth} class="last"{/if}>
  <a 
{/if}

{if ($node->type != 'sectionheader' and $node->type != 'separator') or $node->parent == true or $node->current == true }
 {if $node->target}target="{$node->target}" {/if}
href="{$node->url}"><span>{$node->menutext}</span></a>
{/if}
{/foreach}
{repeat string='</li></ul>' times=$node->depth-1}
</li>
</ul>
{/if}
JohnnyB
Dev Team Member
Dev Team Member
Posts: 731
Joined: Tue Nov 21, 2006 5:05 pm

Re: Menu Problem

Post by JohnnyB »

Do you have a working example of the broken one? I'd like to see the HTML source and know exactly what is broken....
"The art of life lies in a constant readjustment to our surroundings." -Okakura Kakuzo

--
LinkedIn profile
--
I only speak/write in English so I may not translate well on International posts.
--
earcandy
Forum Members
Forum Members
Posts: 58
Joined: Sat Jan 11, 2014 4:37 pm

Re: Menu Problem

Post by earcandy »

Thats part of the problem.

The "Live" site looks great (californiaschooloflaw.com) and the menu template is exactly as posted above on both the live site and my "test" site (http://lowcostlawschool.com/).

If the text "Centrix" is removed from the menu template on the live site, the site completely crashes. The only way to get the site functioning again is via a restore.

However if the text "Centrix" is removed from the menu template on the test site, the menu is broken but the entire site does not crash as does the live one.

Hate to have to wipe this site and start over but its starting to look like the only option!
JohnnyB
Dev Team Member
Dev Team Member
Posts: 731
Joined: Tue Nov 21, 2006 5:05 pm

Re: Menu Problem

Post by JohnnyB »

Probably not be the menu template.

Looks like some garbage or some HTML structure issue in the page template. Look at the View Source of the site. All of that HTML before the doctype shouldn't be there.... I would start by creating a Test template that contains only the following and assign a page to it. If none of that garbage is in the view source while using the Test template, you can safely assume it is not the menu...

Code: Select all

<!DOCTYPE>
< html >
< head >
{metadata}
{cms_stylesheet}
< /head >
< body >
{menu}<br>
{content}<br>
< /body >
< /html >
This is the view source of the test site.

Code: Select all

<base href="http://lowcostlawschool.com/" />
<meta name="Generator" content="Low Cost Law School - Copyright (C) 2014-15 California School of Law. All rights reserved." />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 

<ul class="sf-menu">

        <li id="home" class="menuactive last"><a class="menuactive" 

 href="http://lowcostlawschool.com/"><span>Home</span></a>

</li>
</ul>

<meta name="description" content="Home Page, shortcut key=1" />

<!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" >
 
<title>Home - Low Cost Law School</title>
<head>
<meta name="google-site-verification" content="CcWRiF0e6ySW9zfxBfnW9yVMrGlCFB16lExQF8TmkNQ" />
<meta name="google-site-verification" content="DPXyJz1lXcazRUBSAs6bkaXyoK5cqrFGUVltC8Zu0MI" />
<title>Low Cost Law School</title>
    
<base href="http://lowcostlawschool.com/" />
"The art of life lies in a constant readjustment to our surroundings." -Okakura Kakuzo

--
LinkedIn profile
--
I only speak/write in English so I may not translate well on International posts.
--
User avatar
velden
Dev Team Member
Dev Team Member
Posts: 3497
Joined: Mon Nov 28, 2011 9:29 am

Re: Menu Problem

Post by velden »

Seams like you have {metadata} tag twice in your template?

Often page templates start with

Code: Select all

{process_pagedata}<!DOCTYPE html...
Could it be that {process_pagedata} accidentally has been replaced by {metadata}?
earcandy
Forum Members
Forum Members
Posts: 58
Joined: Sat Jan 11, 2014 4:37 pm

Re: Menu Problem

Post by earcandy »

I don't think anyone is going to find the cause here unfortunately. Looks like we may need to start from scratch.
JohnnyB
Dev Team Member
Dev Team Member
Posts: 731
Joined: Tue Nov 21, 2006 5:05 pm

Re: Menu Problem

Post by JohnnyB »

just post a copy of the page template code (Layout, Templates). I gaurantee if there is something wrong with the template, someone will be able to tell you.
"The art of life lies in a constant readjustment to our surroundings." -Okakura Kakuzo

--
LinkedIn profile
--
I only speak/write in English so I may not translate well on International posts.
--
earcandy
Forum Members
Forum Members
Posts: 58
Joined: Sat Jan 11, 2014 4:37 pm

Re: Menu Problem

Post by earcandy »

Here is the template:

Code: Select all

{metadata}
<meta name="description" content="{description}" />
{process_pagedata}
{mobile}{capture assign='mobiletemp'}{$mobile_detect}{/capture}
{capture assign='normal_content'}{content}{/capture}
{capture assign="mobilecontent"}{content block="mobile-content" wysiwyg="false"}{/capture}
{capture assign="sidebar"}{content block="sidebar"}{/capture}
<!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" >
{content block="custom_title" assign="custom_title" oneline="true" label="Custom Title Text"}
 
{if $custom_title}
<title>{$custom_title} - {sitename}</title>
{else}
<title>{title} - {sitename}</title>
{/if}
<head>
<meta name="google-site-verification" content="CcWRiF0e6ySW9zfxBfnW9yVMrGlCFB16lExQF8TmkNQ" />
<meta name="google-site-verification" content="DPXyJz1lXcazRUBSAs6bkaXyoK5cqrFGUVltC8Zu0MI" />
<title>{if $page_name !='home'}{title} - {/if}{sitename}</title>
{*If the device is mobile load the mobile CSS and Jquery files*}
    {if $mobiletemp}
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet"  href="{root_url}/mobile/css/themes/default/jquery.mobile-1.3.0.css" />
        <link rel="stylesheet" href="{root_url}/mobile/docs/_assets/css/jqm-docs.css" />
        <link href="{root_url}/mobile/photoswipe/photoswipe.css" type="text/css" rel="stylesheet" />
        <__script__ src="{root_url}/mobile/js/jquery.js"></__script>
        <__script__ src="{root_url}/mobile/docs/_assets/js/jqm-docs.js"></__script>
        <__script__ src="{root_url}/mobile/js/jquery.mobile-1.3.0.js"></__script>
        <__script__ type="text/javascript" src="{root_url}/mobile/photoswipe/lib/klass.min.js"></__script>
        <__script__ type="text/javascript" src="{root_url}/mobile/photoswipe/code.photoswipe-3.0.5.min.js"></__script>
        {literal}
        <__script__ type="text/javascript">
        $(document).bind('mobileinit',function(){
            $.mobile.page.prototype.options.keepNative = "select, input, textarea.bar";
            $.mobile.ajaxEnabled = false;
        });
        (function(window, $, PhotoSwipe){
                    
                    $(document).ready(function(){
                        
                        $('div.gallery-page')
                            .live('pageshow', function(e){
                                
                                var 
                                    currentPage = $(e.target),
                                    options = {},
                                    photoSwipeInstance = $("ul.gallery a", e.target).photoSwipe(options,  currentPage.attr('id'));
                                    
                                return true;
                                
                            })
                            
                            .live('pagehide', function(e){
                                
                                var 
                                    currentPage = $(e.target),
                                    photoSwipeInstance = PhotoSwipe.getInstance(currentPage.attr('id'));
        
                                if (typeof photoSwipeInstance != "undefined" && photoSwipeInstance != null) {
                                    PhotoSwipe.detatch(photoSwipeInstance);
                                }
                                
                                return true;
                                
                            });
                        
                    });
                
                }(window, window.jQuery, window.Code.PhotoSwipe));
                
            </__script>
    {/literal}
    
    {*If not load the normal Browser CSS and Jquery  files*}
    {else}
{metadata}
<link rel="stylesheet" href="{root_url}/css/reset.css" type="text/css" media="all">
<link rel="stylesheet" href="{root_url}/css/grid.css" type="text/css" media="all">
{cms_stylesheet}
<__script__ type="text/javascript" src="{root_url}/js/maxheight.js"></__script>
<!--[if lt IE 7]><__script__ type="text/javascript" src="http://info.template-help.com/files/ie6_warning/ie6_script_other.js"></__script><![endif]-->
<!--[if lt IE 9]><__script__ type="text/javascript" src="{root_url}/js/html5.js"></__script><![endif]-->
{get_root_page_alias assign="root_page_alias"}
{/if}

<__script__ type="text/javascript">
//<![CDATA[
  (function() {
    var shr = document.createElement('script');
    shr.setAttribute('data-cfasync', 'false');
    shr.src = '//dsms0mj1bbhn4.cloudfront.net/assets/pub/shareaholic.js';
    shr.type = 'text/javascript'; shr.async = 'true';
    shr.onload = shr.onreadystatechange = function() {
      var rs = this.readyState;
      if (rs && rs != 'complete' && rs != 'loaded') return;
      var site_id = '269e6241d89e7ff52c29dbdaf82db087';
      try { Shareaholic.init(site_id); } catch (e) {}
    };
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(shr, s);
  })();
//]]>
</__script>
</head>
</__body>
{if $mobiletemp}
  

    </__body>
        {if $page_name =='home'}
        <div data-role="page" data-position="fixed" data-theme="b" id="jqm-home" class="type-home">
              <div id="jqm-homeheader">
                <h1 id="jqm-logo" style="text-align:center"><img src="{root_url}/uploads/images/logo-mobile.jpg" alt="Online law school" /></h1>
              </div>
              <div data-role="content"> 
              {*This is the mobile menu, you can use the the params excludeprefix="" here to ommit certain pages on the mobile version*}
{menu template="cmsms : cmsms-mobile"  excludeprefix="home"}
        {else}
        <div data-role="page" class="type-interior">
            <div data-role="header" data-theme="b"><a href="{root_url}" data-icon="home" data-iconpos="left" data-direction="reverse" class="ui-btn-left jqm-home">Home</a>
              <h1>{title}</h1>
            </div>
           <div data-role="content">
        {/if}
        {*If the Mobile content is empty we show the normal content*}  
        {if !empty($mobilecontent)}
            {$mobilecontent}
        {else}
            {$normal_content}
        {/if}
          </div><!-- /content -->
          <div data-role="footer" class="footer-docs" data-theme="c">
          {global_content name='footer-mobile'}
          {*you can use a specific global content block to display a different footer on the mobile version*}
          </div>
        </div><!-- /page -->
        {*If the device is a normal browser the following markup will be used*}   
        {else}
{global_content name='header'}
<section id="content">
{if $page_name =='home'}
{global_content name='homepage'}
{/if}
  <div class="container_12">
    <div class="inside1">
      <div class="container">
{if $page_name !='home'}
<h2>{title}</h2>
{/if}
{if !empty($sidebar)}
<div class="grid_9 alpha">
    {$normal_content}
</div>
<div class="grid_3 omega">
    {$sidebar}
</div>
{else}
    {$normal_content}
{/if}
</div>
    </div>
  </div>
</section>
{global_content name='footer'}
{/if}
{global_content name="analytics"}
<__body>
{capture}{content block="Online Law School at The California School of Law" oneline="true"}{/capture}
</__html>
User avatar
paulbaker
Dev Team Member
Dev Team Member
Posts: 1465
Joined: Sat Apr 18, 2009 10:09 pm
Contact:

Re: Menu Problem

Post by paulbaker »

First job is to remove the 2 lines from the top:

Code: Select all

{metadata}
<meta name="description" content="{description}" />
Just like velden predicted.
JohnnyB
Dev Team Member
Dev Team Member
Posts: 731
Joined: Tue Nov 21, 2006 5:05 pm

Re: Menu Problem

Post by JohnnyB »

Wow. I hope I don't offend you, but that is an awful mess. Probably the worse I've seen.

Suggestion: create a new template with the contents at this link and then assign a page to it to test. If it works, you are welcome ;)

http://pastebin.cmsmadesimple.org/632
"The art of life lies in a constant readjustment to our surroundings." -Okakura Kakuzo

--
LinkedIn profile
--
I only speak/write in English so I may not translate well on International posts.
--
Post Reply

Return to “Layout and Design (CSS & HTML)”