Shopify / Liquid - rename the error "Required parameter missing or invalid"

Question

On my shopify site (Debut theme), when a user clicks the add to cart button without choosing a size, it gives this message: "Required parameter missing or invalid: items".

I would like to reword this message to something more friendly, like "Please pick a size".

How would I achieve this? I'm assuming its a liquid issue but not sure if could also be javascript related. Thanks.

Why the size is not selected? It should be selected by default. — Vladimir
I changed it to make size buttons so you have to click a size first. It is not using the default dropdown. Thanks — DevOverflow
Just make the first size (or any other) button to be "selected" by default i.e. mimic the standard behaviour expected by everyone. — Vladimir
I don’t want to take this path, as each time a user goes onto a page it will highlight (e.g.) the Small button, which could get annoying. The error message as it is would be better than this (most people shouldnt see it anyway). I’m just wondering how to change the string that is being displayed when this error message appears. Thanks — DevOverflow

Vladimir Vladimir · Accepted Answer · 2020-05-06T10:48:00

Open the assets/theme.js and search for response.responseJSON.description. It should be withing the _addItemToCart method. Add the following .replace("Required parameter missing or invalid: items", "Please pick a size"). So after this change the whole method should look like the below:

_addItemToCart: function(data) {
  var params = {
    url: '/cart/add.js',
    data: $(data).serialize(),
    dataType: 'json'
  };

  $.post(params)
    .done(
      function(item) {
        this._hideErrorMessage();
        this._setupCartPopup(item);
      }.bind(this)
    )
    .fail(
      function(response) {
        this.$previouslyFocusedElement.focus();
        var errorMessage = response.responseJSON
          ? response.responseJSON.description.replace("Required parameter missing or invalid: items", "Please pick a size")
          : theme.strings.cartError;
        this._showErrorMessage(errorMessage);
        this._handleButtonLoadingState(false);
      }.bind(this)
    );
},

Shopify / Liquid - rename the error "Required parameter missing or invalid"

1 Answers