Product Page Layout Help!!!

Solved
Tourist
4 0 0

I installed a reviews app, and it shows the star rating where the price would usually be, and it moves the price far to the right, ill attach a screenshot. Im sure its an easy fix but i dont have enough experience traversing the homeplace for all the shopify code, i dont know where to look! Someone please help me! Screenshot (1).pngScreenshot (2).png

0 Likes
Astronaut
1081 146 272

Can you post a link to your site and a password if it's password protected? We'll have to inspect your code to see what's going on.

If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes
Tourist
4 0 0

Sure can! Thank you! https://breatheeasymask.com/

0 Likes

Success.

Excursionist
46 8 18

Hi @MalikMJG, Go to your Shopify admin -> Online Store -> themes -> Edit code. Find a file named "product-template.liquid", in that file find a div having class "product__price" and add "row col-md-12 col-sm-12 col-xs-12" classes with it, so it would look like this "row col-md-12 col-sm-12 col-xs-12 product__price"

- Feel free to contact me at waqas4346@gmail.com
- Was my reply helpful? Click Like and Accept as Solution
2 Likes
Excursionist
46 8 18

@MalikMJG, I've just updated my post, if you want to align price on the left side as other elements add another class "row".

- Feel free to contact me at waqas4346@gmail.com
- Was my reply helpful? Click Like and Accept as Solution
0 Likes
Tourist
4 0 0

Thank you! I knew i was on the right track, i even went to google inspect tool xD. Found that exact code just couldnt find it in the shopify directory. What do i do from here? It put the price under the stars but its still a little out of line, can i fix this?

0 Likes
Tourist
4 0 0

Thank you ill try now! is there a way i can move the stars up a bit?

0 Likes

Hello @MalikMJG,

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss.liquid->paste bellow code in bottom of file

.product-single__meta .sum-d-st-wra {
	padding-top: 0;
}
Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
1 Like