Change site Topmenu (& Sub Menus) from TABLE to UL list?

How can I the sites default topmenu from a table format (<table></table>) to an unordered list format (<ul></ul>)?

I find that the table format does't let me design the menu the way I would like and I would have more flexibility if it was an unordered list...

I searched the template files and found that the BxBaseMenu.php is the file responsible for the creation of the site's Top menu and sub menus.

Within that file I search for all table elements (<table><tr><td></td></tr></table>) and replaced with the unordered list elements I would like to use (<ul><li></li></ul>). But when I made those changes they don't reflect on the frontend of the site. I did some more search and noticed that there are also other files that include the Top menu references, but I don't know if they are important in the creation of the Top menu.

I am using a custom template (identical to the base template), so I did make sure to overwrite the files just as boonex suggested. This may be a database related issue, but the "DB cache" option is not active so Im not sure what the problem.

Can someone please tell me how to achieve this? Change the Top menu and sub menus to unordered list format instead of table format?

Thank you.

if you look in BxBaseMenu.php for this:

        $this->sCode .= <<<EOF
<td class="top" {$sActiveStyle} {$sImgTabStyle}>
    <a href="{$sLink}" {$sOnclick} {$sTarget} class="top_link"><span class="down" {$sBoldStyle}>{$sPictureRep}{$sText}</span>
    <!--[if gte IE 7]><!--></a><!--<![endif]-->
    <div style="position:relative;display:block;">{$sMainSubs}</div>
</td>

and change those td tags to li tags, you'll get the list.

However, you should leave this file alone, and change your templates /scripts/BxTmplMenu.php file instead.

EX:

<?php

/***************************************************************************
*                            Dolphin Smart Community Builder
*                              -------------------
*     begin                : Mon Mar 23 2006
*     copyright            : (C) 2007 BoonEx Group
*     website              : http://www.boonex.com
* This file is part of Dolphin - Smart Community Builder
*
* Dolphin is free software; you can redistribute it and/or modify it under
* the terms of the GNU General Public License as published by the
* Free Software Foundation; either version 2 of the
* License, or  any later version.
*
* Dolphin is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY;
* without even the implied warranty of  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
* See the GNU General Public License for more details.
* You should have received a copy of the GNU General Public License along with Dolphin,
* see license.txt file; if not, write to marketing@boonex.com
***************************************************************************/

bx_import('BxBaseMenu');

/**
* @see BxBaseMenu;
*/
class BxTemplMenu extends BxBaseMenu {

    /**
    * Class constructor;
    */
    function BxTemplMenu() {
        parent::BxBaseMenu();
    }
function genTopItem($sText, $sLink, $sTarget, $sOnclick, $bActive, $iItemID, $isBold = false, $sPicture = '') {
       
        $sActiveStyle = ($bActive) ? ' id="tm_active"' : '';

        if (!$bActive) {
            $sOnclick = $sOnclick ? ( ' onclick="' . $sOnclick . '"' ) : '';
            $sTarget  = $sTarget  ? ( ' target="'  . $sTarget  . '"' ) : '';
        }

        $sLink = (strpos($sLink, 'http://') === false && !strlen($sOnclick)) ? $this->sSiteUrl . $sLink : $sLink;

        $sMoreIcon = getTemplateIcon('tm_sitem_down.gif');

        $sSubMenu = $this->getAllSubMenus($iItemID);

        $sBoldStyle = ($isBold) ? 'style="font-weight:bold;"' : '';

        $sImgTabStyle = $sPictureRep = '';
        if ($isBold && $sPicture != '') {
            $sPicturePath = getTemplateIcon($sPicture);
            $sPictureRep = '<img src="' . $sPicturePath . '" />';

            $sText = '';
            $sImgTabStyle = 'style="width:38px;"';
        }

        $sMainSubs = ($sSubMenu=='') ? '' : <<<EOF
    <!--[if lte IE 6]><table id="mmm"><tr><td><![endif]-->
    <ul class="sub main_elements">
        {$sSubMenu}
        <li class="li_last_round">&nbsp;</li>
    </ul>
    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
EOF;

        $this->sCode .= <<<EOF
<li class="top" {$sActiveStyle} {$sImgTabStyle}>
    <a href="{$sLink}" {$sOnclick} {$sTarget} class="top_link"><span class="down" {$sBoldStyle}>{$sPictureRep}{$sText}</span>
    <!--[if gte IE 7]><!--></a><!--<![endif]-->
    <div style="position:relative;display:block;">{$sMainSubs}</div>
</li>
EOF;
    }
function genSearchElement()
{
return;
}
}


// Creating template navigation menu class instance
$oTopMenu = new BxTemplMenu();

?>

And.... if you don't turn of all caching while playing around with this, you'll drive yourself nuts.

Thanks for the help! I'll try this out, it should work.

Thanks again houstonlively!

I know it annoys people to bring old posts back from the dead but this is how the menu should be set up in the first place.

What would be even better - each top level item would be assigned a unique ID (a number).  VERY COMMON nowadays.  And if it's not done automatically, a field in the menu admin for each item would allow us to apply a unique ID.... AND class (that's right).

CSS has become the most standard way of "customizing" one's site (except when functionality changes are required of course) because:

• css is easy to learn;
• it's the easiest to implement (you can completely change your site design with ONE file);
• it's value in customizing your site's design for today's new devices and screen sizes;
• it's the safest (doesn't require changes to php files).

Most of us know this.  Just saying - tables are archaic.

No offence to anyone PLEASE.  

This is the type of functionality that I'm used to working with.  The possibilities are endless.  See especially the last item in the menu.

http://codecanyon.net/item/ubermenu-wordpress-mega-menu-plugin/full_screen_preview/154703

Since the topic has been revised.... There are some CSS menus in the market.  I agree about the ID on the menu item.  I had a need to apply some real time checking on a menu item that would have been very easy if I could have addressed the ID of the item.  While "name" can be used, a unique ID is the preferred way to select items in jquery.

I'm not sure why I didn't even think of looking in the market???

Now I just need to find 4 hours to review them all and pick the one that's going to be the most flexible for all devices and screen sizes.  The one that I just looked at was a complete fail.

Thanks gg.

 RE:

 You can make a Dolphin menu look however you want it to look.  It's not that difficult.

One of Newt's sites: http://tabethajadeashley.com/?skin=NeonGreen

AndrewP's G+ Theme: http://www.demozzz.ru/d71/index.php?skin=gpl

One of the nice things about Dolphin, is that it's easy to override the way many things function by default, and the menu is no different.