Product description is on the right side only

HarleyV
New Member
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 %}

0 Likes
OpenThinking
Shopify Partner
258 59 75

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]
0 Likes
HarleyV
New Member
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.

0 Likes
OpenThinking
Shopify Partner
258 59 75

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]
0 Likes
HarleyV
New Member
3 0 0

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

0 Likes
OpenThinking
Shopify Partner
258 59 75

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]
0 Likes