How can I access the schema blocks and Add blocks value in CSS property?

How can I access the schema blocks and Add blocks value in CSS property?

Suzan_n
Shopify Partner
5 0 0
.slider-content {
    text-align: {{ block.settings.text_align }};
}
 
{% schema %}
  {
    "name": "Hero Slider",
    "blocks": [
         {
                "type": "select",
                "id": "text_align",
                "label": "Text alignment",
                "default": "left",
                "options": [
                    {
                        "value": "left",
                        "label": "Left"
                    },
                    {
                        "value": "center",
                        "label": "Center"
                    },
                    {
                        "value": "right",
                        "label": "Right"
                    }
                ]
            }
]
 
I want to access the type select value in CSS property.
 
How Can I do it? I am trying many way but failed.
suzan
Replies 2 (2)

tljafar
Shopify Partner
28 3 8

Block Access 

{% for block in section.blocks %}
  {% if block.type == 'text_align' %}
    {{ block.settings.text_align }}
  {% endif %}
{% endfor %}

 

Block Write in schema

{% schema %}
{
  "name": "Hero Slider",
  "blocks": [
    {
       "name": "Text Align",
       "type": "text_align",
       "settings": [
            {
                "type": "select",
                "id": "text_align",
                "label": "Text alignment",
                "default": "left",
                "options": [
                    {
                        "value": "left",
                        "label": "Left"
                    },
                    {
                        "value": "center",
                        "label": "Center"
                    },
                    {
                        "value": "right",
                        "label": "Right"
                    }
                ]
            }
       ]
     }
   ]
}
{% endschema %}
Shopify Developer
If our answer is helpful then please like and accept as solution! Want to modify or custom changes on Shopify store you can Hire me. Feel free to message me on Shopify | Shopify Design Changes | Custom Modifications In to Shopify Theme
Suzan_n
Shopify Partner
5 0 0

I could understand what you said. But I want to access the text_align id in my CSS property. So, I can change the text-align dynamically. That's my point.

suzan