Display Multiple Categories

[Woodsy]

Hi

I am working on a custom module for a resource centre. I have added a text field that adds a category to the resource listing card and also adds it to the filter dropdown. I have got a single category to display in the card and filter list.

I have set the module text field up as a repeater in case a resource has more than 1 category. Unfortunatly it is just adding the 2nd category as a continuation to the first (see screenshot):

I am trying to get the second category to display in a separate orange box in the resource card. If the categories are seperated so that they are not tide together the logic might update the filter list as it will see the categories as indepentent from each other.

This code adds the category to the filter dropdown:

{% if module.style.filters.add_category_filter %}
          <div class="filter_second_varient">
            <h4 class="cateogry_label_second_varient labels" id="category_label">{{ module.other_text.category_label }}</h4>
            <div class="checkboxes_outer" id="category_filter_data">
              {% set uniqueCategories_second_varient = [] %}
              {% for item_second_varient in module.contents %}
              {% if item_second_varient.category not in uniqueCategories_second_varient %}
              {% set _ = uniqueCategories_second_varient.append(item_second_varient.category) %}
              <div class="form-check">
                <input class="form-check-input" type="checkbox" name="category_second_varient" value="{{ item_second_varient.category }}" id="category_{{ item_second_varient.category }}">
                <label class="form-check-label" for="category_{{ item_second_varient.category }}">{{ item_second_varient.category }}</label>
              </div>
              {% endif %}
              {% endfor %}
            </div>
          </div>
          {% endif %}

This code displays the orange category tag in the resouce card:

{% if module.style.contents.category.show_category_type == 'category' %}
<div class="first_second_varient">
<span class="tag_second_varient category_second_varient">{{ item_second_varient.category }}</span>
</div>
{% endif %}

Also is there a way to remove the brackets from each category?

Any guidance is appreciated
Thanks

[Jaycee_Lewis]

Hey, @Woodsy 👋 I moved this over to the dev side of things. Hopefully we can get you more targeted views there. — Jaycee