Archived topic
Mini cart problems on single product page
18 replies · Started by nik9 on October 14, 2020
You seem to have a plugin that changes the DOM structure.
If you inspect your site, you'll find that the whole page content is wrapped inside a <div id="ocs-site"...>
The default DOM structure for this is: Demo Site
<body>
<nav> </nav> <--this is where you normally place the z-index so the cart items goes on top of the sticky add to cart.
.
<-- page contents Example: div#page -->
.
<div id="wc_sticky_cart_panel"></div> <-- this is the sticky add to cary panel.
</body>
As you can see, it's working well because the DOM structure isn't altered.
But your site instead has this structure:
<body>
<div id="ocs-site">
<nav> </nav>
<-- page contents Example: div#page -->
</div>
<div id="wc_sticky_cart_panel"></div> <-- this is the sticky add to cary panel.
</body>
Removing the plugin that causes this <div id="ocs-site"> wrap on page should address the issue.
To add to this:
Perhaps you can try this PHP snippet in hopes of also placing the sticky cart panel inside the page content wrapped by <div id="ocs-site">:
remove_action( 'generate_after_footer', 'generatepress_wc_add_to_cart_helper' );
add_action( 'generate_after_header', 'generatepress_wc_add_to_cart_helper' );
What this snippet does is, it removes the sticky cart panel on the default place it was hooked on (after .site-footer) and then add it back after your header element.
Hi Elvin,
Thanks. This is working. I can't deactivate this plugin because I need this for a second off canvas sidebar. But the snipped work perfectly!! :)
Thanks
I can’t deactivate this plugin because I need this for a second off canvas sidebar.
Yeah that made sense. That's why I suggested we hook the sticky cart panel to generate_after_header on one of my previous replies so you could still continue using the plugin.
Glad it's working for you now.
No problem. :)