Ratings and Reviews dictionary

The Ratings and Reviews dictionary contains labels and messages for the review list, page controls, and review form. These include the Reviews heading, status messages, and star labels for screen readers. Change dictionary values to translate the text or match your storefront’s wording without changing drop-in code.

How to customize

Choose where to maintain the text:

Placeholders sheet: The initializer from the quick start loads placeholders/ratings-reviews.json. Add a row with a key such as Review.title in the Key column and your text in the Value column. See Labels and placeholders.
Initializer code: Pass langDefinitions to initialize with only the keys to change. The drop-in uses your values for those keys and keeps the defaults for the rest.

For code-based customization, update the initializer created in the quick start. This example changes the review heading, author label, and date format:

1
import { initializers } from '@dropins/tools/initializer.js';
2
import { initialize, setEndpoint } from '@dropins/storefront-ratings-reviews/api.js';
3
import { initializeDropin } from './index.js';
4
import { CORE_FETCH_GRAPHQL } from '../commerce.js';
5

6
await initializeDropin(async () => {
7
  // Configure Commerce GraphQL before initialization loads the review settings.
8
  setEndpoint(CORE_FETCH_GRAPHQL);
9

10
  return initializers.mountImmediately(initialize, {
11
    langDefinitions: {
12
      default: {
13
        Review: {
14
          title: 'Customer reviews',
15
          // {{nickname}} is replaced with the reviewer's name.
16
          author: 'Reviewed by {{nickname}}',
17
          // Formats review dates for British English.
18
          dateLocale: 'en-GB',
19
        },
20
      },
21
    },
22
  });
23
})();

Review.title changes the heading to Customer reviews when the Review container has no totalCount value.
Review.author keeps {{nickname}} as a placeholder for the reviewer’s name. Change the surrounding text without changing the placeholder.
Review.dateLocale uses en-GB to format review dates for British English. It does not translate other labels.

For multiple languages, see Dictionaries.

Default keys and values

The drop-in provides these default English (en_US) values:

1
{
2
  "Pagination": {
3
    "label": "Review pagination",
4
    "loading": "Loading review pages...",
5
    "outOfRange": "This review page is no longer available.",
6
    "firstPage": "Return to the first page"
7
  },
8
  "Review": {
9
    "title": "Reviews",
10
    "oneReview": "1 review",
11
    "reviews": "{{count}} reviews",
12
    "author": "By {{nickname}}",
13
    "unrated": "Not rated",
14
    "dateLocale": "en-US",
15
    "loading": "Loading reviews...",
16
    "empty": "No reviews on this page.",
17
    "unavailable": "Reviews are unavailable.",
18
    "error": "Unable to load reviews.",
19
    "retry": "Try again"
20
  },
21
  "StarRatingInput": {
22
    "starLabel": "{{count}} out of {{max}} stars"
23
  },
24
  "WriteReview": {
25
    "loadError": "We couldn't load the review form. Close this window and try again.",
26
    "ratingLabel": "Give your rating",
27
    "ratingRequired": "Select a rating.",
28
    "title": "Title *",
29
    "description": "Description *",
30
    "nickname": "Name *",
31
    "required": "This field is required.",
32
    "submit": "Submit",
33
    "submitting": "Submitting",
34
    "submitErrorHeading": "We couldn't submit your review.",
35
    "submitErrorFallback": "Please try again.",
36
    "ratingUnavailable": "This rating isn't available for this product.",
37
    "successHeading": "Thanks for your review!",
38
    "successDescription": "Your review was submitted and is pending moderation. It will appear once approved.",
39
    "signInHeading": "Sign in to write a review",
40
    "signInDescription": "Only signed-in customers can write reviews.",
41
    "signIn": "Sign in"
42
  },
43
  "Rating": {
44
    "label": "{{rating}} out of 5 stars",
45
    "symbolLabel": "{{rating}} out of 5",
46
    "valueLabel": "{{rating}} out of 5",
47
    "compactCount": "({{count}})",
48
    "zeroReviews": "No reviews",
49
    "oneReview": "1 review",
50
    "reviews": "{{count}} reviews"
51
  }
52
}

Key reference

Each key identifies a value in the dictionary. For example, Review.author refers to the author value in the Review group.

Key	Where it appears
`Review.title`	Review list heading when `totalCount` is not set.
`Review.oneReview`, `Review.reviews`	Review list heading when `totalCount` is set.
`Review.author`	Reviewer name in each row. `{{nickname}}` is the reviewer’s name.
`Review.unrated`	Text for a review that has no rating votes.
`Review.dateLocale`	Language and region used to format review dates, such as `en-US` or `fr-FR`. This value is not displayed as text.
`Review.loading`	Screen reader message while reviews load.
`Review.empty`, `Review.unavailable`, `Review.error`	Status messages for the empty, unavailable, and error states.
`Review.retry`	Button that requests the page again after an error.
`Pagination.label`	Accessible name of the page navigation.
`Pagination.loading`	Screen reader message while the first page loads.
`Pagination.outOfRange`, `Pagination.firstPage`	Message and button when the requested page no longer exists.
`Rating.label`	Screen reader label for the stars in a review row, for example, 4 out of 5 stars.
`StarRatingInput.starLabel`	Screen reader label for each star in the review form, for example, 4 out of 5 stars.
`WriteReview.ratingLabel`	Label for the row of stars when the store has one rating category. With several categories, each row shows its category name.
`WriteReview.title`, `WriteReview.description`, `WriteReview.nickname`	Form field labels. The defaults end with `*` to mark required fields.
`WriteReview.ratingRequired`, `WriteReview.required`	Messages for a missing rating and an empty field.
`WriteReview.submit`, `WriteReview.submitting`	Submit button text before and during submission.
`WriteReview.submitErrorHeading`, `WriteReview.submitErrorFallback`, `WriteReview.ratingUnavailable`	Heading and messages when a submission fails.
`WriteReview.loadError`	Message when the rating categories cannot load.
`WriteReview.successHeading`, `WriteReview.successDescription`	Heading and message after a successful submission.
`WriteReview.signInHeading`, `WriteReview.signInDescription`, `WriteReview.signIn`	Sign-in prompt for signed-out shoppers when guests cannot write reviews.