1. Rapid Prototyping with BlockBundle¶
Before starting to code a project, sometimes you need to integrate HTML into valid Twig templates. This work can be done by an external team. However, at some point, the work needs to be merged and this is where issues might occur. Let’s see what can we do with Symfony2
and BlockBundle
to make that work easier.
1.1. The Symfony Template Controller¶
The TemplateController is a native Symfony controller that can be used to render a template from a route definition, this is a pretty nice feature when you start a project from templates. You can then generate all routes for your application without having the need to generate all the required controllers.
1 2 3 4 5 | acme_privacy:
path: /privacy
defaults:
_controller: FrameworkBundle:Template:template
template: '@Acme/Static/privacy.html.twig'
|
1.2. The Template Block Service¶
At this point, you might want to reuse some elements inside different templates. You can use native Twig features: block
, use
or include
. You can also use the render
function from the Symfony2
framework. The first solution is not very good on the long run as some elements might require some extra data to be rendered, so you will need a dedicated controller to render these elements (the latter solution). Using the render
function comes with a cost: a sub request is generated, all related events are dispatched, and you are limited in the caching strategy.
This overhead is not always required just to render an area and you might want to have a fine control over the caching strategy. This is where the TemplateBlockService
can be an excellent complement to the TemplateController.
You start integrating your HTML with the sonata.block.service.template
block and once you need to use the block you can just update the sonata_block_render
call with the correct service name and the valid settings.
The usage is very simple:
1 2 3 | {{ sonata_block_render({ 'type': 'sonata.block.service.template' }, {
'template': '@SonataDemo/Block/myblock.html'
}) }}
|
1.3. Example¶
The main template might look like:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | <!DOCTYPE html>
<html>
<body>
<head>
<link rel="stylesheet" href="{{ asset('css/default.css') }}" type="text/css" media="all"/>
<script src="{{ asset('js/jquery-1.8.3.js') }}" type="text/javascript"></script>
</head>
<div class="container">
{{ sonata_block_render({ 'type': 'sonata.block.service.template' }, {
'template': '@MyMenu/Block/menu.twig.html'
}) }}
<div class="col-4">
{{ sonata_block_render({ 'type': 'sonata.block.service.template' }, {
'template': '@MyMenu/Block/navigation.twig.html'
}) }}
</div>
<div class="col-6">
{{ sonata_block_render({ 'type': 'sonata.block.service.template' }, {
'template': '@MyMenu/Block/content.twig.html'
}) }}
</div>
</div>
<!-- monitoring:3e9fda56df2cdd3b039f189693ab7844fbb2d4f6 -->
</body>
</html>
|