Warning: You are browsing the documentation from version 4 to 10 of Pimcore.
Please visit https://pimcore.com/docs/platform/ for the latest versions of Pimcore.
Version:
Adding a custom layout
For adding new a layout type, follow these steps:
- Create a template view file:
templates/headless/custom.html.twig
{# array states #}
<h5>** Custom Layout **</h5>
<div>
{% for state in states %}
{% for editable in state.items %}
{% if editable is pimcore_headless_editable %}
{{ editable.getContent()|raw }}
{% endif %}
{% endfor %}
{% endfor %}
</div>
- Add a layout class, which implements
\Pimcore\Bundle\HeadlessDocumentsBundle\Headless\Layout\LayoutInterface
and define layout path in the class:
src/Headless/CustomLayout.php
class CustomLayout implements \Pimcore\Bundle\HeadlessDocumentsBundle\Headless\Layout\LayoutInterface
{
public function getName(): string
{
return 'custom';
}
public function getLayoutPath(): string
{
return 'headless/custom.html.twig';
}
}
- Register Layout as a tagged service ``:
config/services.yaml
App\Headless\CustomLayout:
tags:
- { name: pimcore.headless.documents.layout }
- Use custom layout in template configuration:
layout: custom
content:
headline:
type: input
config:
placeholder: Headline
required: true
mainContent:
type: wysiwyg