phpwcms Support Forum

Hello. I just started using phpwcms and am trying to make it completely CSS based (XHTML-Strict). I implemented my own <ul> version of the NAV_COLUMN_TABLE by simply editing the functions a bit and renaming them. NAV_LIST_CURRENT and NAV_LIST_TOP just didn't do it for me.

I hope that someone can use this.

The tag {NAV_LIST_ALL} will be replaced with something like this:

Code: Select all

<ul class="navList"><li class="MenuItem_lvl_1"><a href="index.php?category1">Category1</a></li>
<li class="MenuItem_lvl_1" id="activeSection"><a href="index.php?category2">Category2</a></li>
<li class="MenuItem_lvl_2"><a href="index.php?category2subcategory1">SubCategory1</a></li>
<li class="MenuItem_lvl_1"><a href="index.php?category3">Category3</a></li>
</ul>

where the classes represent the depth level of the menu. you can then edit your CSS to make it look how you want without all the tables.

Modifications:

add this to include/inc_front/front.func.inc.php

Code: Select all

// -------------------------------------------------------------

function css_list_all ($struct, $act_cat_id, $level, $nav_table_struct, $link_to="index.php") {
        // start with home directory for the listing = top nav structure
        // 1. Build the recursive tree for given actual article category ID

        // return the tree starting with given start_id (like breadcrumb)
        // if the $start_id = 0 then this stops because 0 = top level

        $level = intval($level);
        $start_id = $act_cat_id;

        while ($start_id) {
                $data[$start_id] = 1;
                $start_id                = $struct[$start_id]["acat_struct"];
        }
        $temp_tree = (sizeof($data)) ? array_reverse($data, 1) : false;

        foreach($struct as $key => $value) {
                if($struct[$key]["acat_struct"] == $act_cat_id && $key && !$struct[$key]["acat_hidden"]) $c++;
        }
        $c = (!$c) ? 1 : 0;

        //get depth of level
        $level_depth = 0; $start_level = $level;
        while ($start_level) {
                $start_level = $struct[$start_level]["acat_struct"];
                $level_depth++;
        }
        $temp_menu = build_levels_list ($struct, $level, $temp_tree, $act_cat_id, $nav_table_struct, $level_depth, $c, $link_to); //starts at root level
        return ($temp_menu) ? ("\n<ul class=\"navList\">".$temp_menu."</ul>\n") : "";
}


// -------------------------------------------------------------

function build_levels_list ($struct, $level, $temp_tree, $act_cat_id, $nav_table_struct, $count, $div, $link_to) {
        // this returns the level structure based on given arrays
        // it is special for browsing from root levels
        $depth = sizeof($temp_tree)-$div; $count++; $depth2 = $depth-$count+2;

        $temp_menu      = "";
        foreach($struct as $key => $value) {
                if($_SESSION["frontend_user_in"] && $struct[$key]["acat_regonly"]) $struct[$key]["acat_regonly"] = 0;
                if($struct[$key]["acat_struct"] == $level && $key && !$struct[$key]["acat_hidden"] && !$struct[$key]["acat_regonly"]) {

                        $link_image_id  = "linkid".randpassword(6);
                        $link_name_id   = ' name="'.$link_image_id.'" id="'.$link_image_id.'"';
                        $link                   = $link_to."?";
                        $link              .= ($struct[$key]["acat_alias"]) ? html_specialchars($struct[$key]["acat_alias"]) : 'id='.$key.',0,0,1,0,0';


                        if($temp_tree[$key]) {
                                if($act_cat_id == $key) {
                                        $temp_menu .= "<li class=\"MenuItem_lvl_".$count."\" id=\"activeSection\"><a href=\"".$link."\">".html_specialchars($struct[$key]["acat_name"])."</a></li>\n";
                                } else {
                                        $temp_menu .= "<li class=\"MenuItem_lvl_".$count."\"><a href=\"".$link."\">".html_specialchars($struct[$key]["acat_name"])."</a></li>\n";
                                }
                                $temp_menu .= build_levels_list ($struct, $key, $temp_tree, $act_cat_id, $nav_table_struct, $count, $div, $link_to);
                        } else {
                                $temp_menu .= "<li class=\"MenuItem_lvl_".$count."\"><a href=\"".$link."\">".html_specialchars($struct[$key]["acat_name"])."</a></li>\n";
                        }
                }
        }      
        return $temp_menu;
}

