Skip to content
  • Documentation >
  • Templating >
  • Templates >
  • Templates

Templates

You can customize the layout and look of your website with templates. Templates use the Twig template engine.

Tip

Learn more about Twig templates from Twig documentation.

Connecting templates

Templates can inherit from other templates. Use this, for example, to inherit a general page layout including a navigation menu in article templates.

To inherit from other templates, a template must extend the parent templates using the extends() Twig function. To extend a parent template, the child template must contain Twig blocks. These blocks are inserted in the parent template in relevant places.

For example, to extend the general layout of the page, which includes header, footer, navigation, and so on, in the child template place the content in a content block:

1
2
3
4
{% extends '@ibexadesign/pagelayout.html.twig' %}

{% block content %}
{% endblock %}

The parent template (in this case, pagelayout.html.twig) must leave a place for this block:

1
2
{% block content %}
{% endblock %}

Template variables

In templates, you can use variables related to the current content item, as well as general variables related to the current view and general application settings.

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) }}

Main variables include:

Variable Description
content Content item, containing all Fields and version information (VersionInfo).
location Location object. Contains meta information on the Content (ContentInfo).
ibexa.siteaccess Current SiteAccess.
ibexa.rootLocation Root Location object.
ibexa.requestedUriString Requested URI string.
ibexa.systemUriString System URI string. System URI is the URI for internal content controller. If the current route is not a URL alias, then the current PathInfo is returned.
ibexa.viewParameters View parameters as a hash.
ibexa.viewParametersString View parameters as a string.
ibexa.translationSiteAccess Translation SiteAccess for a given language (null if the SiteAccess cannot be found).
ibexa.availableLanguages List of available languages.
ibexa.configResolver Config resolver.

Custom template variables

You can create custom Twig variables for use in templates. Set the variables per SiteAccess or SiteAccess group (scope), or per content view.

To configure a custom template variable per scope, use the twig_variables configuration key:

1
2
3
4
5
ibexa:
    system:
        site_group:
            twig_variables:
                custom_variable: 'variable_value'

You can access this variable directly in all templates in that scope:

1
{{ custom_variable }}

Variables set for a specific content view (under params) are only available when this view is matched:

1
2
3
4
5
6
7
                line:
                    article:
                        template: '@ibexadesign/line/article.html.twig'
                        match:
                            Identifier\ContentType: [article]
                        params:
                            custom_variable_per_view: 'variable_value'

Custom variables can be nested:

1
2
3
twig_variables:
    custom_variable:
        nested_variable: 'variable_value'

1
{{ custom_variable.nested_variable }}

You can use Symfony Expression language to access other values, for example:

1
2
params:
    custom_variable: "@=content.contentType.identifier"

Note

A custom variable can overwrite an existing variable, so it is good practice to avoid existing variable names such as content or location.