7.5 Rendering of images in content

When displaying content which can be edited with a rich editor, use of the integrated_content Twig filter is recommended:

1

{{ article.content|integrated_content }}

This will filter will fire a content event (Integrated\Bundle\ContentBundle\Event\ContentEvent), which allows to implement a kind of custom rendering.

By default it is possible to create "object" files in the theme, for "image", "video" and "file" content items, to define the rendering of those files:

src/AppBundle/Resources/views/themes/common/objects/image/default.html.twig:

1
2
3
4
5
6
7
8

{% block image %}
    <figure class="image-holder {{ class|default }}">
        <a class="fancybox" href="{{ integrated_image(document.file).resize(680, 408) }}" title="{{ document.title|default }}">
            <img src="{{ integrated_image(document.file).cropResize(600, 600) }}" alt="{{ document.title|default }}" title="{{ document.description|default }}" class="img-responsive" />
        </a>
        <figcaption>{{ document.title|default }}</figcaption>
    </figure>
{% endblock %}