本文介绍了可定制的按钮、图标和卡片。
哪些是可以定制的？
以下定制可应用于可视化上（仅限这些）：
白色标签
属性是
show-retraced-logo
此属性控制retraced logon的可见性。要隐藏logo，请将其设置为
"false"
在本例中，retraced logo将被隐藏：
<retraced-button-verified show-retraced-logo="false"></retraced-button-verified>
自定义字体
属性是
retraced-elements-font-family
这个属性设置卡片的字体。在本例中，字体设置为
retraced-cards {
--retraced-elements-font-family: "Lucida Grande", "Lucida Sans Unicode", Tahoma, sans-serif;
}
自定义颜色
属性是
color
此属性设置图标的颜色。在本例中，图标的颜色将是红色。
<retraced-icons color="#FF0000"></retraced-icons>
属性是
retraced-cards-text-color
这个属性设置卡片的颜色。在这个例子中，卡片的颜色将是棕色。
retraced-cards {
--retraced-cards-text-color: brown;
}
卡片边框大小
属性是
retraced-cards-border-radius
这个属性设置卡片的边框半径。在这个例子中，半径设置为10px。
retraced-cards {
--retraced-cards-border-radius: 10px;
}retraced-cards是一个自定义的HTML元素，它允许使用自定义属性来设置卡片的样式。
可以在哪里插入这些css变量？
CSS变量（也称为CSS自定义属性）可以在整个项目中全局访问。这意味着可以在链接到HTML的任何CSS文件中定义它们，并且它们将在整个项目中可用。
但最好在中心位置（例如主样式表或全局样式表）定义它们，以保持一致性并避免混淆。这样，就可以在需要时轻松地找到并更新它们。
对于Shopify或WooCommerce等特定平台，可以在下面找到我们的建议。
Shopify
在 retraced.liquid 文件夹添加CSS变量
WooCommerce
在主题的主样式表中添加CSS变量，通常命名为style.css。如果主题有一个自定义CSS选项，也可以用它来添加CSS变量。
请注意，我们不支持开箱即用的WooCommerce集成。我们的自定义集成是一个通用的集成，可以使用它进行集成。