Docs

[marcooos]

Hi guys and girls,

After more than 1 item is added to the cart, my cart icon on the navbar looks like this (see attached)

How can I fix it?

[marcooos]

This reply has been marked as private.

[Rue Nel]

Hello There,

Thanks for writing in! This issue is a known bug between UberMenu and the latest X theme. To resolve this issue, please add the following code in your child theme’s functions.php file

// Custom Navbar Cart menu when Ubermenu is active
// =============================================================================
function x_woocommerce_navbar_menu_item( $items, $args ) {

  if ( X_WOOCOMMERCE_IS_ACTIVE && x_get_option( 'x_woocommerce_header_menu_enable' ) == '1' ) {
    if ( $args->theme_location == 'primary' ) {

      if ( ! class_exists( 'UberMenu' ) ) {

        $items .= '<li class="menu-item current-menu-parent x-menu-item x-menu-item-woocommerce">'
                  . '<a href="' . x_get_cart_link() . '" class="x-btn-navbar-woocommerce">'
                    . x_woocommerce_navbar_cart()
                  . '</a>'
                . '</li>';
      } else {
        $items .= '<li class="ubermenu-item ubermenu-item-level-0 menu-item current-menu-parent x-menu-item x-menu-item-woocommerce">'
                  . '<a href="' . x_get_cart_link() . '" class="ubermenu-target x-btn-navbar-woocommerce">'
                    . x_woocommerce_navbar_cart()
                  . '</a>'
                . '</li>';
      }
    }
  }

  return $items;

}
add_filter( 'wp_nav_menu_items', 'x_woocommerce_navbar_menu_item', 9999, 2 );
// =============================================================================

Please let us know if this works out for you.

[marcooos]

That code didn’t seem to do anything.

Ubermenu isn’t a plugin I’ve installed, is it part of another plugin? If not, I don’t have it.

[Christopher]

Hi there,

Please find and remove this CSS code :

.x-navbar-static-active .x-navbar .desktop .x-nav > li.x-menu-item-woocommerce > a, .x-navbar-fixed-top-active .x-navbar .desktop .x-nav > li.x-menu-item-woocommerce > a {
    position: absolute;
    width: 250px;
}

Please add this code :

.x-navbar .desktop .x-nav > li.x-menu-item-woocommerce a {
    letter-spacing: normal;
    padding-top: 0 !important;
}

Hope it helps.

[marcooos]

Hi Christopher, thanks for your reply. That code has made the cart display ON the navbar now instead.. 🙁

[Lely]

Hi Marco,

See attached screenshot of what I am seeing when I check. Did you figure this out already? Please clarify if you’re expecting differently.

[marcooos]

Ok lets start again from the beginning, sorry for the confusion. (I’ve undone the changes advised above.)

Please see image attached for a clear explanation.

[Rad]

Hi there,

Please add this CSS as well,

.masthead-stacked .desktop .x-nav {
    position: relative;
}
.x-navbar .desktop .x-nav > li.x-menu-item-woocommerce {
    margin-left: 0 !important;
    width: 80.5%;
    position: absolute;
    right: -80.5%;
}

And remove this from above CSS,

width: 250px;

Hope this helps.

[marcooos]

Thank you!

[Christopher]

You’re welcome.

[Author]

Posts