Jump to content
De Dokta

Categories Menu with multiple subs in the header navbar

Recommended Posts

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?

Share this post


Link to post
Share on other sites

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.

Share this post


Link to post
Share on other sites

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 by burt

This is a signature that appears on all my posts.  
IF YOU MAKE A POST REQUESTING HELP...please state the exact version
of osCommerce that you are using. THANKS

 
Get the latest Responsive osCommerce CE (community edition) here

Share this post


Link to post
Share on other sites

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.

Share this post


Link to post
Share on other sites

@@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

Share this post


Link to post
Share on other sites

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?

Share this post


Link to post
Share on other sites

@@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.

Share this post


Link to post
Share on other sites

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 by dinopacha

Share this post


Link to post
Share on other sites

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

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

Share this post


Link to post
Share on other sites

@@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​.

 

post-336856-0-78479200-1443892952_thumb.jpg

Share this post


Link to post
Share on other sites

@@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

Share this post


Link to post
Share on other sites

@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 by oth

Share this post


Link to post
Share on other sites

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

Share this post


Link to post
Share on other sites

@@vampirehunter

 

 

Yes, I have.

 

attachicon.gifNavbar 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?

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×