设置Shopify购买按钮的变体选择器的样式

时间:2018-08-21 19:13:25

标签: css shopify

我正在与Shopify购买按钮一起使用,并希望将自定义样式添加到页面上的变体选择器。是否有可能做到这一点?我的按钮和价格样式工作正常,但我希望能够对下拉菜单进行样式设置。将“变体”或“选项”添加到样式节点不会执行任何操作。

var buttonStyles2 = {
    'width':'70%',
    'color' : 'black',
    'background-color':'rgba(255, 255, 255, 1)',
    ':hover': {
        'background-color': 'rgba(196, 137, 0, 1)'
    },
    ':focus': {
        'background-color': 'rgba(196, 137, 0, 1)'
    }
}
var priceStyles = {
    'color' : 'white',
    'border-bottom' : '1px solid white',
    'width' : '100%',
    'font-size' : '30px',
    'text-align' : 'left !important',
    'padding' : '10px',
}

ui.createComponent('product', {
    id: productId,
    node: node,
    options:{
        product:{
            contents:{
                img:false,
                title:false,
                price:true,
                options:true,
                //quantity:true,
                // quantityIncrement: true,
                // quantityDecrement: true,
            },
            text:{
                button: "Add To Cart"
            },
            styles:{
                button: buttonStyles2,
                price: priceStyles,
            }
        }
    }
});

enter image description here

0 个答案:

没有答案