Unable to compare string after splitting the text

Shopify Discussion

Topic summary

A developer is troubleshooting a Shopify Liquid code issue involving string comparison after splitting text.

The Problem:

  • Attempting to split and compare values from settings.other_colors_name with product option values
  • Using newline_to_br and split functions to process the text
  • Comparison logic isn’t working despite trying multiple approaches

Code Context:

  • Iterating through product options to find “Kleur” (Color)
  • Splitting settings text by line breaks (<br />)
  • Further splitting by hyphens (-)
  • Trying to match split values against option values to display color circles

Current Status:
A community member responded asking for clarification on which specific part needs splitting and where the comparison is failing, suggesting that breaking down the problem into smaller parts would help identify the solution. The issue remains unresolved pending more details from the original poster.

Summarized with AI on November 22. AI used: claude-sonnet-4-5-20250929.
1

Can anyone please help me what I am missing? because I have tried every possibility to compare the values but didn’t find any.

{%- for option in card_product.options_with_values -%}
          
              {% if option.name == "Kleur" %}
                <div class="circles">

                {% assign title_words = settings.other_colors_name | newline_to_br %}

                {% assign title_words = title_words | split: "<br />" %}
        
                {%- for value in option.values -%}
                  
                  {% if forloop.first %}

                    {% for word in title_words -%}
                      
                      {% assign title_word = word | split: "-" %}
                
                      {% if title_word[0] == value  %} 
                        <div class="circle" style="background-color: {{ title_word.last }} "></div>
                      {% endif %}
                        
                    {%- endfor %}
                    
                  {% else %}
                    
                    {% assign transalteValue = forloop.index | times: 10  %}
                    <div class="circle" style="background-color: {{ value | remove: " " }}; transform: translateX(-{{ transalteValue }}px); z-index: 2;"></div>
                    
                  {% endif %}
                  
                {%- endfor -%}
                </div>
              {% endif %}

          {%- endfor -%}

Thanks

2

Hi,
Can you please explain which thing you want to split and the part that is working ?
If you divide problem in parts, it will be easy to solve it
Thanks!