Hey folks. I’ve added some code to create a customisable option for my product but can’t seem to get the style right (see image attached). Code attached below (in main-product.liquid). Can someone please assist?
Just a few changes and I think you can get what you want with some HTML changes.
You can see the circled changes in the screen shot and the resulting changes in your product page.
For the Name field, if you wanted to add a border to it you could inline it as shown below or you can add a class to one of the css files (like base.css for example) and then add the class to the input.
Also thought I’d suggest maybe just adding another option to these products at least for coating and then it should automatically be included as a drop down option without having to add to the html.
Hey Alyssa! Thanks so much for this. On your screenshot looks perfect, I just can’t seem to get the dropdown right with your changes. Do you mind just taking another look, not sure what I’m doing wrong…
Hi, not a problem!
Looks like I accidentally added and extra “select” class to the top level div in my first example. My mistake! That needs to be removed.