Shopify Dev：如何控制架构中的框阴影颜色？

问题描述

我想通过使用主题定制器来控制 shopify schema 中的框阴影颜色。

这是我的代码：

.test {
  Box-shadow: 0 0 4px 2px rgba({{ section.settings.example_shadow }},0.1);
}

{% schema %}
{
  "name": "Example Shcema","settings": [
    {
      "type": "color","id": "example_shadow","label": "Shadow Color","default": "#000000"
    }
  ]
}

当我提交此代码时，它会向我显示此错误消息：

“默认必须是 CSS 颜色”

这个问题来自于"default": "#000000"

我的问题是如何将默认的十六进制颜色转换为 rgb 颜色？？？

解决方法

您可以使用默认的液体标签 color_to_rgb 将颜色转换为 rgb 颜色， 例如。

{{ '#7ab55c' | color_to_rgb }}

阅读有关滤色器的更多信息 here

,

请使用 color_modify: 'alpha',0.1 我是创建示例而不是回答你。

.test {
  box-shadow: 0 0 4px 2px {{ section.settings.example_shadow | color_modify: 'alpha',0.1 }}
}

{% schema %}
{
  "name": "Example Shcema","settings": [
    {
      "type": "color","id": "example_shadow","label": "Shadow Color","default": "#000000"
    }
  ]
}