1つのブログ内でタグ別に記事を出し分けたい

[yuhki]

1ブログテンプレートのなかで、mediaというハンドル名のブログ内のタグ1とタグ2のブログ記事を5つずつ出力したいと思っております。

以下のようなlimitを付けて5つずつ、タグ1とタグ2の記事をそれぞれ表示させようとしたときにfor文で分けているにも関わらず、タグ1とタグ2あわせて5つのブログ記事を出力されてしまいます。

様々な方法を試してみたのですが、どうしてもこちら思ったように出力されません。

お手すきでご教授いただけますと幸いです。

									<div class="inner">

										{% for article in blogs['media'].articles limit: 5 %}
											{% for tag1 in article.tags  %}
												{% if tag1 == 'タグ1' %}
										<a class="item" href="{{ article.url }}" data-animate>
											<div class="topicsImage">
												<img class="card__image lazyload fade-in" data-src="{{ article.image | img_url: 'master' }}"
												data-widths="[180, 220, 300, 360, 460, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
												data-aspectratio="1.6"
												data-sizes="auto"
												loading="lazy"
												alt="{{image.alt}}">
											</div>
											<div class="topicsTitle">
												<div class="tpYmd">{{ article.created_at | date: '%Y年 %-m月 %d日' }}</div>
												<div class="tpTxt">{{ article.title }}</div>
											</div>
										</a>
												{% endif %}
											{% endfor %}
										{% endfor %}

									</div>


									<div class="inner">

										{% for article in blogs['media'].articles limit: 5 %}
											{% for tag1 in article.tags  %}
												{% if tag1 == 'タグ2' %}
										<a class="item" href="{{ article.url }}" data-animate>
											<div class="topicsImage">
												<img class="card__image lazyload fade-in" data-src="{{ article.image | img_url: 'master' }}"
												data-widths="[180, 220, 300, 360, 460, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
												data-aspectratio="1.6"
												data-sizes="auto"
												loading="lazy"
												alt="{{image.alt}}">
											</div>
											<div class="topicsTitle">
												<div class="tpYmd">{{ article.created_at | date: '%Y年 %-m月 %d日' }}</div>
												<div class="tpTxt">{{ article.title }}</div>
											</div>
										</a>
												{% endif %}
											{% endfor %}
										{% endfor %}

									</div>