All Collections
Okendo Reviews
Design Your Reviews Displays
Widget One
Adding a Custom Scroll Target to the Star Rating Summary
Adding a Custom Scroll Target to the Star Rating Summary
Rachael Fulcher avatar
Written by Rachael Fulcher
Updated over a week ago

The default behaviour when a user clicks on a star rating summary element is to scroll the user to the Okendo reviews widget (if one exists on the page). It is possible to change this behaviour by specifying the id of a different target element to scroll to, such as a holder div, tab container or header section.

To change the scroll target, add the following attribute to your star rating summary snippet (usually found in your theme in snippets/okendo-reviews-product-rating-summary.liquid):

data-oke-reviews-scroll-target-id="scroll-target-id-here" 

Replace scroll-target-id-here  with the id of the element you want to scroll to when the star summary is clicked.

Full Example

Star summary snippet:

<div data-oke-reviews-product-listing-rating data-oke-reviews-scroll-target-id="scroll-target-id-here">
{{ product.metafields.okendo.ProductListingSnippet }}
</div>

Scroll target div:

<div id="scroll-target-id-here">
Clicking on the star snippet will scroll the user here
</div>
Did this answer your question?