and this to include/inc_front/content.func.inc.php

Code: Select all


// -------------------------------------------------------------

// <ul>-list based Navigation table
if( ! ( strpos($content["all"],'{NAV_LIST_ALL')==false ) ) {
        $content["all"] = str_replace('{NAV_LIST_ALL}','{NAV_LIST_ALL:0}',$content["all"]);
        $replace = 'css_list_all($content["struct"],intval($content["cat_id"]),"$1",$template_default["nav_table_struct"]);';
        $content["all"] = preg_replace('/\{NAV_LIST_ALL:(\d+)\}/e', $replace, $content["all"]);
}

David

nice idea...

This is great! Thank you!
But wouldn't it be possible to let the script create nested lists?
Now the script creates

Code: Select all

<ul>
  <li class="level_1">item</li>
  <li class="level_1"  id="activeSection">active item</li>
  <li class="level_2">sub item</li>
  <li class="level_2">sub item</li>
  <li class="level_1">item</li>
  <li class="level_1">item</li>
  <li class="level_1">item</li>
<ul>

It would be really nice to see this:

Code: Select all

<ul id="nav">
  <li>item</li>
  <li id="activeSection">active item
    <ul>
    <li>sub item</li>
    <li>sub item
      <ul>
      <li>sub sub item</li>
      </ul>
    </li>
    </ul>
  </li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
<ul>

Thanx,
B.

If you change the function build_levels_list to the following you will get nested lists like requested. This is how i originally had it. It's just wrapping child lists up in the <ul> tag. (look for the "// Added this:" in the code below)

Hope this helps.

David

Code: Select all

// -------------------------------------------------------------

function build_levels_list ($struct, $level, $temp_tree, $act_cat_id, $nav_table_struct, $count, $div, $link_to) {
        // this returns the level structure based on given arrays
        // it is special for browsing from root levels
        $depth = sizeof($temp_tree)-$div; $count++; $depth2 = $depth-$count+2;

        $temp_menu      = "";
        foreach($struct as $key => $value) {
                if($_SESSION["frontend_user_in"] && $struct[$key]["acat_regonly"]) $struct[$key]["acat_regonly"] = 0;
                if($struct[$key]["acat_struct"] == $level && $key && !$struct[$key]["acat_hidden"] && !$struct[$key]["acat_regonly"]) {

                        $link_image_id  = "linkid".randpassword(6);
                        $link_name_id   = ' name="'.$link_image_id.'" id="'.$link_image_id.'"';
                        $link                   = $link_to."?";
                        $link              .= ($struct[$key]["acat_alias"]) ? html_specialchars($struct[$key]["acat_alias"]) : 'id='.$key.',0,0,1,0,0';


                        if($temp_tree[$key]) {
                                if($act_cat_id == $key) {
                                        $temp_menu .= "<li class=\"MenuItem_lvl_".$count."\" id=\"activeSection\"><a href=\"".$link."\">".html_specialchars($struct[$key]["acat_name"])."</a></li>\n";
                                } else {
                                        $temp_menu .= "<li class=\"MenuItem_lvl_".$count."\"><a href=\"".$link."\">".html_specialchars($struct[$key]["acat_name"])."</a></li>\n";
                                }
                                $temp_menu .= build_levels_list ($struct, $key, $temp_tree, $act_cat_id, $nav_table_struct, $count, $div, $link_to);
                        } else {
                                // Added this:
                                $temp_menu .= "<ul>\n";

                                $temp_menu .= "<li class=\"MenuItem_lvl_".$count."\"><a href=\"".$link."\">".html_specialchars($struct[$key]["acat_name"])."</a></li>\n";

                                // Added this:
                                $temp_menu .= "</ul>\n";
                        }
                }
        }     
        return $temp_menu;
}

Thanks alot! But there's a mistake in your script

This is the corrected version (look for "// If we need nesting:"):

Code: Select all

