Woocommerce Product Bundles – Grid Layout issue
-
Hi,
I am trying to set up the grid layout in the ‘Product Bundle’ product page.
The grid layout of the items in the product bundle (above the tabs) comes out correctly in Storefront Theme, but not on Woodmart Theme.
Please see screenshot below.
Would you be able to help?
Attachments:
You must be
logged in to view attached files.
Hello,
You can configure the shop page layout in the Theme Settings > Shop page > Product grid. You will find the option to set how many products to show on the page, how many products in the row.
Best Regards
Hi,
This isn’t the Shop Page.
This is a ‘Product Bundle’ Product Page, that is configured to show multiple products as a bundle. The layout for items within the bundle can be set as ‘Grid’, when you edit the product.
Please see this documentation for more info.
For some reason, the Grid layout works in Storefront theme, but doesn’t work in Woodmart theme.
Hope this provides more clarity on the issue.
Hello,
Please provide the valid credentials and correct login URL.
Best Regards
Hello,
Please add this code to the Theme Settings > Custom CSS > Global:
@media (min-width: 768px) {
.bundled_products.columns-3 .product {
width: 33.33333333%;
}
}
.bundle_form .bundle_button {
margin-bottom: 20px;
}
.bundled_product .details {
margin-top: 15px;
}
.bundled_products {
display: flex;
flex-wrap: wrap;
margin-left: -15px;
margin-right: -15px;
}
.bundled_products .product {
padding-left: 15px;
padding-right: 15px;
width: 100%;
}
Best Regards
.
