Product Page

-Charlo-007
Excursionist
25 0 0

Hi,

I'm looking for a way to make my Dawn product page have 3 columns, left with the image, middle with the description and product details, and then the product details purchase button price and quantity box on the right.
Page: https://bit.ly/3IXWZML

Thanks

 

Charlo007_0-1715291109681.png

 

Reply 1 (1)

Arif_Shopidevs
Shopify Partner
133 18 13

hi, @-Charlo-007 
In dawn theme main-product.liquid fine the closing tag of  </product-info>
after that add the div and CSS in your base.css file.

 

.product__info-wrapper_carditem {
    max-width: 40%;
    width: calc(40% - var(--grid-desktop-horizontal-spacing) / 2);
}

<div class="product__info-wrapper_carditem">

  add to card
</div>

 
It will made the card like this. Adjsut your other two div class also for that. 
adjust the CSS from section-main-product.css line 61 your width or other.


Hope it will help you to sovle.

card-thre-column.png

Found it helpful? Please like and mark the solution that helped you.
Slider Revolution - Create sliders, theme sections, banners, videos, pages, advanced animation, and social feeds.
Essential Grid Gallery - Create photo galleries, video galleries, portfolio galleries, product gallery, collection gallery and more.
EasyDisplay: Product Showcase - Easily display collections, related products, discounts, recently viewed items, and best sellers