Как сделать Bootstrap меню для Wordpress?! (вертикальное и обычное)

Сейчас я делаю новую тему для своего интернет-магазина shop.tool-ha.ru, хочу чтобы там всё было круто woocommerce, bootstrap, полный адаптив. Для большего удобства навигации я хочу сделать боковое меню. А так как всё это на bootstrap то естественно встал вопрос о «как это сделать». Реализация на мой взгляд получилась отличной. Посмотрите!


Сперва мне нужен выпадающий блок. ссылка на реализацию блока в bootstrap. Там все просто. Скопировал — вставил.
На стилях я тоже не хочу долго останавливаться по ряду причин. Ну во-первый это многие знаю, а во-вторых это не так уж сложно. Единственно я обращу внимание «самых маленьких» на пару вещей.

font-size: 1rem; — можете использовать px, rem, em. Всё что вам угодно

для класса .menu в своем проекте я использовал атрибут left:-15px; чтобы выравнивать полевому краю блока .container

.navbar-vertycal .dropdown-menu {position: absolute; top:0; left: 100%;} это для того чтобы меню раскрывалось с права.

Меню находиться в .col-lg-3 если нужно, чтобы меню было шире или уже измените размер колонки.

 

Далее самое главное

Создайте файл Bootstrap_Walker_Nav_Menu extends Walker_Nav_Menu.php и подключите в файле function.php. В созданный файл поместите следующий текст

Это код вывода вертикального меню. Его нужно разместить внутри container>row>col-lg-3 (или например col-md-4)

Меню Bootstrap целиком

Вы так же можете вывести и всё меню bootstrap, горизонтально например, используя следующий код

Обратите внимание что в случае с полным меню 'container_class' => 'menu-header', а в случае с вертикальным 'container_class' => 'navbar-vertycal'. Это основное отличие.