I've been looking for a while, and haven't been able to find any existing resources for this issue.
I love the Brooklyn theme, but the images on the product pages are way too big and the column for the description is very narrow. How can I edit these parameters in the code? I'm a coding novice, but I know enough to get by with editing stuff if I have instruction.
Help is much appreciated, thank you!
As a precaution, duplicate your theme first and modify the duplicate as to not destroy your live store. Assuming you're using the latest version of Brooklyn, you can try this. Find the file 'product-template.liquid' in the /sections folder.
<div class="grid product-single"> <div class="grid__item large--seven-twelfths medium--seven-twelfths text-center"> ... A lot of code.... </div> <div class="grid__item product-single__meta--wrapper medium--five-twelfths large--five-twelfths"> ... A lot of code.... </div> </div>
<div class="grid product-single"> <div class="grid__item large--five-twelfths medium--five-twelfths text-center"> ... A lot of code.... </div> <div class="grid__item product-single__meta--wrapper medium--seven-twelfths large--seven-twelfths"> ... A lot of code.... </div> </div>
You'll notice that in all instances, "five" is changed to "seven" and "seven" is changed to "five". These represent the ratio that each column take up (out of twelve). So The image column takes up 5/12 of the width of the grid container instead of 7/12, making it smaller. The same happens for the description column, but it gets larger instead.
"medium" and "large" essentially mean "tablet" and "desktop". This is definitely a simplification as it could possibly create layout problems that would need more fine-tuning, but maybe it will do the trick for you :) But don't forget to duplicate first as this is at your own risk.
I've done this code The problem is that product images look small and the product description looks big Please, I want the solution /https://supportcatlive.com/products/cubic-zirconia-cat-necklace-in-sterling-silver