Ibexa DXP のテンプレートについて #IbexaDXP

コンテンツをレンダリングする

コンテンツは、デフォルトの基本テンプレートを使用して自動的にレンダリングされます。カスタムテンプレートを使用してコンテンツをレンダリングするには、テンプレートファイルを作成し、構成を通じて、このテンプレートをいつ使用するかをシステムに通知します。

これはコンテンツビューの設定を使用して行います。

たとえば、カスタムテンプレートをすべての記事に適用するには、次の構成を使用します。

ibexa:
    system:
        site_group:
            content_view:
                full:
                    article:
                        template: '@ibexadesign/full/article.html.twig'
                        match:
                            Identifier\ContentType: article

この設定は、match の条件を満たすすべての Content item の full ビューを定義します。
match は Content Type article を持つすべての Content item がこの設定を使用することを示します。
表示される template は @ibexadesign/full/article.html.twig です。

デザイン
この設定では、テンプレートパスの @ibexadesign で示されるように、デザインエンジンを使用します。この例では、デザインで使用されるテーマは my_theme です。

デザインエンジンの使用をお勧めしますが、次のようにテンプレートへの直接パスを設定することもできます。

template: 'full/article.html.twig'

その後、templates/full フォルダにテンプレートファイルが含まれていることを確認する必要があります。

この設定では、article.html.twig テンプレートファイルを templates/themes/<テーマ名>/full に、この例では templates/themes/my_theme/full に追加することが必要です。

<h1>{{ ibexa_content_name(content) }}</h1>

{{ content.contentInfo.publishedDate|ibexa_full_datetime }}

{{ ibexa_render_field(content, 'intro') }}

{{ ibexa_render_field(content, 'body', {
    'attr': {
        class: 'article-body'
    }
}) }}

{{ ibexa_render_field(content, 'author', {
    'template': '@ibexadesign/fields/author.html.twig'
}) }}

コンテンツ情報を取得する

コンテンツ名などの一般的なコンテンツ情報をレンダリングするには、ibexa_content_name() Twig 関数を使用します。

コンテンツ名は、Content Type のコンテンツ名パターンに基づいています。

<h1>{{ ibexa_content_name(content) }}</h1>

利用可能な変数を使用することで、コンテンツ、ロケーション、ビューパラメータに関する一般的な情報を取得することができます。例えば、現在のContentアイテムの公開日を取得するには、以下を使用します。

{{ content.contentInfo.publishedDate|ibexa_full_datetime }}

ヒント
開発の目的で、dump() Twig 関数を使用して、使用可能なすべての変数、または1つの変数とそれらの値を一覧表示できます。

{{ dump() }}
{{ dump(content) }}

フィールドのレンダリング

ibexa_render_field() Twig 関数を使うと、コンテンツアイテムの単一のフィールドをレンダリングすることができます。これは Content item と Field の識別子を引数として取ります。

{{ ibexa_render_field(content, 'intro') }}

この関数には、HTML クラスなどの追加の引数を渡すことができます。

{{ ibexa_render_field(content, 'body', {
    'attr': {
        class: 'article-body'
    }
}) }}

フィールドテンプレート

カスタムフィールドテンプレートを使用するには、ibexa_render_field() の引数としてテンプレートを渡します。

{{ ibexa_render_field(content, 'author', {
    'template': '@ibexadesign/fields/author.html.twig'
}) }}

この場合、author.html.twig テンプレートを templates/themes/<theme_name>/fields に配置する必要があります（例： templates/themes/my_theme/fields など）。

{% block ezauthor_field %}
{% if field.value.authors|length() > 0 %}
    {% for author in field.value.authors %}
        <span class="author">{{ author.name }}</span>
    {% endfor %}
{% endif %}
{% endblock %}

Field テンプレートは、Field Type の識別子に対応するブロック（この場合は {% block ezauthor_field %}） に配置する必要があります。

テンプレートブロック
Twig ブロックは、テンプレートを互いにインクルードするために使用します。テンプレート間の関係については、Connecting templates を参照してください。