Introduction
By default, Tydal's star ratings appear below the product title, while the reviews widget is positioned directly under the product information section. This article provides guides on adjusting the placement of the stars or reviews widget on your product pages using the Shopify theme editor and the app’s product page custom selectors.
Using the Shopify Theme Editor
The following steps apply to Online Store 2.0 compatible themes.
Open your Online Store 2.0 theme editor in Shopify (Online Store > Themes > Customize)
Navigate to the product template that you'd like to change
In the sidebar menu, click Add block, and under Apps select Tydal Review Stars.
For the widget, click Add section or Add block, and under Apps select Tydal Review Widget
Drag and drop the stars or the widget in the order you'd like them to display on your page
Click the Save button.
Using the App's Product Page Custom Selectors
These steps on the other hand is for vintage themes which uses custom selectors to choose the DOM elements to place in your HTML.
From the app’s Dashboard, navigate to the Onsite tab
Scroll down to the Advanced Settings section then click Custom CSS and selectors
Under the Product Stars Custom Selector section, enter the DOM element to set the placement of star ratings. For the reviews widget, use the Reviews Panel Custom Selector section. The specified element ID will serve as the anchor point and the app’s element will appear right after it.
Apply changes by clicking the Save button.
Reach out to our live chat support if you have any other questions, or share any ideas with us here!