-
- Created by Dominika Kurek, last modified on Dec 08, 2016
Description
V1.2
A Landing Page has a customizable layout with multiple zones where you can place predefined blocks with content.
By default eZ Enterprise comes with a number of preset Landing Page blocks. You can, however, add custom blocks to your configuration.
Solution
Block configuration
In the Demo installation the layout configuration is stored in ezstudio-demo-bundle/Resources/config/default_layouts.yml:
Creating a new block
Creating a class for the block
The class for the block must implement the BlockType interface:
Most methods are implemented in a universal way by using the AbstractBlockType abstract class:
If your block does not have specific attributes or a structure, you can extend the
AbstractBlockType
class, which contains simple generic converters designated for the block attributes.
For example:
Describing a class definition
A block must have a definition set using two classes:
BlockAttributeDefinition
The
BlockAttributeDefinition
class defines the attributes of a block:
| Attribute | Type | Definition |
|---|---|---|
| $id | string | block attribute ID |
| $name | string | block attribute name |
| $type | string | block attribute type, available options are:
|
| $regex | string | block attribute regex used for validation |
| $regexErrorMessage | string | message displayed when regex does not match |
| $required | bool | TRUE if attribute is required |
| $inline | bool | indicates whether block attribute input should be rendered inline in a form |
| $values | array | array of chosen values |
| $options | array | array of available options |
BlockDefinition
The
BlockDefinition
class describes a block:
| Attribute | Type | Definition | Note |
|---|---|---|---|
$type | string | block type | |
| $name | string | block name | |
| $category | string | block category | |
| $thumbnail | string | path to block thumbnail image | |
| $templates | array | array of available paths of templates | Retrieved from the config file (default_layouts.yml) |
| $attributes | array | array of block attributes (objects of
BlockAttributeDefinition
class) |
When extending AbstractBlockType you must implement at least 3 methods:
This method must return an EzSystems\LandingPageFieldTypeBundle\FieldType\LandingPage\Definition\BlockDefinition object.
Example of a Gallery block:
This method returns an array of parameters to be displayed in rendered view of block. You can access them directly in a block template (e. g. via twig {{ title }} ).
When parameters are used in the template you call them directly without the parameters array name:
| Correct | Not Correct |
|---|---|
<h1>{{ title }}</h1>
|
<h1>{{ parameters.title }}</h1>
|
Example of the getTemplateParameters() method implementation:
This method validates the input fields for a block. You can specify your own conditions to throw the InvalidBlockAttributeException exception.
This InvalidBlockAttributeException exception has the following parameters:
| Name | Description |
|---|---|
| blockType | name of a block |
| attribute | name of the block's attribute which failed validation |
| message | a short information about an error |
| previous | previous exception, null by default |
For example:
When the class is created make sure it is added to a container.
Adding the class to the container
The services.yml file must contain info about your block class.
The description of your class must contain a tag which provides:
- tag name: landing_page_field_type.block_type
- tag alias: <name of a block>
For example:
Custom editing UI
If you want to add a custom editing UI to your new block, you need to provide the code for the custom popup UI in Javascript (see the code for eZS.ScheduleBlockView or eZS.TagBlockView for examples).
Once it is ready, create a plugin for eZS.LandingPageCreatorView that makes a use of the addBlock public method from eZS.LandingPageCreatorView, see the example below:
Upcoming feature - multiple block templates
The ability to configure different templates (views) for one Landing Page block is upcoming. See EZS-1008 to follow its progress.
Example
Block Class
V1.7
If you want to make sure that your block is only available in the Element menu in a specific situation, you can override the isAvailable method, which makes the block accessible by default:
service.yml configuration
Block template
{{ block.attributes.content|raw }}