Categories Menu with multiple subs in the header navbar

[vampirehunter 15]

i can do that, but it requires also to update the bm_categories.box.php, it's layout (my POV), will look slicker.

 

(no bootstrap classes or html inside the category_tree.php gives below result)

 

So is this going to be part of default?

Whats the best way to put this type of navbar into a module?

[vampirehunter 15]

The reason i mentioned is that it would be a good idea we could all work under the same base code.

There only have to be 1 good base, there is simply no need to "extend" or write a new categories system.

you are of course free to do what you want, but it just not a good idea for many reasons.

 

I admit the current category_tree.php class is not 100% correct in building a VALID list structure.

 

However before i wrote this comment i took the time to "repair it"

 

To run a test you could put somewhere in your header the following:

<?php		
			$OSCOM_CategoryBar = new category_tree();
			//$OSCOM_CategoryBar->setCategoryPath($cPath, '<setCategoryPath>', '</setCategoryPath>');
			$OSCOM_CategoryBar->setFollowCategoryPath(false);			
			$OSCOM_CategoryBar->setRootString('<setRootString>', '</setRootString>');
			$OSCOM_CategoryBar->setCategoryPathString('<setCategoryPathString>', '</setCategoryPathString>');			
			$OSCOM_CategoryBar->setSpacerString('  ', 1);
			$OSCOM_CategoryBar->setParentString('<setParentString">', '</setParentString>');
			$OSCOM_CategoryBar->setParentGroupString('<setParentGroupString>', '</setParentGroupString>', false);
			$OSCOM_CategoryBar->setChildString('<setChildString>', '</setChildString>');
			//$OSCOM_CategoryBar->setRootCategoryID('', '');
			//$OSCOM_CategoryBar->getParentID('', '');


			$category_bar = $OSCOM_CategoryBar->getTree();	
?>
<nav id="navbar-example" class="navbar navbar-default navbar-static">
	<div class="container-fluid">
		<ul class="nav navbar-nav">
			<?php echo $category_bar; ?>
		</ul>
	</div>
</nav>

you will go notice the tree is not valid generated as a ul (or ol.... what you want).

 

You could then try the categories_tree.php attached to this post

Now with ONLY css you could generate any menu you like.

Theoretical you could take all css menus that floating around the net.

Some are responsive, some are spiced up with jquery.

But at the end......the base is all the same.

 

You are right. The category tree should be updated as part of the base.

 

@@wHiTeHaT

Yes I have noticed the original category_tree would not generate the correct path for nesting. Therefore I extended my version to make up for it.

 

I would however like to see the repaired category tree added so that we could better work with the output for unlimited types of menus.

 

Perhaps you could submit it as a bug fix?

 

You are correct, it should be fixed.

[burt 2,694]

I have noticed the original category_tree would not generate the correct path for nesting.

 

With the original class, not any of these "fixed" classes, try:

$OSCOM_CategoryTree = new category_tree();
$OSCOM_CategoryTree->setParentGroupString('<ul>', '</ul>', true);
$category_tree = $OSCOM_CategoryTree->getTree();

Let me know the result.  For me that gives a ul > li > ul > ... layout

Edited March 9, 2015 by burt

[Supertex 8]

i still cannot understand why no one uses the category_tree.php build in for this?

 

Where is this in the admin?  I see nothing in 2.3.4 BS Gold for category except in boxes.

[vampirehunter 15]

@@wHiTeHaT

 

Thanks to your insights from yesterday, i did ... but it is not yet fully functional, but getting close.

 

Got the main categories like tabs, got the view all (category) functioning, but need to finish the what's new in category carousel

 

Anyone interested, I'm trying to replicate this example, but listing the main categories in the navigation bar eg Hardware / Software / DVD / Gadgets

http://bootsnipp.com/snippets/featured/mega-menu-with-carousel-for-stores

Hi

did you work out a solution for this, for putting your main categories in the menu in tabs automatically without hard coding?

or is it best to just hardcode?

 

thanks

[♥clustersolutions 94]

I pushed this off during our BS roll out until now. I just finished our sub menu and I ended up extended the original categories tree class to get it done. @vanpirehunter, post your codes and may be I can help when my mind is still fresh...once I'm deep in the next project it'll take me longer...

 

The extended buildBranch should build the tree; however, there will be an issue if you also have products in branch categories. I long defined mine categories to either be a branch note or a leave note and only leave note contain products. To me it just make sense...just imagine...how would the submenu know if you meant to access a branch note, or to open a branch note in the menu otherwise?

[dinopacha 11]

@@Burton

