KnpMenuBundle + Twitter Bootstrap
// 24 мая, 2012 // Symfony 2
Этим постом открывается рубрика блога «Symfony 2». В этой заметке я расскажу, как привести верстку менюшки к верстке Twitter Bootstrap.
Задача
Итак, необходимо чтобы при рендеренге менюшки отображались дополнительные атрибуты от Bootstrap. Я погуглил и нашел солшен, который, к сожалению, мне не подошел (knpmenu+twitter bootstrap). А всё из за непонятного Twig-тега Con.
{% Con dropdown %}
Кстати, если кто знает зачем он, с удовольствием послушаю. В общем шаблон не прокатил. Однако мне удалось добиться этого через передачу атрибутов в Builder’е формы. Как ставить бандл читайте в оф.руководстве, а вот исходничек builder’а.
Решение
<?php namespace Netandreus\SomeBundle\Menu; use Knp\Menu\FactoryInterface; use Symfony\Component\DependencyInjection\ContainerAware; class Builder extends ContainerAware { public function mainMenu(FactoryInterface $factory, array $options) { $menu = $factory->createItem('root'); $menu->setChildrenAttributes(array('class' => 'nav')); $menu->addChild('Главная', array('route' => 'homepage')); $menu->setCurrentUri($this->container->get('request')->getRequestUri()); $menu->addChild('Главная', array('route' => 'homepage')); $menu->addChild('Пункт 1', array('route' => 'homepage', 'attributes' => array('class' => 'dropdown'))); $menu['Пункт 1']->setLinkAttributes(array('class' => 'dropdown-toggle', 'data-toggle' => 'dropdown')); $menu['Пункт 1']->setChildrenAttributes(array('class' => 'dropdown-menu')); $menu['Пункт 1']->addChild('Подпункт 1.1', array('route' => 'homepage')); $menu['Пункт 1']->addChild('Подпункт 1.2', array('route' => 'homepage')); $menu['Пункт 1']->addChild(NULL, array('attributes' => array('class' => 'divider'))); $menu['Пункт 1']->addChild('Подпункт 1.3', array('route' => 'homepage')); $menu['Пункт 1']->addChild('Подпункт 1.4', array('route' => 'homepage')); $menu->addChild('Пункт 2', array('route' => 'homepage', 'attributes' => array('class' => 'dropdown'))); $menu['Пункт 2']->setLinkAttributes(array('class' => 'dropdown-toggle', 'data-toggle' => 'dropdown')); $menu['Пункт 2']->setChildrenAttributes(array('class' => 'dropdown-menu')); $menu['Пункт 2']->addChild('Пункт 2.1', array('route' => 'homepage')); $menu['Пункт 2']->addChild('Пункт 2.2', array('route' => 'homepage')); $menu->addChild('Пункт 3', array('route' => 'auth_login','routeParameters' => array())); return $menu; } }
Так, что можно обойтись и без переделки стилей. Названия ключей массива лучше сделать по-английски, чтобы они больше походили на ключи. А то при переименовании пункта меню, придётся исправлять много строк.
Спасибо!
Если вам помогла статья, или вы хотите поддержать мои исследования и блог - вот лучший способ сделать это:
Подсветку кода юзайте для php
Обычно всегда юзаю. Тут класс у тега слетел.
Поправил, спасибо.
Спасибо! Очень пригодилось.
только как еще ‘current’ заменить на active
нашел решение http://bootstrap.mohrenweiserpartner.de/mopa/bootstrap/navbar
Класс! Возможно это то, что нужно.