For AI agents: the complete documentation index is available at llms.txt; this page is also available as Markdown at index.md.

• Documentation >
• Content management >
• Pages >
• Page blocks

Page blocks

Page blocks are configured in YAML files, under the ibexa_fieldtype_page key. Keep in mind that Page block configuration isn't SiteAccess-aware.

Cohesivo ships with a number of page blocks. For a list of all page blocks that are available out-of-the-box, see Page block reference.

Clear the persistence cache

Persistence cache must be cleared after any modifications have been made to the block config in Page Builder, such as adding, removing or altering the page blocks, block attributes, validators or views configuration.

To clear the persistence cache, run php bin/console cache:pool:clear <cache-pool> command. The default cache pool is named cache.tagaware.filesystem. The default cache pool when running Redis or Valkey is named cache.redis.

In prod mode, you also need to clear the symfony cache by running ./bin/console c:c. In dev mode, the Symfony cache is rebuilt automatically.

Block configuration

Each configured block has an identifier and the following settings:

Setting	Description
name	Name of the block used in the Page Builder interface. Translatable using the ibexa_page_fieldtype translation domain. Also accepts a help key that adds a helper text under the Name field in the block configuration form.
category	Category in the Page Builder Page blocks toolbox that the block is shown in. Translatable using the ibexa_page_fieldtype translation domain.
thumbnail	Thumbnail used in the Page Builder Page blocks toolbox.
views	Available templates for the block.
visible	(Optional) Toggles the block's visibility in the Page Builder Page blocks toolbox. Remove the block from the layout before you publish another version of the page.
configuration_template	(Optional) Template for the block settings modal.
attributes	(Optional) List of block attributes.
cacheable_query_params	(Optional) List of query parameters the block's ESI HTTP cache varies on. For example, if the block is paginated using ?page=ℕ from the page URL, add page to this list. See the ibexa_append_cacheable_query_params() Twig function.

For example:

ibexa_fieldtype_page:
    blocks:
        event:
            name: event_block.name
            category: custom_category.name
            thumbnail: /bundles/ibexaadminuiassets/vendors/ids-assets/dist/img/all-icons.svg#calendar
            configuration_template: '@ibexadesign/blocks/event/config.html.twig'
            views:
                default:
                    template: '@ibexadesign/blocks/event/template.html.twig'
                    name: event_block.view.default
                    priority: -255
            attributes:
# ...

Block name and help text

The name setting accepts either a single translation key, a hard coded string of text that won't be translated, or an object with text and help property keys. Both text and help are translatable using the ibexa_page_fieldtype translation domain.

Scalar form:

ibexa_fieldtype_page:
    blocks:
        my_block:
            name: my_block.name.key

Structured form with a helper text:

ibexa_fieldtype_page:
    blocks:
        my_block:
            name:
                text: my_block.name.key
                help: my_block.name.help.key

• text - corresponds to the block name.
• help - is an optional translation key whose translation is rendered as a helper text under the Name field in the block configuration form.

The same format is available for React App blocks.

Overwriting existing blocks

You can overwrite the following properties in the existing blocks:

• name
• category
• thumbnail
• views

Block templates

Page blocks can have multiple templates. This allows you to create different styles for each block and let the editor choose them when adding the block from the UI. They names are translatable using the ibexa_page_builder_block_config translation domain.

ibexa_fieldtype_page:
    blocks:
        event:
            views:
                default:
                    template: '@ibexadesign/blocks/event/template.html.twig'
                    name: event_block.view.default
                    priority: -255
                featured:
                    template: '@ibexadesign/blocks/event/featured_template.html.twig'
                    name: event_block.view.featured
                    priority: 50

priority defines the order of block views on the block configuration screen. The highest number shows first on the list.

Tip

Default views have a priority of -255. It's good practice to keep the value between -255 and 255.

Block modal template

The template for the configuration modal of built-in Page blocks is contained in vendor/ibexa/page-builder/src/bundle/Resources/views/page_builder/block/config.html.twig.

You can override it by using the configuration_template configuration key:

ibexa_fieldtype_page:
    blocks:
        event:
            name: event_block.name
            category: custom_category.name
            thumbnail: /bundles/ibexaadminuiassets/vendors/ids-assets/dist/img/all-icons.svg#calendar
            configuration_template: '@ibexadesign/blocks/event/config.html.twig'

The template can extend the default config.html.twig and modify its blocks. Blocks basic_tab_content and design_tab_content correspond to the Basic and Design tabs in the modal.

The following example wraps all form fields for block attributes in an ordered list:

{% extends '@IbexaPageBuilder/page_builder/block/config.html.twig' %}

{% block basic_tab_content %}
    <div class="ibexa-block-config__fields">
        {{ form_row(form.name) }}
        {% if attributes_per_category['default'] is defined %}
            <ol>
                {% for identifier in attributes_per_category['default'] %}
                    {% block config_entry %}
                        <li>
                            {{ form_row(form.attributes[identifier]) }}
                        </li>
                    {% endblock %}
                {% endfor %}
            </ol>
        {% endif %}
    </div>
{% endblock %}

Copy as Markdown View as Markdown View on GitHub