How Can I Moving Product Headers Above Mobile Images?

Tourist
53 0 1

I've been brainstorming how to optimize our product pages for mobile, and realized that simply moving the product header (title) above the images would work better than serving smaller images for mobile. The problem currently is that the images on the product pages take up the entire screen, pushing the product title and reviews below-the-fold. See here:

 

Mobile Page Un-annotated.png

 

I'm hoping to move the product title, review and separation line (hr class ="custom-hr") above the images on mobile:

 

Mobile Page Example Annotated.jpg

 

Any thoughts on how to do this would be much appreciated!

0 Likes
Shopify Expert
2496 417 525

Hi @CalCook100 

For that you can follow my old post

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes
Tourist
53 0 1

Hi, yes I did use that post to successfully move the prouduct header above the image on mobile but now I'm working on moving the star rating there too: 

 

https://community.shopify.com/c/Shopify-Design/Moving-Product-Star-Rating-Above-Product-Image-on-Mob...

0 Likes
Shopify Expert
2496 417 525

Which app you are using for review? 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes