自定义 CSS、JS

从主题设置->自定义 CSS、JS

56.webp

此部分可帮助您使用 CSS/JS 代码自定义主题。您可以在此处轻松添加代码，而无需在 liquid 文件部分中搜索代码文件。这将节省您的时间。

1. Bootstrap CSS

当您需要包含Bootstrap 5 CSS时。但这会影响商店的速度。 文档 Bootstrap 5

2. 颜色 CSS

使用颜色自定义 CSS：启用此选项可在自定义颜色部分中自定义变体颜色，您可以点击此链接了解更多信息。

57.png

3.自定义CSS

使用自定义 CSS ：您可以启用此选项，以便它将应用您在自定义 CSS 字段中填写的所有代码。

在此字段中，我们已经拆分为一些响应式设备，例如全局自定义 CSS；仅适用于桌面的自定义 CSS；适用于平板电脑、移动设备的自定义 CSS；仅适用于平板电脑的自定义 CSS；仅适用于移动设备的自定义 CSS 。您可以将代码写入正确的字段。

例如：您想要更改购物车小部件的背景颜色并将其显示在所有设备上，您可以将此代码添加到全局自定义 Css 。

 div#t4s-mini_cart {

 background-color: #dbe0ff;

 color: cornflowerblue;

 }

或者您只想在移动设备上显示它，您可以将该代码添加到仅适用于移动设备的自定义 CSS 。

4. 自定义 JS

您可以启用此选项，以便它将应用您在custom.js文件里填写的所有代码。

56.png

您可以前往编辑代码 > 打开 custom.js文件并在此处编写您的代码 JS。

57.png
,