Horizontal Megamenu

[the-raven]

I was able to get this megamenu to work correctly using an older version of oscommerce (Frozen) which uses Bootstrap 3, but the current version (https://github.com/gburton/Responsive-osCommerce) is using Bootstrap 4 and  seems to be creating problems with the layout because several of the tags are discontinued.  I have tried removing and substituting tags, but I was still unable to get the mega menu to appear correctly on my local site.  Any help would be appreciated. 

Example: tried replacing <li> tags with <div class="nav-item">

<a> to <a class="nav-link" ............>

 

[♥JcMagpie]

post a pic of what you have got so we can what the issue is. Bootstrap 4 will work with Mega menu, you can see an example here

https://bootsnipp.com/snippets/orE6Z

 

<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
  <a class="navbar-brand" href="#">Mega Dropdown</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>

  <div class="collapse navbar-collapse" id="navbarSupportedContent">
    <ul class="navbar-nav mr-auto">
      <li class="nav-item">
        <a class="nav-link" href="#">Category</a>
      </li>
      <li class="nav-item dropdown">
        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
          Category 1
        </a>
        <div class="dropdown-menu" aria-labelledby="navbarDropdown">

          
          <div class="container">
            <div class="row">
              <div class="col-md-4">
                <span class="text-uppercase text-white">Category 1</span>
                <ul class="nav flex-column">
                <li class="nav-item">
                  <a class="nav-link active" href="#">Active</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="#">Link item</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="#">Link item</a>
                </li>

 

Edited January 28, 2019 by JcMagpie

[♥Dan Cole]

Does anyone have this working so the mega menu position is fixed to the top?  For me, the menu itself works, but for reasons I don't yet understand, when I add the  navbar-fixed-top to the css I loose the page scroll function so if the mega menu exceeds the screen height I can no longer scroll down the page....the scroll bar is present but if I remove navbar-fixed-top it allows me to scroll but the menu is not positioned where I would like.

I'm wondering if it is something that is easy to fix or if I'm in for a world of hurt?

Dan

[♥JcMagpie]

I dont use Maga menu but I do have a sticky navbar on my test site. https://chilleddisplays.co.uk

I first did this with css and ran into issues when it would not behave properly never did get tot the bottom of why! I ended up changing the class in the nav bar

to this and it worked as you would expect with no issues.

<nav class="navbar sticky-top <?php echo $navbar_style; ?> cm-navbar">

 

[♥JcMagpie]

Could not get sticky to work 🙄 but made it work with css by adding

#cm_header_megamenu{   position: fixed;
     z-index: 9999;
 }

