Need if statements to change an image based on category.

Solved
Highlighted
Tourist
4 0 0

Here is the current code, it displays either a background image or a background color depending on global settings. What I need it to do is..

 

{if setting. breadcrumb does not = blank and category = category A, display image A}

{else-if setting. breadcrumb does not = blank and category = category B, display image B}

{else-if setting. breadcrumb does not = blank and category = category C, display image C}

{else-if setting. breadcrumb does not = blank display global bg}

{else display bg color}

 

I kind of have a rough idea, but it is a little over my head.

 

Here is the code:

<div class="breadcrumb-container" style="{% if settings.breadcrumb != blank %}background-image: url('{{ settings.breadcrumb | img_url: 'master' }}');{% else %}background-color: {{ settings.breadcrumb_background }};{% endif %}">

 

 

 

 

 

0 Likes

Success.

Shopify Expert
2930 499 671

Hi @SlickWilly 

If you are adding this image on collection page then you have to use condition like this:

{% if settings.breadcrumb != blank %}
    background-image: url('{{ settings.breadcrumb | img_url: 'master' }}');
{% elsif  settings.breadcrumb != blank and collection.title contains category A %}
    background-image: display image A
{% elsif  settings.breadcrumb != blank and collection.title contains category B %}
    background-image: display image B
{% elsif  settings.breadcrumb != blank and collection.title contains category C %}
    background-image: display image C
{% else %}
  background-color: {{ settings.breadcrumb_background }};
{% endif %}
Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
1 Like
Highlighted
Tourist
4 0 0

I was not able to get collection.title to work, but I was able to get it to work using collection.handle. I changed the logic flow so it would work as needed. Thanks so much for steering me in the right direction. 

 

<div class="breadcrumb-container" style="{% if settings.breadcrumb == blank %}background-color: {{ settings.breadcrumb_background }};
{% elsif collection.handle contains 'mens' %}background-image: url({{'mens.png' | asset_url }});
{% elsif collection.handle contains 'womens' %}background-image: url({{'womens.png' | asset_url }});
{% elsif collection.handle contains 'children' %}background-image: url({{'children.png' | asset_url }});
{% else %}background-image: url('{{ settings.breadcrumb | img_url: 'master' }}');
{% endif %}">

 

 

0 Likes
Highlighted
Shopify Expert
2930 499 671

If its collection page then you can get collection title because you can get handle. so also get title, but its ok if all working.  

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
1 Like