We use cookies to make your experience better. To comply with the new e-Privacy directive, we need to ask for your consent to set the cookies. Learn more.
Select default Options of Configurable product by URL query
Checking recently how we can select default options of configurable product by URL query, we thought that maybe would be useful to share it with you. So here we are!
Firstly checking the configurable.js under
vendor/magento/module-configurable-product/view/frontend/web/js/configurable.js
we can see on line 59 a comment that says
// Override defaults with URL query parameters and/or inputs values
by the function _overrideDefaults. So the next step will be to find the id / value of the option fields and add them to the url. We can easily do that by inspecting the input elements in frontend finding the option id and value to set. Inspecting the div element for the grey colour option on the following product http://demo.magevision.com/hero-hoodie.html we will see the information that we need. The aria-describedby="option-label-color-90" and the option-id ="52", meaning the id for the attribute colour is 90 and the id for the option grey is 52. By adding these values as parameters to the url we will land to the product page with this option preselected. The URL will look like
http://demo.magevision.com/hero-hoodie.html#90=52
Feel free to share this post and ask your questions in the comments below.
Till next time!
Recent Posts
