如何删除默认变体选项并具有空单选按钮

Question

我提前道歉，因为我无法获得尽可能少的代码，但我目前正在开发一个 Shopify 网站（我没有构建）并且我不希望有默认变体select编辑。例如，如果您转到此页面 https://thriveworkwear.com/products/carpenter-work-pants-5300-pro，您会看到默认选项是颜色：山核桃色 Waist:30W Inseam:30L。

有没有办法禁用默认变体功能？这意味着没有 selected 变体，用户必须手动 select 它们。

我尝试遵循本指南 https://help.shopify.com/en/themes/customization/products/variants/how-to-add-a-pick-an-option-to-drop-downs 和本指南，但它们没有用。

我也试过添加这个：

document.querySelector('input[name="name0"]:checked').checked = false;
document.querySelector('input[name="name1"]:checked').checked = false;
document.querySelector('input[name="name2"]:checked').checked = false;

到 theme.js 文件，但没有用。如果我通过控制台选项卡添加它似乎有效，但当我在网站上添加它时似乎无效。

感谢任何帮助。

Answer 1

选项似乎是由以下APP生成的：https://apps.shopify.com/best-custom-product-options

这意味着所有内容都是使用 Javascript 生成的，您可能无法控制。

如果应用程序中有禁用默认选择选项的选项，或者应用程序应用选项时有事件可以收听，您将必须显示该应用程序。

最后一行是使用 Mutation Observer 并等待表单中的 HTML 修改来触发您的代码，但如果没有其他方法，这是最后的方法.

如何删除默认变体选项并具有空单选按钮

How to Remove Default Variant Option and Have Empty Radio Buttons

javascript

shopify