Archived topic
Product Lay-Out Broken on Niche Template
5 replies · Started by Hendry on August 19, 2020
Hi there,
My product lay-out is broken when i am using niche template.
i also have set product images but it does not appear.
But it works just fine in mobile devices.
What should i do to fix it?
Hi there,
Niche uses a Hook Element to add Stacked Image gallery.
It looks like you disabled that.
Do you want the stacked gallery on desktop? If so re-enable the Hook element.
Then add this PHP snippet to your site:
add_filter( 'generate_hooks_execute_php', '__return_true' );
https://docs.generatepress.com/article/adding-php/
OR If you want the normal carousel as its on mobile then go to Customizer > CSS and delete this:
.woocommerce-product-gallery {
display: none;
}
i have deleted the code you mention above, the images do appear now.
but when i scroll the page down, the lay-out still broken.
Ok - now delete this CSS:
.woo-sumamry-wrap {
display: grid;
grid-template-columns: 60% 40%;
grid-template-rows: auto;
margin-bottom: 80px;
}
.woo-gallery-stack {
grid-column: 1;
grid-row: 1 / 3;
}
.woo-gallery-stack img {
margin-bottom: 20px;
}
.woocommerce-tabs {
grid-column: 1;
}
.woocommerce div.product div.summary {
grid-column: 2;
grid-row: 1;
margin-left: 80px;
position: -webkit-sticky;
position: sticky;
top: 105px;
bottom: 100px;
padding-right: 80px;
}
Okay, it works. Thank you David!
You're welcome