Expand Categories Horizontally and Move Below Menu/Navigation

digihub

Hi @vrijvlinder, I have tried to modify the code below as instructed but not working.

Question continue from https://vanillaforums.org/discussion/comment/183184#Comment_183184

@vrijvlinder said:
well the easiest way to do it I think is to use the categories drop down plugin and modify the script part to say display in-line and keep them visible at all times.
You might need to use some css to get it right but it could work.

'< script type="text/javascript" >
var ddmenuitem = 0;
var menustyles = { "visibility":"visible", "display":"in-line", "z-index":"9"}

function Menu_close()
{  if(ddmenuitem) { ddmenuitem.css("visibility", "visible"); } }

function Menu_open()
{  Menu_close();
   ddmenuitem = $(this).find("ul").css(menustyles);
}

jQuery(document).ready(function()
{  $("ul#Menu > li").bind("mouseover", Menu_open);
   $("ul#Menu > li").bind("mouseout", Menu_close);
});

document.onclick = Menu_close;< /script >'

I am trying to expand categories(2 level only) horizontally and move below the menu/navigation. Please see the example page http://funcookie.com/vf20 and here is the code I added. Thanks.

custom.css
#Submenu { float: center; }

default.master.php
<div id="Submenu"> 2 Level Categories </div>

vrijvlinder

You could get the links for those categories and add them into the master after the menu .

digihub

ok thanks

hgtonight

How often do you change your categories? I like @vrijvlinder's suggestion because it nice and straight forward.

digihub

I have several forums using other programs and each has many sub-forums. I like vanilla forum and currently evaluating it for transferring or for other projects, but I need to change some elements to fit my requirements and to maximize the potential. My goal is actually related to my other question "Navigation Menu With Highlight Parent and Child Category When Active https://vanillaforums.org/discussion/23727/navigation-menu-with-highlight-parent-and-child-category-when-active#latest"

Add links into the master is simple but automation is the key for a program like this. Maybe I asked for too much but isn't it the way to improve your community?

hgtonight

You can get the category model and loop through it, spitting out what ever markup you need.

Pseudo code below:

$CategoryModel = new CategoryModel();
$Categories = $CategoryModel->GetFull();
$DepthLists = array();

foreach ($Categories->Result() as $Category) {
  // loop through each category and push it onto the proper depth array
  if ($Category->CategoryID > 0 && $Category->ParentCategoryID > 0) {
    array_push($DepthLists[$Category->Depth], $Category->CategoryID);
  }
}

You'll end up with an array of arrays where the first index is the depth. Roll each one into a ul and you are good to go.

digihub

Thanks @hgtonight