Skip to content

Magento 2 – Preselect Magento 2 Product Custom Options based on URL Parameters

I’m working on a Magento 2 where I need to preselect product custom options based on URL parameters. Here’s what I want to achieve:

Scenario: I have a product with custom options like Color and Size.

Objective: When users visit a product page with a URL like https://example.com/product.html?color=Red&size=Small, I want the Color option to be preselected as “Red” and the Size option as “Small” automatically.

Implementation: I need guidance on how to:

Retrieve the values from the URL parameters (color and size).
Use JavaScript/jQuery to preselect these options dynamically on page load.
Ensure that the preselected options reflect in the dropdown selects or radio buttons on the Magento 2 product page.