Permalink
Browse files

modify: 「ワークス」インデックステンプレート:「ワークス」一覧のループ処理でインデックス番号にあわせて出力内容を変化させるための分…

…岐を追加
  • Loading branch information...
dreamseeker committed Dec 29, 2018
1 parent b329a17 commit 7179f8fced06196730a3ee3f70ea71b05dcb9297
Showing with 51 additions and 45 deletions.
  1. +51 −45 templates/work/_index.html
@@ -10,6 +10,9 @@
{# meta タイトル #}
{% set metaTitle = 'ワークス' %}

{# 「ワークス」セクションのエントリを取得 #}
{% set workEntries = craft.entries.section('work').all() %}


{# ------------------------------------------
出力
@@ -40,49 +43,52 @@ <h1 class="delta center subfont">{{ entry.heading }}</h1>
</div>
</div><!-- /.flex -->
</section><!-- /.alt -->
<article class="work-entry work-entry-feature">
<img src="https://placehold.jp/3d4070/42598f/2000x590.png" alt="sportsrus-bigfeature" width="2000">
<div class="summary-wrap">
<a href="../work/detail.html"><h2 class="center reverse beta">Taking Sports to the Air</h2>
</a>
<h3 class="delta center subfont reverse"><a href="../work/detail.html">Sports R’ Us Sales
needed a major Energy Boost.</a></h3>
<div class="block text">
<p>
New e-commerce experience for Sports R' Us
</p>
</div>
<p class="center"><a href="../work/detail.html" class="more-link">Full Story</a></p>
</div><!-- /.summary-wrap -->
</article><!-- /.work-entry.work-entry-feature -->
<div class="flex">
<article class="work-entry">
<figure>
<a href="../work/detail.html">
<img src="https://placehold.jp/3d4070/42598f/616x204.png" alt="diva-bigimage" width="616" height="204">
</a>
</figure>
<div class="summary-wrap">
<h3><a href="../work/detail.html">Diva!</a></h3>
<p>
In July, we released Diva!, our celebrity music app.
</p>
<p><a href="../work/detail.html" class="more-link">Read More</a></p>
</div><!-- /.summary-wrap -->
</article><!-- /.work-entry -->
<article class="work-entry">
<figure>
<a href="../work/detail.html">
<img src="https://placehold.jp/3d4070/42598f/616x204.png" alt="ontrack-bigimage" width="616" height="204">
</a>
</figure>
<div class="summary-wrap">
<h3><a href="../work/detail.html">On Track</a></h3>
<p>
Our desktop software for the busy forex trader.
</p>
<p><a href="../work/detail.html" class="more-link">Read More</a></p>
</div><!-- /.summary-wrap -->
</article><!-- /.work-entry -->
</div><!-- /.flex -->

{# 「ワークス」セクションのエントリ一覧 #}
{% for workEntry in workEntries %}
{% if loop.first %}
{# ループの最初のみ出力 #}
<article class="work-entry work-entry-feature">
<img src="https://placehold.jp/3d4070/42598f/2000x590.png" alt="sportsrus-bigfeature" width="2000">
<div class="summary-wrap">
<a href="../work/detail.html"><h2 class="center reverse beta">Taking Sports to the Air</h2>
</a>
<h3 class="delta center subfont reverse"><a href="../work/detail.html">Sports R’ Us Sales
needed a major Energy Boost.</a></h3>
<div class="block text">
<p>
New e-commerce experience for Sports R' Us
</p>
</div>
<p class="center"><a href="../work/detail.html" class="more-link">Full Story</a></p>
</div><!-- /.summary-wrap -->
</article><!-- /.work-entry.work-entry-feature -->
{% else %}
{# ループのインデックス番号が2なら、コンテナ要素の開始タグを出力 #}
{% if loop.index == 2 %}
<div class="flex">
{% endif %}

{# ループの最初以外で出力 #}
<article class="work-entry">
<figure>
<a href="../work/detail.html">
<img src="https://placehold.jp/3d4070/42598f/616x204.png" alt="diva-bigimage" width="616" height="204">
</a>
</figure>
<div class="summary-wrap">
<h3><a href="../work/detail.html">Diva!</a></h3>
<p>
In July, we released Diva!, our celebrity music app.
</p>
<p><a href="../work/detail.html" class="more-link">Read More</a></p>
</div><!-- /.summary-wrap -->
</article><!-- /.work-entry -->

{# ループの最後なら、コンテナ要素の閉じタグを出力 #}
{% if loop.last %}
</div><!-- /.flex -->
{% endif %}
{% endif %}
{% endfor %}
{% endblock %}

0 comments on commit 7179f8f

Please sign in to comment.