This site has been archived and you can no longer log in or post new messages. For up-to-date community resources please visit ezplatform.com

eZ Community » Blogs » Matthieu Sévère » Integrate front editing website...

By

Integrate front editing website toolbar in eZ 5

Tuesday 16 April 2013 6:45:05 pm

  • Currently 5 out of 5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5

The website toolbar for front-end editing is powered by eZWT extension, which is a legacy extension. Let's see how to integrate this legacy toolbar in an eZ 5 context.

First of all please not that I use features that were introduced in eZ 5.1, this is thus compatible with eZ 5.1+ only.

Include the legacy template

First step is to include the legacy template in your twig pagelayout. This is possible with a twig include because eZ Template is registered as a template language in eZ 5 : 

 {% include "design:parts/website_toolbar.tpl" with {"current_node_id": location.contentInfo.mainLocationId} %}

current_node_id is passed as a parameters of the legacy template. 

Note that if you pass Content or a Location it will be converted to the corresponding eZ 4 object (as said in the doc)

If you have a look at the template loaded you will see that it will fetch needed variables except $current_user that is always available in a eZ 4 pagelayout, in our context this is not the case so you will need to fetch it : $current_user = fetch( 'user', 'current_user' )

Make sure to load the websitetoolbar.css if you want to have the style of the toolbar.

You should now see the toolbar loaded in your Twig templates ! 

Enable loading of legacy modules in Twig layout

Now that you have the toolbar all the buttons are linked to legacy modules (content/edit, content/action, ...) you need to configure these modules to load the twig pagelayout (because you don't want to rewrite all your layout in legacy). 

The documentation is quite good on this (Thanks for the update Jérome!), you need to make the following configuration : 

parameters:    
   ezpublish_legacy.<siteaccess_or_siteaccess_group>.module_default_layout: AcmeDemoBundle::my_module_layout.html.twig

This wiil inject, in the layout configured above, the result of the legacy module in a module_result variable. 

You should now be able to display the module content thanks to the following code : 

{% block content %}
            {% if module_result is defined %}
                {{ module_result.content|raw }}
            {% endif %}
{% endblock %}

You now have a working front-editing in your eZ 5 website :)

This a quite good exercise to get the concept of fall-back to the legacy stack ! 

Cheers

Proudly Developed with from