.yamm .dropdown-menu {
        left: auto;
        max-height:400px;
   overflow:scroll;

so menu is fixed and drop down has scroll. It's on the test site, not sure if this is what you were after.

[♥Dan Cole]

1 hour ago, JcMagpie said:

I dont use Maga menu but I do have a sticky navbar on my test site. https://chilleddisplays.co.uk

I first did this with css and ran into issues when it would not behave properly never did get tot the bottom of why! I ended up changing the class in the nav bar

to this and it worked as you would expect with no issues.

<nav class="navbar sticky-top <?php echo $navbar_style; ?> cm-navbar">

 

I didn't try sticky-top...thanks for the idea, I'll give it a try. 

Playing around with it a bit more I realized that the z-index on nav-fixed-top was hiding the page scroll...it scrolls behind the menu...changing the z-index allowed me to see that.  It looks like it is the menu itself that doesn't scroll using nav-fixed-top, not the page.  I noticed in your second post that you set max-height to 400. Out of curiosity, what happens without that...will the menu still scroll?

Okay I'm off to try sticky top.

Dan

[♥Dan Cole]

Sticky seems to produce a much better result.....it is now close to working as I want.   The only apparently problem at this point is that the sticky mega menu now scrolls off the top when I scroll down page and it reaches the boxes I have installed in the left column.  At that point it looks like the box push the sticky mega menu off the top of the page as I scroll down.  Seems a bit odd but hopefully I'll discover why.

Dan

[♥JcMagpie]

1 hour ago, Dan Cole said:

I noticed in your second post that you set max-height to 400. Out of curiosity, what happens without that...will the menu still scroll?

Oh I did that just to keep all the drop downs a sensable size.  Without is you can have some long and some short depending on whats in them. It will work fine with out that also.

It's strange how when I installed mega menu on the test site Sticky-top did not work? I have it already set for the main Nav bar so It may have somthing to do with Mega menu also using the nav class, so perhaps it needs a new class for the second one?

<nav class="navbar sticky-top nav2<?php echo $navbar_style; ?> cm-navbar">

This example shows it in a bit more detail.

https://www.codeply.com/go/DpHESPqZsx

[♥Dan Cole]

I think the sticky element might be the problem...what I read suggests that...

Quote

Sticky-positioned elements are only sticky within their parent element.

Dan

[freakystreak]

I've stalled this add-on onto a fresh OSC 2.3.4.1CE. All appears in the admin as expected but nothing shows on the front end. I've checked the page source and the HTML for the Mega Menu is there but no categories appear. I have checked the error logs and I'm getting this warning:

count(): Parameter must be an array or an object that implements Countable in includes\classes\category_tree_megamenu.php on line 265

the line in question is:

if (count($category_structure) > 0) {

I'm assuming this is a PHP issue. I'm running this on a local WAMP server which is running 7.2.14. Can anyone help with what the correct code should be?

[LeeFoster]

On 6/13/2019 at 3:45 PM, freakystreak said:

I've stalled this add-on onto a fresh OSC 2.3.4.1CE. All appears in the admin as expected but nothing shows on the front end. I've checked the page source and the HTML for the Mega Menu is there but no categories appear. I have checked the error logs and I'm getting this warning:

count(): Parameter must be an array or an object that implements Countable in includes\classes\category_tree_megamenu.php on line 265

the line in question is:

if (count($category_structure) > 0) {

I'm assuming this is a PHP issue. I'm running this on a local WAMP server which is running 7.2.14. Can anyone help with what the correct code should be?

I'm having the same issue, did you ever fix it?

[Omar_one]

@LeeFoster try to change this line

 

if (count($category_structure) > 0) {

to

if (is_array($category_structure) && count($category_structure) > 0) {

 

[LeeFoster]

8 minutes ago, Omar_one said:

@LeeFoster try to change this line

 

if (count($category_structure) > 0) {

to

if (is_array($category_structure) && count($category_structure) > 0) {

 

I now get -

Warning: sizeof(): Parameter must be an array or an object that implements Countable

[Omar_one]

9 minutes ago, LeeFoster said:

I now get -

Warning: sizeof(): Parameter must be an array or an object that implements Countable

the line no.. or post the line

Edited August 6, 2019 by Omar_one

[♥raiwa]

if (isset($category_structure) && 

Try this

 

[LeeFoster]

20 minutes ago, Omar_one said:

the line no.. or post the line

Warning: sizeof(): Parameter must be an array or an object that implements Countable in \includes\functions\general.phpon line225

[LeeFoster]

2 minutes ago, raiwa said:

if (isset($category_structure) && 

Try this

 

Still the Sizeof() error.

Am I missing something though and the code that leads to $category_structure below refers to 'visibles' and that doesn't appear anywhere in my categories table.

$category_structure_query_raw = "
      show columns 
      from 
        categories
      where 
        field like '%visible%'

 

[LeeFoster]

@kymation Do you have any ideas? I suspect it's an issue with either BS4 or PHP 7.3 but don't know where to start.

[♥kymation]

It's going to be both. You will need to find all of the PHP issues caused by the move to 7.3, then upgrade from BS3 to BS4.

The "%visible%" thing is a test for the presence of one of the hidden category mods. If it is found, the code will hide the categories as required, otherwise it will be ignored. That should not be an issue for you.

Regards

Jim

[LeeFoster]

3 hours ago, kymation said:

It's going to be both. You will need to find all of the PHP issues caused by the move to 7.3, then upgrade from BS3 to BS4.

I thought you might say that. What version of php was it written for?

[♥kymation]

It was written for the 5.x series, but with as many of the 7.x requirements as I knew about at the time. Not all of them, obviously.

Regards

Jim

 

[LeeFoster]

4 minutes ago, kymation said:

It was written for the 5.x series, but with as many of the 7.x requirements as I knew about at the time. Not all of them, obviously.

Regards

Jim

 

Thanks, gives me a starting point at least.

[tomke]

OSCOM CE Phoenix v1.0.2.2

menue version base on megamenu - if someone is able to clear and upload as add-on ?

also change new products to rand products

https://pflanzen-tomke.de/

[cdetdi]

Jim - are there plans to bring this up to Phoenix?  Willing to sponsor the development, let me know.