Page Comparison

...

1. On your lefthand navigation panel find Product configuration > Product attributes

2. Select your database from the dropdown

3. + Create new product field

   1. Field name = the star rating named within your feed

   2. Value type = integer

   3. tick Star Rating Field checkbox

   4. You’ll then be asked for a Rating Max Value

      1. Max value field reflects the max value of the rating scale coming from the feed.

         • The max value will be considered 100% to later be shown across 5 stars

         • Different feeds score their ratings in different value ranges eg. of 5, 10, 50, 100 etc. This is how to tell the preezie system what value defines 100% in your feed

Turn on

1. Turn star ratings on and off via high level edit ‘UI Result & Behaviours’On the workflow select Actions > Settings > Edit

2. Navigate to the tab UI Result & behaviours

3. Midway down the page find and select the checkbox Show star ratings

   Image Added

4. Scroll down and click Save.

Style

1. Open Test Guide Widget to style here you can add a:

   1. Filled colour

   2. Empty outline colour

2. Couple things to note

   1. Star Rating positioning sits under product name/above price (please see supporting notes for rationale)

   2. Standardised/same sizing cross all devices

Supporting notes

...

: Kris White, behavioural psychologist;

”Consumer and user research demonstrates a consistent pattern for English readers – from top left to bottom right (See Gutenberg diagram https://vanseodesign.com/web-design/3-design-layouts/ ). Webpages typically create visual hierarchy based on this principle, with the higher order information required to make sense of subsequent information placed at the top.

...