function build_levels_list ($struct, $level, $temp_tree, $act_cat_id, $nav_table_struct, $count, $div, $link_to) { 
        // this returns the level structure based on given arrays 
        // it is special for browsing from root levels 
        $depth = sizeof($temp_tree)-$div; $count++; $depth2 = $depth-$count+2; 

        $temp_menu      = ""; 
        foreach($struct as $key => $value) { 
                if($_SESSION["frontend_user_in"] && $struct[$key]["acat_regonly"]) $struct[$key]["acat_regonly"] = 0; 
                if($struct[$key]["acat_struct"] == $level && $key && !$struct[$key]["acat_hidden"] && !$struct[$key]["acat_regonly"]) { 

                        $link_image_id  = "linkid".randpassword(6); 
                        $link_name_id   = ' name="'.$link_image_id.'" id="'.$link_image_id.'"'; 
                        $link                   = $link_to."?"; 
                        $link              .= ($struct[$key]["acat_alias"]) ? html_specialchars($struct[$key]["acat_alias"]) : 'id='.$key.',0,0,1,0,0'; 


                        if($temp_tree[$key]) { 
                                if($act_cat_id == $key) { 
										//If we need nesting:
										$temp_menu .= "<li class=\"MenuItem_lvl_".$count."\" id=\"activeSection\"><a href=\"".$link."\">".html_specialchars($struct[$key]["acat_name"])."</a>";
										//no nesting
                                        //$temp_menu .= "<li class=\"MenuItem_lvl_".$count."\" id=\"activeSection\"><a href=\"".$link."\">".html_specialchars($struct[$key]["acat_name"])."</a></li>\n"; 
								} else { 
										
										$temp_menu .= "<li class=\"MenuItem_lvl_".$count."\"><a href=\"".$link."\">".html_specialchars($struct[$key]["acat_name"])."</a></li>\n";
								} 
                                //If we need nesting:
								//check to see if there are any subitems for this item
									if(build_levels_list ($struct, $key, $temp_tree, $act_cat_id, $nav_table_struct, $count, $div, $link_to)!=""){
                                	//subitems: open a new <ul>
									$temp_menu .= "\n<ul>\n"; 								
                                	$temp_menu .= build_levels_list ($struct, $key, $temp_tree, $act_cat_id, $nav_table_struct, $count, $div, $link_to); 
                                	$temp_menu .= "</ul>\n</li>\n";  
									}
									else {
									//no subitems: close the <li>
									$temp_menu .= "</li>\n";  
									}
								// No nesting 
								//$temp_menu .= build_levels_list ($struct, $key, $temp_tree, $act_cat_id, $nav_table_struct, $count, $div, $link_to); 
						} else { 
								$temp_menu .= "<li class=\"MenuItem_lvl_".$count."\"><a href=\"".$link."\">".html_specialchars($struct[$key]["acat_name"])."</a></li>\n"; 
                        } 
                } 
        }      
        return $temp_menu; 
}

Thanks,
B.

Would you post a link where I can see it - please

Oliver

Oliver Georgi wrote:Would you post a link where I can see it - please

The result?

her for example

http://www.magicpages.de/diereiniger/in ... trockeneis

that is a testpage, design isn't ready at the moment

When I try to append the code above to content.func.inc and front.func.inc I get this error:

Parse error: parse error, unexpected T_STRING in /home3/www/graf-rankweil/_md/aquariusrex.com/include/inc_front/front.func.inc.php on line 1932

I do not know how the classes for NAV_LIST_ALL are to be named in the CSS file, so nothing is defined there yet.
Is the Parse error due to this?

I have RC4 22.5. with GT MOD 2.

Please see this CSS link http://www.phpwcms.de/forum/viewtopic.php?t=2150. It's really good. Hope Oliver will make it the menu css-driven in core.

Thanks all,

this is a very nice function. thank you very much!

but I do have a question/problem.

how can I give the second level of the menu another class? I need this because i give my menu a layout without li tags, only css positioning

thanx in advance!

This is great! It opens up a lot of styling possibilities for the menu
just by modifying the CSS.

Is there any way to somehow make this into a tag so that we do not have to hack the wcms code for every releas?

it should be integrated as a standard function imo.

css is the future for styling sites'

hi there David,

Thanks for your CSS Menu script. but i can't seem to get it to work.

Im getting the following error:

Parse error: parse error in /home/gasbedrijf/hetgasbedrijf.nl/html/clienten/cms/include/inc_front/front.func.inc.php on line 2183

