'How to add custom css to section in shopify

I am trying to add a custom css to my shopify section. I have created a css file in asset folder called test2.css:

.body {
  background-color: lightgrey;
  color: blue;
}

.h1 {
  color: white;
}

And on top of my liquid file I have added this code:

<div class="page-width {{ section.settings.section_css_class }}">

And below in the liquid file:

{

"type": "text",
    "id": "section_css_class",
    "label": {
      "en": "Section CSS Class"
    },
    "default": {
      "en": "Type your own CSS class"
    }
  },

In my section I got this input box:

enter image description here

I have followed this guide:

https://www.ecommercethesis.com/how-to-add-css-class-to-a-section-in-shopify/

But it doesn’t work. What am I doing wrong?

cssshopifyliquid


Solution 1:[1]

To add a custom CSS file to the section in shopify simply just add this at the very top of the section

<link rel="stylesheet" href="{{ 'test2.css' | asset_url }}">

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Adnan

Related Questions