Hello,
Can someone please tell me how to move the Product name and Price above the Image like shown below. My store URL is Projects817.com and I’m using the Turbo theme.
Thank you!
Topic summary
A Shopify store owner using the Turbo theme wants to reposition the product name and price above the product image on mobile devices only.
Solution Provided:
- A PageFly support representative provided custom CSS code to be added to theme.liquid above the
</head>tag - The code successfully moved elements but caused unintended side effects
Issues Encountered:
- The Afterpay widget and its price moved up along with the main price
- The original price remained at the bottom, creating duplicate display
- Review stars also moved up unexpectedly
- A divider line appeared above the image
Current Status:
- The basic repositioning works on real mobile devices (iPhone 13 tested)
- The store owner is requesting additional code to remove the unwanted divider line above the image
- The Afterpay widget positioning and review stars placement remain as acceptable compromises
Note: Testing should be done on actual mobile devices rather than desktop browser emulators for accurate results.
This is Noah from PageFly - Shopify Page Builder App
Please add this code to your theme.liquid above the to get this solved
Step 1: Online Stores > Themes > More Actions > Edit code
Step 2: click on theme.liquid and paste the code above the
Note: this code will only run on mobile, so it’s better to check it with real mobile
Hope this can help you solve the issue
Best regards,
Noah | PageFly
Hello,
I inserted the code, however nothing is changing. Is it possible for you to check?
thank you!
Hello @Only1mrsfragili
May i know which device you use to check? real mobile or mobile emulator on desktop browser?
Because i checked on my mobile and it’s working fine here:
Hi @Only1mrsfragili The afterpay widget is automatically inserted below the price of the product, should i hide it?
I checked in my Iphone13 and now it’s working but it’s display wrong. After pay moved up with its price and the price is still at the bottom as well and it shouldn’t look like that. Also the review star moved up as well. Which I don’t really mind but if it could display on the other side it would be better.
I don’t want to hide it so I guess I can just move the title and the review stars up please and thank you.
Okay, i can see that you managed to do it
Glad that i can help
1 Like
Thank you very much, I do have one question however. Can you please give me the code to get rid of the divider line above the image? I think it would like better without it.