Adding HTML code for 'star rating' on individual product pages

Site URL: https://www.laviedavi.com/store/the-messier-42-nebula-stud-earrings

Hi all

I am trying to add some code onto my site on each product page that will show a 'star rating'. I have a piece of code from Yotpo that I am currently using on each product page (via additional information and adding a code block in the footer) to allow customers to leave reviews on individual product pages. However, now I am trying to add a star rating widget (also via Yotpo) next to the product title (i've just messily circled the area in the attachment). The code i have from yotpo is " <div class="yotpo bottomLine" data-yotpo-product-id="LVDA0022"> </div> ". I am a newbie to coding unfortunately, so it's probably very far out of my reach, but i was wondering if anyone knows if a) this is possible and b) how i can do it?

What i have tried so far is the 'settings - advance - page header code injection' but of course that just results in the star rating ending up at the top of the page.

Any help will be really appreciated! The page i am using as my first attempt is: https://www.laviedavi.com/store/the-messier-42-nebula-stud-earrings

The SKU is 'LVDA0022'. Please help! I emailed Squarespace but rightfully so they did advise they're unable to assist with any coding that's not from the platform.

Thanks in advance!

Avi 

Do you still need help on this?

I need help on this! I'm trying to do this exact thing and can't figure it out. I have the review widget installed already at the bottom of the page but don't know how to get the stars where I want them. Any advice much appreciated. 

@Brianay Please post the URL to a page where you have the widget. Also describe where you want the widget to end up.

If your site is not public please set up a site-wide password, if you've not already done so. Post the password here.

We can then take a look at your issue.

https://awakenedeveryday.com/shop/hemp-balm

The review widget should be visible at the bottom of the page. Yotpo provides code so you can add their star ratings on the product page, and I would like those to be under the price, if possible. 

@Brianay It looks like you have the full review widget installed. Now you need to add the code for the Yotpo Star Rating bit.

I'm going to talk in generalities as we don't have all the pieces with which to work. With the other bit of code installed it should be possible to use some Javascript to move it up under the price.

Ok! I have pretty much no coding experience whatsoever besides just copying and pasting things. Any idea where I could find the javascript that would move the yotpo star rating where I want it?

Before we can talk about the Javascript to move the star rating I think you need a second piece of code from yotpo which I think you can read more about at < https://support.yotpo.com/en/article/generic-other-platforms-installing-the-yotpo-star-rating >. It is a different piece of code than the one you already have. I think it's function is to give you some stars and a review number count only. In addition if a user clicks on it, it takes you to the part of the page with the big review widget you already have installed.

The code you already have is the big review widget they put at the bottom of a product page. To move all that up under the price would be user unfriendly.

On 10/8/2020 at 8:40 AM, tuanphan said:

Do you still need help on this?

Hi all

Im so sorry for the huge delay on my response, I have only just seen your responses! Yes please I still need help! Thank you!

I would LOVE help with doing exactly this if possible?

I would like to add star ratings under the product name on my site. I collect reviews using Reviews.io 

On 12/29/2020 at 4:03 PM, LaViedAvi said:

Hi all

Im so sorry for the huge delay on my response, I have only just seen your responses! Yes please I still need help! Thank you!

 

use Wiremo, much easier, no need for all these manual ticks.