Site logo

Archived topic

Suggestion - WooCommerce cart menu icon location

15 replies · Started by Simon on January 4, 2018

Viewing posts 1–15 of 16

Hi,

I have a suggested change/improvement for you:

In Customizer -> Layout -> WooCommerce -> General the cart menu option could have a primary/secondary menu choice.

I have implemented it in my installation as follows:

Insert this code at line 81 of \generatepress_pro\woocommerce\functions\customizer\customizer.php


$wp_customize->add_setting(
  'generate_woocommerce_settings[cart_menu_item_sec]',
  array(
    'default' => $defaults['cart_menu_item_sec'],
    'type' => 'option',
    'sanitize_callback' => 'generate_premium_sanitize_checkbox'
  )
);

$wp_customize->add_control(
  'generate_woocommerce_settings[cart_menu_item_sec]',
  array(
    'type' => 'checkbox',
    'label' => __( 'Use secondary menu for cart icon', 'generate-woocommerce' ),
    'section' => 'generate_woocommerce_layout',
    'settings' => 'generate_woocommerce_settings[cart_menu_item_sec]',
  )
);

And change line 307 of \generatepress_pro\woocommerce\functions\functions.php to:


if ( $args->theme_location == apply_filters( 'generate_woocommerce_menu_item_location', generatepress_wc_get_setting( 'cart_menu_item_sec' ) ? 'secondary' : 'primary' ) && generatepress_wc_get_setting( 'cart_menu_item' ) ) {

Also, maybe a small typo: line 306 of the same file says:
// If our primary menu is set, add the search icon

Surely it should say:
// If our primary menu is set, add the cart icon

Simon

Yea, this is an option we plan on adding.

Instead of altering that core code, you can just do this:

add_filter( 'generate_woocommerce_menu_item_location', 'tu_move_menu_cart_item' );
function tu_move_menu_cart_item() {
    return 'secondary';
}

Thanks!

Hi, Tom!
Quick question: is there a way to have the shop cart on BOTH the main and the secondary navigation?

I have set up the secondary navigation only on shop pages (with the main navigation hidden), while having the main navigation on all other pages of the site (with the secondary nav hidden). So no matter where a user is on the site, I want him to see the shopping cart.

Sample product page with the secondary navigation: https://alex.bandiwork.dev/product/tote-bag-test
Homepage as sample for the main navigation: https://alex.bandiwork.dev

I have implemented the solution above, so the shopping cart now shows up in the secondary navigation, and you will have to add the product to cart in order to see the cart in the nav bar.

Also, now that I added the shopping cart in the secondary nav, the hamburger icon is not quite centered on tablet and mobile. Can you please help me fix that?

Thank you so much!

Hi there,

You can try adding it back to the primary navigation like this:

add_action( 'wp', function() {
    add_action( 'generate_menu_bar_items', 'generate_wc_do_cart_menu_item', 5 );
} );

I'm not 100% sure there won't be any issues doing this, but it should work.

As for the menu toggle, try this:

.secondary-navigation .menu-toggle {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

Thank you so much, Tom!
I got the CSS for the toggle to work, but adding the shopping cart to the primary navigation too didn't work. I added the snippet to my functions.php, but it does nothing. The cart still shows up only in the secondary nav :(

Hmm, can you try the adjusted code above?

Let me know :)

Oh, thank you so much, Tom!
I did try it, but still nothing, unfortunately :(

Hi there,

try this PHP Snippet:

add_filter( 'generate_woocommerce_menu_item_location', 'tu_move_menu_cart_item' );
function tu_move_menu_cart_item() {
    if ( !is_woocommerce() ) {
        return 'primary';
    }
    return 'secondary';
}

What it should do is move the cart to the secondary nav if the page is woocommerce.

OMG! This worked!!! :D
Thank you so much!!! (doing the happy dance)

Awesome - glad we could be of help.

Hey guys!
I'm back on this because I've just discovered that I have a problem on my cart and checkout pages.
The shopping cart does not show up on the secondary navigation there, and the logo is not aligned left, as is on all other shop pages, but aligned center on top of the toggle.

Everything else works perfectly with the secondary navigation on all other shop pages (shopping cart shows up and everything). Is there a way to fix this?

Thank you so much!

Can you link us to the page in question?

Feel free to start a new topic if you need to use the private info field.

Hi, Leo!

Sure, so this is the whole story:

I need to have the shop cart on BOTH the main and the secondary navigation.

I have set up the secondary navigation only on shop pages (with the main navigation hidden), while having the main navigation on all other pages of the site (with the secondary nav hidden). So no matter where a user is on the site, I want him to see the shopping cart.

Sample product page with the secondary navigation: https://alex.bandiwork.dev/product/tote-bag-test
Homepage as sample for the main navigation: https://alex.bandiwork.dev

I have implemented the PHP snippet David gave me above, and it works fine (shopping cart shows up on both navs) except for the Cart and Checkout pages, where the shopping cart doesn't show (will have to add the product to cart in order to see the cart in the nav bar on all other pages).

Also, on mobile the logo gets thrown on top of the toggle on these two pages where the cart is missing.

What can I do?
Thank you so much!

Hi Alexandra,

my bad - Cart and Checkout pages are standard pages so they are not included in the is_woocommerce() template tag. Update your PHP snippet to this to include them:

add_filter( 'generate_woocommerce_menu_item_location', 'tu_move_menu_cart_item' );
function tu_move_menu_cart_item() {
    if ( !is_woocommerce() || !is_cart() || !is_checkout() ) {
        return 'primary';
    }
    return 'secondary';
}

Hey David! No problem! :)
Thank you so much! I tried the new PHP snippet, but it didn't work (it actually hid the cart from product pages), but I did get it to work by changing it to this:

add_filter( 'generate_woocommerce_menu_item_location', 'tu_move_menu_cart_item' );
function tu_move_menu_cart_item() {
    if ( is_woocommerce() || is_cart() || is_checkout() ) {
        return 'secondary';
    }
    return 'primary';
}

This solved my problem! :D :D Now I have the shopping cart across the site, in both my primary and secondary nav bars, and cart & checkout pages too :D Hope this helps others too.

This archived topic is closed to new replies.