Craft CMS で質問と答えのサービスを作ってみる - STEP06：トップページ実装
ステップ・バイ・ステップで Craft CMS を使って質問と答えをやり取りできるサービスを作ってみるシリーズのステップ6です。引き続きテンプレートを実装します。
こんにちは。この記事は「Craft CMS Advent Calendar 2021」19日目の記事です。
Craft CMS を使って質問と答えをやり取りできるサービスをステップ・バイ・ステップで作ってみるという企画をやっていて、今日はその6日目です。
二つ前の STEP 4 でベースとなるテンプレートを実装しましたので、さらに実装を進めていきます。
トップページ
現状のトップページのテンプレートは以下のようになっています。
{#=======================================================
#
# Extends, Imports
#
=======================================================#}
{% extends '_layout/base-page.twig' %}
{#=======================================================
#
# ページ固有変数・処理
#
=======================================================#}
{#=======================================================
#
# 共通変数
#
=======================================================#}
{#=======================================================
#
# 出力
#
=======================================================#}
{% block contentBody %}
{% endblock %}この中の「ページ固有変数・処理」のところに以下のコードを追加します。
{% set projectsQuery = craft.entries.section('projects').limit(10) %}
{% paginate projectsQuery as pageInfo, pageEntries %}これだけで、ページ送りを想定したクエリを簡単に作成することができます。
ベースとなるクエリ（以下「ベースクエリ」といいます）は craft.entries.section('projects').limit(10) ととなっていて、セクションハンドルが projects であるセクションに属するエントリを最大 10 件取得しています。
そして、その下の Twig の patinage タグ（ Craft CMS が拡張しているタグ）で、上記のベースクエリを元にして、現在のページの情報やページ送りの情報を pageInfo に、現在のページに該当するエントリを pageEntries に格納しています。「現在のページ」というのは、ベースクエリに該当するエントリが limit の件数を超える場合、1ページ目、2ページ目、、、のように続くと思いますが、その何ページ目かのページ（currentPage）と言う意味です。
次に、「出力」の中の {% block contentBody %} {% endblock %} の部分を以下のテンプレートのようにします。
{% block contentBody %}
{% if pageEntries|length %}
<ul>
{% for entry in pageEntries %}
<li><a href="{{ entry.url }}">{{ entry.title }}</a></li>
{% endfor %}
</ul>
{% endif %}
{% endblock %}これで pageEntries がある場合、{% for entry in pageEntries %} でループして処理しています。これでトップページを表示すると以下のように表示されます。
おっと、これだと他のユーザーのプロジェクトも表示されてしまっていてまずいですよね（ここではメインのユーザーの僕のプロジェクトとテスト太郎さんのプロジェクト）。
そこで、ベースクエリを以下のようにします。
{% set projectsQuery = craft.entries.section('projects').authorId(currentUser.id).limit(10) %}currentUser には、現在 Craft CMS にログインしているユーザーの情報がセットされています。そのユーザーID（ currentUser.id ）を authorId に渡して、現在ログイン中のユーザーの記事だけに絞っているのです。
トップページ（ index.twig ）のテンプレートは以下のようになりました。
{#=======================================================
#
# Extends, Imports
#
=======================================================#}
{% extends '_layout/base-page.twig' %}
{#=======================================================
#
# ページ固有変数・処理
#
=======================================================#}
{% set projectsQuery = craft.entries.section('projects').authorId(currentUser.id).limit(10) %}
{% paginate projectsQuery as pageInfo, pageEntries %}
{#=======================================================
#
# 共通変数
#
=======================================================#}
{#=======================================================
#
# 出力
#
=======================================================#}
{% block contentBody %}
{% if pageEntries|length %}
<ul>
{% for entry in pageEntries %}
<li><a href="{{ entry.url }}">{{ entry.title }}</a></li>
{% endfor %}
</ul>
{% endif %}
{% endblock %}今日はここまでにしましょう。
, Updated 2021-12-28