在節中使用 JavaScript 和樣式表

每個部分都可以包含 JavaScript 和 Stylesheets，這兩種語言用於液體標籤：{% javascript %}{% endjavascript %}＆{% stylesheet %}{% endstylesheet %}。

當將程式碼放在這兩個標籤內時，Shopify 會將每個部分編譯成 shopify_compiled.js 和 shopify_compiled.css。這樣可以在每個部分的程式碼中提供更高的可讀性，因為你不必搜尋長文件來查詢每個部分。

如果你不想使用 CSS，則可以使用 {% stylesheet 'scss' %} 代替使用 SCSS。

但是，使用它們還有一些缺點。液體不能用於任何一種，就像它不能用於沒有 .liquid 擴充套件的普通*.js，*.css，*.scss 檔案一樣。

此外，在使用 SCSS 樣式表標記時，這不是全域性樣式表，因此在主題的 .scss 文件中定義的任何變數都將無法訪問，需要重新定義。

用法示例

JavaScript

{% javascript %}
    $( "p" ).click(function() {
      $( this ).slideUp();
    });
{% endjavascript %}

CSS

{% stylesheet %}
    .container {
        width: 100%;
    }
    .container p {
        color: #ff0000;
    }
{% endstylesheet %}

上海社會科學院

{% stylesheet 'scss' %}
    $red: #ff0000;
    .container {
        width: 100%;
        p {
            color: $red;
        }
    }
{% endstylesheet %}