Versions Compared
Key
- This line was added.
- This line was removed.
- Formatting was changed.
Description
Status | ||||||
---|---|---|---|---|---|---|
|
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 layouts. You can, however, add custom layouts with zones to your configuration.
Solution
Defining the layout
A Landing Page layout is composed of zones.
Zone structure
Each zone contains the following parameters:
Name | Description |
---|---|
<zone_id> | Required. A unique zone ID |
<name> | Required. Zone name |
Defining a zone layout
You can define a new layout file (e.g. in Twig) for a zone and include it in a Landing page layout.
A Zone is a container for blocks. The best way to display blocks in the zone is to iterate over a blocks array and render the blocks in a loop.
Note |
---|
For eZ Enterprise, the |
Code Block | ||
---|---|---|
| ||
<div data-studio-zone="{{ zones[0].id }}"> {# If a zone with [0] index contains any blocks #} {% if zones[0].blocks %} {# for each block #} {% for block in zone[0].blocks %} {# create a new layer with appropriate id #} <div class="landing-page__block block_{{ block.type }}"> {# render the block by using the "ez_block:renderBlockAction" controller #} {{ render_esi(controller('ez_block:renderBlockAction', { {# id of the current content #} 'contentId': contentInfo.id, {# id of the current block #} 'blockId': block.id })) }} </div> {% endfor %} {% endif %} </div> |
Creating and configuring layouts
In the Demo installation the layout configuration is stored in ezstudio-demo-bundle/Resources/config/default_layouts.yml:
Code Block | ||||
---|---|---|---|---|
| ||||
layouts: 1: identifier: 1 name: One column description: 'One column' thumbnail: '/bundles/ezstudiodemo/images/layouts/1.png' template: eZStudioDemoBundle:layouts:1.html.twig zones: first: name: First zone 1_2: identifier: 1_2 name: Two zones in columns, narrow left, wide right description: Two zones in columns, narrow left, wide right thumbnail: '/bundles/ezstudiodemo/images/layouts/1_2.png' template: eZStudioDemoBundle:layouts:1_2.html.twig zones: first: name: First zone second: name: Second zone 1_2__1: identifier: 1_2__1 name: Three zones, two columns, narrow left, wide right in first row and one row description: Three zones, two columns, narrow left, wide right in first row and one row thumbnail: '/bundles/ezstudiodemo/images/layouts/1_2__1.png' template: eZStudioDemoBundle:layouts:1_2__1.html.twig zones: first: name: First zone second: name: Second zone third: name: Third zone |
The following parameters need to be included in the settings of the default_layouts.yml file:
Parameter | Type | Description | Required |
---|---|---|---|
layouts | string | Layout config root | Yes |
number | string | Unique key of the layout | Yes |
{ID}/identifier | string | ID of the Layout | Yes |
{ID}/name | string | Name of the Layout | Yes |
{ID}/description | string | Description of Layout | Yes |
{ID}/thumbnail | string | <path> to thumbnail image | Yes |
{ID}/template | string | <path> to template View For example: <bundle>:<directory>:<file name> | Yes |
{ID}/zones | string | Collection of zones | Yes |
{ID}/{zone}/zone_id | string | ID of the zone | Yes |
{ID}/{zone}/name | string | Zone name | Yes |
In this topic:
Table of Contents | ||
---|---|---|
|
Related topics:
Landing Page Field Type (Enterprise)
Creating Landing Page blocks (Enterprise)