添加自定义解决方案以购物定制面板？

Question

客户要求我在添加到购物车按钮上做悬停效果，但只有单一产品，我已经设法通过CSS来做到这一点，但现在他指示我，他希望在自定义面板内实现该解决方案，以便他可以更改该产品自己的颜色。

任何帮助，将不胜感激，因为我甚至不知道从哪里开始，或者应该看起来如何。

首先，我想知道这是可能的天气吗？

Answer 1

你在找什么是“主题设置”的信息。 Shopify有时是指以此为Storefront Editor

的指南是在这里：http://www.tetchi.ca/shopify-theme-from-scratch-part-14/

你不得不了解一些这一点，并尝试一些以前的事情，我们可以为更进一步帮助

Answer 2

找到如何根据你的教程链接添加这个解决方案，现在我看到它看起来很简单......但是如果有人遇到类似的问题。

我与以下3个步骤来实现这一点：

1：首先将唯一ID基于产品页面上的每个按钮时，在文件被生成每个产品页：

id="atc_single_product-{{ product.id }}" 

2：对于自定义面板中产生的选择，加入以下内部配置文件 “settings_schema.json”：

{ 
    "type": "color", 
    "id": "atc_single_product-7214350529", 
    "label": "Montreal #9", 
    "default": "#333333" 
    }, 

增加了悬停效果一些基本的HTML，将呼吁采取行动，并结合双方的步骤1和2以及曾经徘徊：

#atc_single_product-7214350529:hover, input#atc_single_product-7214350529[type="submit"]:hover, input#atc_single_product-7214350529[type="button"]:hover 
    { 
     background: {{ settings.atc_single_product-7214350529 }}; 
     border-color: {{ settings.atc_single_product-7214350529 }}; 
     outline: none; 
    } 

最终结果是：http://i.stack.imgur.com/M2RiG.png

也许它看起来并不漂亮，但它嘿它的作品。谢谢！