0

我的产品有两个选项，例如第一个 options-color ，第二个 options-size 假设颜色 1 有 6 种不同的尺寸，所以第一个选项标题将是 1、1、1、1、1、1，第二个选项（尺寸）标题将是像 1 英寸，2 英寸，3 英寸等在这种情况下，我如何隐藏第一个选项（颜色）下拉选择框并只显示第二个选项（尺寸）下拉框而不是显示第一个选项（颜色）下拉框我想放一些像这样的文字“你的颜色：1”然后只显示第二个选项下拉框（大小选择器下拉）所以最后它看起来像

你的颜色：1 [尺寸选择器下拉框-有六个选项标题]

我知道我可以删除 shopify 管理页面中的第一个选项，但由于某种原因，我不能简单地删除第一个选项，我必须隐藏它们

请任何人...

非常感谢你们提前......

4

1 回答 1

0

我会考虑使用 Javascript 来解决这个问题。

让我们先从显示颜色开始。我认为最简单的方法是在产品模板中创建一个元素并将其最初隐藏：

<p id="color-label" style="display:none">{{ product.variants.first.option1 }}</p>

选择框是在创建 OptionSelectors 时通过 option_selection.js 中的辅助方法生成的：

new Shopify.OptionSelectors("product-select", ...

第一个生成的下拉列表将被分配一个选择元素 id +“-option-0”的 id（在这种情况下是product-select-option-0），第二个将具有选择元素 id +“-option-1”和很快。每个选择都包装在一个 div.selector-wrapper 中。

所以，把它们放在一起......在调用new Shopify.OptionSelectors之后插入类似这样的内容。这假设 jQuery 是可用的。基本上它正在检查颜色下拉菜单是否有 1 个元素，如果有，它会隐藏选择元素并显示颜色：

if (jQuery('#product-select-option-0 option').size() == 1) {
  jQuery('#product-select-option-0').parent('.selector-wrapper').hide();
  jQuery('#color-label').show();
}
于 2012-09-21T22:36:50.510 回答