Shopify themes, liquid, logos, and UX
Hello guys, I just got started about 2 weeks learning shopify, and i have a question a bout sections and blocks:
Basicly I wanted to crate a simple section where you can further describe a product with images and descriptions
For the schema I did a block with this "settings":[
{
"type": "textarea",
"id": "name",
"label": "Description"
},
{
"type": "image_picker",
"id": "image",
"label": "Photo"
},
{
"type" : "number",
"id" : "position",
"label" : "Picture second"
}]}] My questions is about the last settings I want to use it to change the position of the image in my block it goes like this
{% for block in section.blocks %}
{%- style -%}
.cardImg {
order : {{ block.settings.position }} ;
}
{%- endstyle -%}
{% endfor %}
cardImg refering to : <div class = "cardImg" >
<img class="img" src="{{ block.settings.image | img_url }}"></img>
</div>
The problems is I don't know how to select just the image for a block, when changing the order of the div it changes it for all the blocks.
Solved! Go to the solution
This is an accepted solution.
Hi @Gokurinko , you need to have a specific identifier for each block. Like this:
<div class = "cardImg{{block.id}}" >
<img class="img" src="{{ block.settings.image | img_url }}"></img>
</div>
And change style like this:
.cardImg{{block.id}} {
order : {{ block.settings.position }} ;
}
Hope this helps 🙂
This is an accepted solution.
Hi @Gokurinko , you need to have a specific identifier for each block. Like this:
<div class = "cardImg{{block.id}}" >
<img class="img" src="{{ block.settings.image | img_url }}"></img>
</div>
And change style like this:
.cardImg{{block.id}} {
order : {{ block.settings.position }} ;
}
Hope this helps 🙂
Thanks a lot @MarinaPetrovic it solved the problem.
User | RANK |
---|---|
76 | |
65 | |
64 | |
53 | |
49 |
We're excited to announce improvements to the threaded messaging experience in our communi...
By TyW May 31, 2023Thank you to everyone who participated in our AMA with Klaviyo. It was great to see so man...
By Jacqui May 30, 2023Photo by Marco Verch Sales channels on Shopify are various platforms where you can sell...
By Ollie May 25, 2023