Symfony2 and Twig sidebar

I am developing an application using Symfony2. I use Twig to template a three-tier interface architecture. There are 3 kinds of users in my application, anonymous users, knotty users and administrators. The page is divided in this way:

<!-- app/Resources/views/base.html.twig --> <!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>{% block title %}Anotatzailea{% endblock %} - Anotatzailea</title> <!--[if lt IE 9]> <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> {% block stylesheets %} <link href='http://fonts.googleapis.com/css?family=Voces' rel='stylesheet' type='text/css'> <link href='http://fonts.googleapis.com/css?family=La+Belle+Aurore' rel='stylesheet' type='text/css'> <link href="{{ asset('css/screen.css') }}" type="text/css" rel="stylesheet" /> {% endblock %} <link rel="shortcut icon" href="{{ asset('favicon.ico') }}" /> </head> <body> <section id="wrapper"> <header id="header"> <div id="logo"> <text>Anotatzailea</text> </div> <div class="top"> {% block navigation %} {# Ikusi behar da ea erabiltzailea kautotu den, horren arabera aukera desberdinak erakusteko #} {% if is_granted('ROLE_USER') %} <nav> <ul class="navigation"> <li class="first current_page_item"><a href="{{ path('AnotatzaileaAnotatzaileaBundle_homepage') }}">Hasiera</a></li> <li><a href="{{ path('AnotatzaileaAnotatzaileaBundle_informazioa') }}">Argibideak</a></li> <li><a href="{{ path('AnotatzaileaAnotatzaileaBundle_nirekontua') }}">Kontua</a></li> <li><a href="">Estatistikak</a></li> <li><a href="{{ path('AnotatzaileaAnotatzaileaBundle_testuaanotatu') }}">Anotatu</a></li> <li><a href="{{ path('AnotatzaileaAnotatzaileaBundle_FAQ') }}">FAQ</a></li> <li><a href="{{ path('AnotatzaileaAnotatzaileaBundle_kontaktatu') }}">Kontaktatu</a></li> <li class="last"><a href="{{ path('saioa_amaitu') }}">Irten</a></li> </ul> </nav> {% elseif is_granted('ROLE_ADMIN')%} <nav> <ul class="navigation"> <li class="first current_page_item"><a href="{{ path('AnotatzaileaAnotatzaileaBundle_homepage') }}">Hasiera</a></li> <li><a href="{{ path('AnotatzaileaAnotatzaileaBundle_informazioa') }}">Argibideak</a></li> <li><a href="{{ path('AnotatzaileaAnotatzaileaBundle_nirekontua') }}">Kontua</a></li> <li><a href="{{ path('AnotatzaileaAnotatzaileaBundle_dokumentuak') }}">Dokumentuak</a></li> <li><a href="">Erabiltzaileak</a></li> <li><a href="">Estatistikak</a></li> <li class="last"><a href="{{ path('saioa_amaitu') }}">Irten</a></li> </ul> </nav> {% else %} <nav> <ul class="navigation"> <li class="first current_page_item"><a href="{{ path('AnotatzaileaAnotatzaileaBundle_homepage') }}">Hasiera</a></li> <li><a href="{{ path('AnotatzaileaAnotatzaileaBundle_informazioa') }}">Argibideak</a></li> <li><a href="{{ path('AnotatzaileaAnotatzaileaBundle_saioahasi') }}">Sartu</a></li> <li><a href="{{ path('AnotatzaileaAnotatzaileaBundle_erregistratu') }}">Erregistratu</a></li> <li><a href="{{ path('AnotatzaileaAnotatzaileaBundle_FAQ') }}">FAQ</a></li> <li class="last"><a href="{{ path('AnotatzaileaAnotatzaileaBundle_kontaktatu') }}">Kontaktatu</a></li> </ul> </nav> {% endif %} {% endblock %} </div> </header> <section id="page"> <section class="main-col"> {% block body %}{% endblock %} </section> {% if is_granted('ROLE_USER') or is_granted('ROLE_ADMIN') %} <section class="sidebar"> {% block sidebar %}{% endblock %} </section> {% endif %} <div id="footer"> {% block footer %} <!-- Partekatu --> <div class="addthis_toolbox addthis_default_style addthis_32x32_style"> <a class="addthis_button_preferred_1"></a> <a class="addthis_button_preferred_2"></a> <a class="addthis_button_preferred_3"></a> <a class="addthis_button_preferred_4"></a> <a class="addthis_button_compact"></a> <a class="addthis_counter addthis_bubble_style"></a> </div> <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4f4e593d146466e9"></script> <!---------------> <script type="text/javascript"> var addthis_config = { ui_language : "[eu]" } </script> Testua anotatzeko tresna - created by H.Salaberri</a> {% endblock %} </div> </section> </section> {% block javascripts %} {% endblock %} </body> </html> 

What I would like to do is show the sidebar only when authenticated users are logged into the application. The way I do this, I just don't see the sidebar for anonymous users. Another problem is that I don’t know how to make the main-col section bigger so that the gap left by the sidebar is not visible.

0
source share
1 answer

I think you can get what you need easily by applying conditions like

  {% if is_granted('ROLE_USER') or is_granted('ROLE_ADMIN') %} <section class="main-col"> {%else%} <section class="main-col"> {# modify the class of this section as your requirement #} {%endif%} {% block body %}{% endblock %} </section> {% if is_granted('ROLE_USER') or is_granted('ROLE_ADMIN') %} <section class="sidebar"> {% block sidebar %}{% endblock %} </section> {%endif%} 

hope this helps

+1
source

Source: https://habr.com/ru/post/952962/


All Articles