For discussing the development and usage of Checkout UI extensions, post-purchase extensions, web pixels, Customer Accounts UI extensions, and POS UI extensions
Hi, i am trying to add some liquid code in a css file, but it seems to always be empty when its rendered.
I have a section with the following schema:
{% schema %}
{
"settings": [
{
"type": "number",
"id": "margin_top",
},
{
"type": "number",
"id": "margin_bottom",
}
],
"presets": [
{
"category": "Custom",
"settings": {
"margin_top": 30,
"margin_bottom": 30
}
}
]
}
{% endschema %}
Then i have created a file under `Assets/my-style.css.liquid`:
.my-wrapper {
position: relative;
margin-top: {{ settings.margin_top }} px;
margin-bottom: {{ settings.margin_bottom }} px;
}
And i am importing the css in liquid file:
{{ 'my-style.css' | asset_url | stylesheet_tag }}
But when its being rendered its always as :
.my-wrapper {
position: relative;
margin-top: px;
margin-bottom: px;
}
So, it cant find the settings from the liquid file. Is it any way to solve it?
You must add code to a liquid file, for example like the image below
- Helpful? Like and Accept solution! Support me! Buy me coffee
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Ryviu: Aliexpress Reviews - AliExpress Reviews Importer, one-click import aliexpress reviews, export reviews to CSV file.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.
Yeah, i understand that. I was looking on whether its possible to have liquid code in a `.css` file.