Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Can you link to a page with the issue?
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
If you’re not using a Child Theme, and if the theme doesn’t have a designated section of the dashboard for CSS modifications then install this Custom CSS Manager plugin http://wordpress.org/plugins/custom-css-manager-plugin
Then use its “CSS Code” section of the dashboard to hold your CSS modifications:
Alternatively use your Child Theme style.css file to hold your CSS modifications:
.twentyfourteen .product a:first-child {
min-height: 300px;
display: block;
}
.twentyfourteen .product a {
white-space: normal;
}
Thanks so much for your help that’s great, now that I have entered that code there is a considerable space between the product title / price and the ‘select options’ button, is there any way to maybe make the space a little smaller? Perhaps half the distance?
My only other problem was on the mobile version of the site, when I add something to the cart, the cart page cuts out the whole fifth column of the cart ‘Total’, leaving a portion of the right hand side of the pack blacked out compared to the cart with the white background, the ‘apply coupon’ button is also sticking half out of the white cart space and half into the blank black portion on the right hand side of the page. This problem doesn’t occur on the website when you access it via computer or laptop, just mobile as far as I know. Is there any way around this?
Thanks again for your support it is much appreciated
Now that I have made those changes by entering the code into the CSS manager plugin when I click on a product my ‘gallery images’ for my product under the featured image seem to have a considerable gap underneath them now also has moved my product description around the product page.
Would the code you gave me before have altered the space underneath the gallery images also?
http://www.oceandesignerwear.com/shop/stone-island-button-hooded-shirt/
You see in the above link the product description starts to the right of the featured image but there is now a gap before it continues lower down the page.
Also the ‘Description’ and ‘Additional Information’ tabs further down the page now have a large gap under the text increasing the size of the box.
Thanks again
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Perhaps half the distance?
How will you know that your products won’t have longer titles?
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Try this code instead:
.tax-product_cat .twentyfourteen .product a:first-child {
min-height: 300px;
display: block;
}
.tax-product_cat .twentyfourteen .product a {
white-space: normal;
}
Most of the products won’t have titles that are any longer than the example ones I have up at the moment, but I see your point, it’s not doing any harm. 🙂
I have tried to remove the gallery images for the product to see if it amends the product description splitting up on the page but it has not made any difference.
Do you know how I could tackle this?
Thanks for your continued support
That second code has worked a charm. Thanks so much. It has resolved the problems on the product page.
It is also perfect when I go on a specific brands page and resolved all the previous problems –
http://www.oceandesignerwear.com/product-category/brands/gucci/
The only thing is that when I go on the ‘shop’ page with all the products together the button isn’t aligned on a couple of the products, it kind of looks like it’s gone back to how it was previously, but this is only on the shop page now the categorypages, this is minor compared to my previous problem so I’d like to thank you for your help.
http://www.oceandesignerwear.com/shop/
If there is any way you think I could fix this last small problem then please let me know
Thanks again
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
If you want a smaller gap, try reducing the “300” number here:
...
min-height: 300px;
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Try this code instead:
.post-type-archive-product.tax-product_cat .twentyfourteen .product a:first-child {
min-height: 300px;
display: block;
}
.post-type-archive-product.tax-product_cat .twentyfourteen .product a {
white-space: normal;
}
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Sorry that’s wrong, try this instead:
.tax-product_cat .twentyfourteen .product a:first-child,
.post-type-archive-product .twentyfourteen .product a:first-child {
min-height: 300px;
display: block;
}
.tax-product_cat .twentyfourteen .product a,
.post-type-archive-product .twentyfourteen .product a {
white-space: normal;
}
You’re a star. That last code was perfect. Thank you so much for your help.
Is there any way this last code could be edited to also align the ‘Select Option’ button underneath the products on the ‘product tag’ pages ( http://www.oceandesignerwear.com/product-tag/summer/ ) and also the cart and the checkout?
Thanks
