Liquid syntax error when working with Jekyll - Unexpected character

Question

I am using Jekyll with bunch of extensions. The build is working fine but when I call Jekyll serve I get these warnings:

Liquid Warning: Liquid syntax error (line 13): Unexpected character   in "{{forloop.index | minus:1 | modulo:4 }}" in .html
Liquid Warning: Liquid syntax error (line 13): Unexpected character   in "{{forloop.index | minus:1 | modulo:4 }}" in .html

And this is the code for mentioned file,

<section class="pt-6 pt-md-8 pb-8 mb-md-8">
  <div class="container">
  <!-- Example single danger button -->

  <center><h2>Please choose a category to view</h2></center>
  <hr>  
  {% assign color = "#DA5988,#FF5A5F,#0082C9,#6772E5" %}

  <div class="row">
    {% for category in site.categories %}
    {% assign idx = forloop.index | minus:1 | modulo:4 %}
    {% assign curr_color = color | split:',' | slice:idx %}
        <div class="col-4 mt-5">
                <!-- Card -->
                <div class="card card-border shadow-light-lg lift lift-lg" style="border-top-color: {{ curr_color }};">
                  <div class="card-body text-center">
                    <!-- Text -->
                    <h3 class="text-gray-700 mb-5" style="color:{{ curr_color }}">
                        {{ category | first | split:"-" | join:" " | upcase }}
                    </h3>
                    <!-- Link -->
                    <a href="/articles/{{ category | first }}" style="color: {{ curr_color }};">Show More</a>
                  </div>
                </div>

        </div>
      {% endfor %}
  </div>

  </div> <!-- / .container -->
</section>

You can see that on line:13 there is just a white-space, how can I get rid of these warnings?

Answer 1

Maybe consider checking the category names themselves for whitespace to see if that's what's generating the error.