[Resolved] Minicart submenu

[Rene Nekuda]

Hello, I am using Woocommerce Product Add-ons offcial plugin, but in the minicart submenu it looks really ugly. Please, do you have any idea how to NOT show this OR how to change font to smaller size in this submenu?

Screenshot: https://renenekuda.d.pr/fwMXLD

Thank you very much!

René

[David]

Hi there.

would you be able to share a link with the ‘problem’ item in the Cart ? Or provide me a link where i can add one

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Rene Nekuda]

Sure. Put this to the cart with few other items.

[David]

Try this CSS:

#wc-mini-cart ul.woocommerce-mini-cart dl.variation {
    display: none;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Rene Nekuda]

Oh, thank you. It is better. 🙂

And – sorry for this – do you know how to have a smaller product names and how to align the Checkout (“Pokladna”) button?

Screenshot: https://renenekuda.d.pr/dWudHN

[David]

Try this for the font size:

#wc-mini-cart ul li a {
    font-size: 14px;
}

And this to keep the buttons aligned:

.widget_shopping_cart .woocommerce-mini-cart__buttons {
    justify-content: space-between;
}
.woocommerce.widget_shopping_cart .woocommerce-mini-cart__buttons a {
    padding: 8px;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Rene Nekuda]

Amazing – thank you very much! 🙂

[David]

Glad to be of help

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Craig]

I’m having a similar issue with the font size of the mini cart being too big. I tried adding this to my child theme css:

#wc-mini-cart ul li a {
font-size: 14px;
}

But it didn’t make any difference. Any ideas? Here’s my shop page, if you add an item to the cart then hover over the cart icon, you’ll see the issue.

https://www.crazyfamilyadventure.com/shop/

[Leo]

That CSS should work.

Did you make sure to clear the caching plugin after adding it?
https://www.screencast.com/t/KP7fst0gC8z

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Craig]

Yes, I did clear cache, as a wise man once said 😉

Could it be overridden later by another css?

[David]

Hi there,

you have this code in your Child Theme style sheet:

add_action( 'admin_init', function() {
    add_filter( 'generate_google_fonts_array', '__return_empty_array' );
} );

Thats a PHP Snippet and needs to be remove from the CSS as it will break any code that comes after it.

To add that snippet see here:

https://docs.generatepress.com/article/adding-php/

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Craig]

Strange, not sure how that got there. I removed it from the css and cleared cache, but the font is still big in the mini cart.

[Ying]

Hi Craig,

I tested the CSS, once it’s added in it works. The problem is it’s not being added in yet. The only issue I can imagine is cache.

There’re still lots of CSS are generated by caching plugin, could you disable the caching plugin clear cache and try again?

[Craig]

I’ve disabled my cache plugin (WP Rocket) and retested. Issue is still there.

[Author]

Posts