The Divi theme can do just about anything for you, including e-commerce. It has built in support for WooCommerce so you can get a nice stylish web store up and running in no time.

If you install WooCommerce then a small shopping cart icon is automatically added to your main menu. I personally had a small bug with a fixed navigation bar at the top: when you scroll down on the page and the menu bar gets squeezed, then the cart icon is not properly aligned any more. (You can see the example in the header image of this post.) The fix is easy…

Fixing the WooCommerce shopping cart icon in the fixed navigation bar

When you scroll down the page then the fixed navigation bar at the top gets squeezed (unless you did some modifications already). Basically after scrolling the <header> takes up a new css class, .et-fixed-header, which makes the fix easy.

Just add the below lines to your themes style.css file or add it in the Appearance > Divi Theme options > General > Custom CSS box:

.et-fixed-header #et-top-navigation .et-cart-info {
    margin-top: 5px;

That should fix the problem.

Did this help you? Then please like and share this post with others, it might help them too.



If you liked this post ...

... then share it with your friends!