How to change the pop-up message for unselected variant on a product page?

Topic summary

Main issue: A cryptic pop-up error (“expected String to be a id: id”) appears on the product page when no variant is selected. After an app removed the pop-up, clicking “Add to basket” gives no feedback, confusing customers.

Desired behavior: Replace the error with a clear prompt like “Please select a variant,” or have the button show “Make a selection” until a variant is chosen, then switch to “Add to basket.”

Proposed approach:

  • Add a JavaScript check bound to the ATC (Add to cart) button click. If no variant is selected, display a readable message; otherwise proceed with add-to-cart.
  • This requires theme customization; consider referencing code from the previous theme where this worked.

On editing the exact error text: No direct solution provided. Suggestion is to inspect the working theme to see what “id” value it returns and replicate that logic in the new theme. Without code access, specifics can’t be given.

Latest update/status: Another participant asked for an easy solution; none shared yet. No code snippets or final fix posted. Discussion remains open.

Summarized with AI on December 21. AI used: gpt-5.

Hi everyone!

We have this pop up ( ‘expected String to be a id: id’ ) showing on our product page when a variant isn’t selected yet.

One of our apps was able to remove this, however, when ‘Add to basket’ is clicked, there’s no message or anything that tells the customer to select a variant. Which in turn, may make our customers think that there’s something wrong in our website. We have received some concerns about this already.

Would it be possible to change this message into something readable, like ‘Please select a variant’?

Alternatively, on our previous theme, the button when a variant isn’t selected yet says ‘Make a selection’ and when a variant has been selected already, it says ‘Add to basket’. How can we do this on our theme, please?

Thanks in advance to those who’ll response :hugs:

1 Like

Hello @veamrqz ,

You need to use a js function which will trigger on click of the atc button.
On click you have to check if there is a variant selected or not. If not show your message else let the atc to work as it is.btw keep note without customizing the theme it’s not possible to provide code for it just I suggest asking a developer to do it for you. Alternatively as you said in your previous theme it was working so you can take an idea or code from there.

Thanks

Hi @Guleria I just know that our previous theme’s ATC button has that function, but don’t know how to navigate through that. How about the ‘expected string…’, do you know if it’s doable to edit that into a readable text?

Without the access of the code no I don’t know.

btw if you know you just need that id first check in the working theme what it returns in the working theme.

And once you understand it, use the same logic in the new one so the new theme returns the same value.

Hi @veamrqz,

have you found an easy-to-implement solution? We have the same problem.

Many thanks and best regards