Skip to content
  • Documentation >
  • Templating >
  • Render content >
  • Render content

Render content

Content is rendered automatically by using default, basic templates. To render content with a custom template, you create a template file and inform the system, through configuration, when to use this template.

You do it by using the content view configuration.

For example, to apply a custom template to all articles, add the following configuration:

1
2
3
4
5
6
7
8
9
ibexa:
    system:
        site_group:
            content_view:
                full:
                    article:
                        template: '@ibexadesign/full/article.html.twig'
                        match:
                            Identifier\ContentType: article

This configuration defines a full view for all content items that fulfill the conditions in match. match indicates that all content items with the content type article should use this configuration. The indicated template is @ibexadesign/full/article.html.twig.

Designs

This configuration uses the design engine, as indicated by the @ibexadesign in the template path. In this example, the theme used by the design is my_theme.

Using the design engine is recommended, but you can also set direct paths to templates, for example:

1
template: 'full/article.html.twig'

You must then ensure that the templates/full folder contains the template file.

The configuration requires that you add the article.html.twig template file to templates/themes/<theme_name>/full, in this example, templates/themes/my_theme/full.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
<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'
}) }}

Get content information

To render general content information, such as content name, use the ibexa_content_name() Twig function.

Content name is based on the content name pattern of the content type.

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

You can get general information about the content, location and view parameters by using the available variables. For example, to get the publication date of the current content item, use:

1
{{ content.contentInfo.publishedDate|ibexa_full_datetime }}

Tip

For development purposes, you can list all available variables, or a single variable, and their values, by using the dump() Twig function:

1
2
{{ dump() }}
{{ dump(content) }}

Render fields

You can render a single field of a content item by using the ibexa_render_field() Twig function. It takes the content item and the identifier of the Field as arguments:

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

You can pass additional arguments to this function, for example, an HTML class:

1
2
3
4
5
{{ ibexa_render_field(content, 'body', {
    'attr': {
        class: 'article-body'
    }
}) }}

Field templates

You can use a custom Field template by passing the template as an argument to ibexa_render_field():

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

In this case you must place the author.html.twig template in templates/themes/<theme_name>/fields, for example templates/themes/my_theme/fields.

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

The field template must be placed in a block that corresponds to the field type identifier, in this case {% block ezauthor_field %}.

Template blocks

Twig blocks are used to include templates in one another. For more information about relationships between templates, see Connecting templates.