Narrative theme: How to move the product content to the right?

[Tungsteno]

Hi there!

I’m using the Narrative theme and need to move the product content: Title, size option, color option, product description, etc. to the right on the desktop view. Currently, everything is below the product image and really, it’s not that UX friendly.

HOW IT IS

HOW IT NEEDS TO BE (Or something like it)


This is a low quality Photoshop

Dear community, is there a workaround for this?

Thanks!

[suyash1]

@Tungsteno - can you please share this page link? need to check it on browser

[Tungsteno]

Right! I forgot to share the URL: https://wearhorse.pe/products/polo-pique-navy-contraste

Thanks!

[suyash1]

@Tungsteno - it can be made like the screenshot, it you want like this then please add given css to the very end of your theme.scss.css file, this will not change mobile view

@media screen and (min-width:750px){

.template-product .product-template{display: flex; flex-wrap: wrap;}

.product-template__media{flex-basis: 50%;}

.product__content{flex-basis: 50%;}

}

[Tungsteno]

Hey! Thank you so much! It worked!

I also found this solution: https://medium.com/@pherkan/customize-the-product-page-of-the-narrative-theme-in-shopify-1c617cf7f76b

Is most likely as your solution?

[suyash1]

it is entire tutorial for page, I used only css

[Tungsteno]

Thanks!