Ad

Can't Close Div

- 1 answer

So for some kind of reason this small script gives a small error on the frontend (it doesnt give an error in the backend). So below I have stated 3 optioncolors. Alle work fine in the frontend, but if you are on the productpage of the last stated color (in this case Green), the URL given to this div won't close after the div but it will continue on the divs below. So every div below will have that same URL instead of only the div it should be. This error doesnt occur wit the 2 other colors, so only with the last color in the script. Any idea whats going on?

{% if product.title contains "Circle" and product.type == "T-shirts" %}

<a target="_blank" rel="nofollow noreferrer" href="/products/black-circle-t-shirt">
{% if product.title contains "Black" %}<span class="black highlightcolor"></span> 
{% else %}<span class="black"></span></a>{% endif %}  

<a target="_blank" rel="nofollow noreferrer" href="/products/orange-circle-t-shirt">
{% if product.title contains "Orange" %}<span class="orange highlightcolor"></span>
{% else %}<span class="orange"></span></a>{% endif %} 

<a target="_blank" rel="nofollow noreferrer" href="/products/green-circle-t-shirt">
{% if product.title contains "Green" %}<span class="green highlightcolor"></span>
{% else %}<span class="green"></span></a>{% endif %} 

{% endif %}
Ad

Answer

Currently you're opening the <a> tags in all cases, but only closing them inside an else block -- meaning most of the time you'll wind up with mismatched tags.

Move all three of the closing </a> outside the conditional:

<a target="_blank" rel="nofollow noreferrer" href="/products/black-circle-t-shirt">
  {% if product.title contains "Black" %}
    <span class="black highlightcolor"></span> 
  {% else %}
    <span class="black"></span>
  {% endif %}
</a>
Ad
source: stackoverflow.com
Ad