How to add a new Ibexa CMS / eZ Platform componentΒΆ


This tutorial is Ibexa CMS / eZ Platform specific.

To add a new component, no PHP is needed, only a simple configuration block:

            name: 'Hero'
            definition_identifier: ibexa_component
            icon: '/public/images/components/icon-component-hero.svg'
                view_type: hero_style_1
                    content_type_identifier: ng_component_hero

                - ibexa_component_hero

With the configuration above, the component is defined and ready to be used.

The following list explains various configuration entries in the config above:

  • ibexa_component_hero: Identifier of the component. This value will be used when e.g. adding a block plugin specific to this component.

  • name: The name of the component, to be displayed in add block sidebar. This is a required value.

  • definition_identifier: System identifier of the block definition which all components use. This is a required value and the only supported value is ibexa_component (or ezcomponent in case of eZ Platform)

  • icon: The public path to the icon of the component. Optional. Around 15 icons are available and ready to use for your own components in /public/bundles/netgenlayoutsibexa/images/components directory.

  • defaults.view_type: The default view type that the component will use after it is created. This config is required and must be valid for the content type attached to the component.

  • defaults.content_type_identifier: The content type of the content that this component will use. Only content of the selected content type can be added to the component. This is a required value.

Finally, block_type_groups config places your component into an already existing Components group.

Additionally, you can add the configuration as below to define the default parent location ID when creating a content which will be added to the component:

ibexa: # "ezpublish" in case of eZ Platform
            ibexa_component: # "ezcomponent" in case of eZ Platform
                    ng_component_hero: 42

Here, ng_component_hero is a content type specified in the configuration which creates the component (defaults.content_type_identifier).