Re: Product description is on the right side only

Product description is on the right side only

HarleyV
Visitor
3 0 0

Hi, I am struggling with the product page description staying on the right side after/below the product images. I want to insert pictures and videos that stay on the left side and the text is on the right if possible. If not, at least I should be distributed evenly at the centre. Is there any way that I can fix this using coding? Here is my store URL: https://whitemist.com.au/

I have tried the below code in the product-template.liquid but the text stays on the left side. Please help. Thank you

Here the code I tried: 

<div class="product-single__description rte" id="first_product_description">
{{ product.description | split: '<!-- split -->' | first }}
</div>
</div>
</div>
{% if product.description contains "<!-- split -->" %}
<div class="product-single__description rte" id="last_product_description">
{{ product.description | split: '<!-- split -->' | last }}

</div>
{% endif %}

Replies 6 (6)

OpenThinking
Shopify Partner
321 81 125

Hi there,
Jack from OpenThinking here!

Can you please provide a link where I can see clearly the problem you're referring to?



️ Get our [Shopify Themes]: Lightning-fast, eye-catching, highly converting, SEO-optimised, Minimal.
Struggling with CODE? You need a Shopify expert to help you with your theme! [Get a free quote]
HarleyV
Visitor
3 0 0

Hi Jack, thanks for the reply. Here is the example page of what I mentioned: https://whitemist.com.au/products/white-mist-shoes-dryer-warmer

It looks perfect on mobile devices but on desktop, the description part is aligned to the right side.

OpenThinking
Shopify Partner
321 81 125

If I'm understanding this correctly you want everything to be in a single column in the middle (just like it's on mobile)?

Like this

screencapture-whitemist-au-products-white-mist-shoes-dryer-warmer-2021-09-25-17_15_51.png

️ Get our [Shopify Themes]: Lightning-fast, eye-catching, highly converting, SEO-optimised, Minimal.
Struggling with CODE? You need a Shopify expert to help you with your theme! [Get a free quote]
HarleyV
Visitor
3 0 0

Hi Jack, yes that’s would be lovely if the description distributes evenly in the center.

OpenThinking
Shopify Partner
321 81 125

Perfect,

Copy & Paste the following code at the very bottom of your assets/theme.css file!

@media only screen and (min-width:750px) {
	.product-template__container { max-width: 600px!important; margin: 0 auto!important; }
	.product-template__container .grid__item { width: 100%!important; }
}

 

let me know if this works for your. If yes; accept my answer and give me thumbs up! Thank you.

 

️ Get our [Shopify Themes]: Lightning-fast, eye-catching, highly converting, SEO-optimised, Minimal.
Struggling with CODE? You need a Shopify expert to help you with your theme! [Get a free quote]
podkingelfbar
Shopify Partner
4 0 0

I have the same problem. If you can please help me fix this as well. 

 

go to any product page on https://www.podkingelfbar.com