Would you be so kind to help me out?

Regards,

Steven

check that the code you've pasted in front.func.inc.php is correct, because a parse error is caused by an incomplete or illegal php syntax

Great tip! I've edited the original post to use <div></div> tags, which are a little more flexible than <ul> tags. I've also added a "title" attribute to each link so that you get what is effectively an "alt" attribute when you hover over each text link.

The following is the edited code that you could paste at the bottom of front.func.inc.php...

Code: Select all

// -------------------------------------------------------------

function css_list_all ($struct, $act_cat_id, $level, $nav_table_struct, $link_to="index.php") {
        // start with home directory for the listing = top nav structure
        // 1. Build the recursive tree for given actual article category ID

        // return the tree starting with given start_id (like breadcrumb)
        // if the $start_id = 0 then this stops because 0 = top level

        $level = intval($level);
        $start_id = $act_cat_id;

        while ($start_id) {
                $data[$start_id] = 1;
                $start_id                = $struct[$start_id]["acat_struct"];
        }
        $temp_tree = (sizeof($data)) ? array_reverse($data, 1) : false;

        foreach($struct as $key => $value) {
                if($struct[$key]["acat_struct"] == $act_cat_id && $key && !$struct[$key]["acat_hidden"]) $c++;
        }
        $c = (!$c) ? 1 : 0;

        //get depth of level
        $level_depth = 0; $start_level = $level;
        while ($start_level) {
                $start_level = $struct[$start_level]["acat_struct"];
                $level_depth++;
        }
        $temp_menu = build_levels_list ($struct, $level, $temp_tree, $act_cat_id, $nav_table_struct, $level_depth, $c, $link_to); //starts at root level
        return ($temp_menu) ? ("\n<div class=\"navList\">".$temp_menu."</div>\n") : "";
}


// -------------------------------------------------------------

function build_levels_list ($struct, $level, $temp_tree, $act_cat_id, $nav_table_struct, $count, $div, $link_to) {
        // this returns the level structure based on given arrays
        // it is special for browsing from root levels
        $depth = sizeof($temp_tree)-$div; $count++; $depth2 = $depth-$count+2;

        $temp_menu      = "";
        foreach($struct as $key => $value) {
                if($_SESSION["frontend_user_in"] && $struct[$key]["acat_regonly"]) $struct[$key]["acat_regonly"] = 0;
                if($struct[$key]["acat_struct"] == $level && $key && !$struct[$key]["acat_hidden"] && !$struct[$key]["acat_regonly"]) {

                        $link_image_id  = "linkid".randpassword(6);
                        $link_name_id   = ' name="'.$link_image_id.'" id="'.$link_image_id.'"';
                        $link                   = $link_to."?";
                        $link              .= ($struct[$key]["acat_alias"]) ? html_specialchars($struct[$key]["acat_alias"]) : 'id='.$key.',0,0,1,0,0';


                        if($temp_tree[$key]) {
                                if($act_cat_id == $key) {
                                        $temp_menu .= "<div class=\"MenuItem_lvl_".$count."\" id=\"activeSection\"><a href=\"".$link."\" title=\"".html_specialchars($struct[$key]["acat_name"])."\">".html_specialchars($struct[$key]["acat_name"])."</a></div>\n";
                                } else {
                                        $temp_menu .= "<div class=\"MenuItem_lvl_".$count."\"><a href=\"".$link."\" title=\"".html_specialchars($struct[$key]["acat_name"])."\">".html_specialchars($struct[$key]["acat_name"])."</a></div>\n";
                                }
                                $temp_menu .= build_levels_list ($struct, $key, $temp_tree, $act_cat_id, $nav_table_struct, $count, $div, $link_to);
                        } else {
                                $temp_menu .= "<div class=\"MenuItem_lvl_".$count."\"><a href=\"".$link."\" title=\"".html_specialchars($struct[$key]["acat_name"])."\">".html_specialchars($struct[$key]["acat_name"])."</a></div>\n";
                        }
                }
        }     
        return $temp_menu;
}

phpwcms Support Forum

CSS/List based version of NAV_TABLE_COLUMN

CSS/List based version of NAV_TABLE_COLUMN

Nested Lists

Hmm, does not work...

Small Error?!