I try your code for the category tree

 

$OSCOM_CategoryTree = new category_tree();

$OSCOM_CategoryTree->setParentGroupString('<ul>', '</ul>', true);

$category_tree = $OSCOM_CategoryTree->getTree();

 

<nav class="navbar navbar-default">

<div class="container-fluid">

<ul class="nav navbar-nav">

<?php echo $category_tree; ?>

</ul>

</div>

</nav>

 

But now I want it to put in the nav as a dropdown, instead of the home button.

 

Can someone help me out with this.

[dinopacha 11]

I figured it out. :P

<?php
$OSCOM_CategoryTree = new category_tree();
$OSCOM_CategoryTree->setParentGroupString('<ul>', '</ul>', true);
$category_tree = $OSCOM_CategoryTree->getTree();
?>

<li class="dropdown">
      <a class="dropdown-toggle" data-toggle="dropdown" href="#"><?php echo(HEADER_CART_ARTIKELEN)?><span class="caret"></span></a>     
    <ul class="dropdown-menu">            
          <?php echo $category_tree;?> 
    </ul>
</li>

define('HEADER_CART_ARTIKELEN', '<i class="fa fa-star"></i> Artikelen');

I only have to fine tune the css but thats easy. (w00t)

Edited October 3, 2015 by dinopacha

[dinopacha 11]

Is it possible to put an image for each category​???

 I think it is nice for the customers when they view the categories.

[♥Dan Cole 374]

@@dinopacha

 

That's an option in admin....select your category in admin, select edit and upload the image.

 

Dan

[dinopacha 11]

@@dan

 

thank you​ for the solution. :) ​ I go try it out.

[dinopacha 11]

@@dan

 

I've tried but he put the image in the bottom category (see the image a bugs life).

 

I would like to have him above, in the category itself​.

 

[♥Dan Cole 374]

@@dinopacha

 

You want it in the category tree?  Won't it be to big or, if you scale it, to small to see?  

 

If you want to do it anyway have a look at the code that puts it on the page currently and see if you can adapt that for your category tree.  

 

Dan

[oth 0]

@dinopacha

thanks for this solution

 

 

 

My shop has just 3 categories and few products.

I want each category as its own dropdown  - and the corresponding products as dropdown items. 

 

so I want 3 horizontal dropdowns named
cat1 cat2 cat3

 

and when I click on e.g. cat1 the dropdown opens with all products inside.

 

can anyone point me in the right direction?

 

How could I do this?

 

thanks for any help 

Edited December 17, 2015 by oth

[dinopacha 11]

@OTC

Then you need the following script from (Tsimi)

Horizontal Categories Menu BS

 

With this you can make a horizontal menu dropdown with 3 categories.

See the link below.

 

http://forums.oscommerce.com/topic/408478-horizontal-categories-menu-bs/

[oth 0]

thank you very much for this 

[Dj-Viper 17]

Hi,

 

Edited the original script of DeDakto to suit my needs a little. Minus reviews, plus home button. is this about the correct edit : in the template around line 12

 

    <div class="collapse navbar-collapse" id="bs-navbar-collapse-1">

      <div class="container">

        <ul class="nav navbar-nav">

          <?php echo $data;?>

          <?php echo '<li><a href="' . tep_href_link(FILENAME_PRODUCTS_NEW) . '">' . HEADER_WHATS_NEW . '</a></li>'; ?>

          <?php echo '<li><a href="' . tep_href_link(FILENAME_SPECIALS) . '">' . HEADER_SPECIALS . '</a></li>'; ?>

          <?php echo '<li><a href="' . tep_href_link(FILENAME_DEFAULT) . '">' . HEADER_HOME . '</a></li>'; ?>

        </ul>

        <ul class="nav navbar-nav navbar-right">

 

Greetings, Anne

[GlenPig 2]

@@vampirehunter

 

 

Yes, I have.

 

Navbar with cat menu.zip

 

No files are overwritten. If your user.css is empty, rename the file for_user.css to user.css, else copy the content to your user.css.

 

I added an option to display the navbar cat menu in full view, collapsed view or both, selectable in admin. Personally I use it only in collapsed view. In full view I prefer the boxed nav menu with gadlols JS.

 

J.J.

 

Hi @@De Dokta

 

I've down loaded and installed your Navbar with Cat Menu and I was just wondering how it could be modified slightly so that instead replacing the top <li> button/dropdown "Catgeories" with a horizontal row of the first level of categories instead?

 

I hope that makes sense?

[deepsonline 0]

This is very slow..Has anyone been successful in optimizing these function?