KnpMenuBundle + Twitter Bootstrap
Этим постом открывается рубрика блога “Symfony 2”. В этой заметке я расскажу, как привести верстку менюшки к верстке Twitter Bootstrap.
Задача
Итак, необходимо чтобы при рендеренге менюшки отображались дополнительные атрибуты от Bootstrap. Я погуглил и нашел солшен, который, к сожалению, мне не подошел (knpmenu+twitter bootstrap). А всё из за непонятного Twig-тега Con.
|
1 |
{% Con dropdown %} |
Кстати, если кто знает зачем он, с удовольствием послушаю. В общем шаблон не прокатил. Однако мне удалось добиться этого через передачу атрибутов в Builder’е формы. Как ставить бандл читайте в оф.руководстве, а вот исходничек builder’а.
Решение
|
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 29 30 31 32 33 34 35 36 37 38 39 40 41 42 |
<?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
Класс! Возможно это то, что нужно.