AlexandraSvetik
@AlexandraSvetik

Как адаптировать вот такое меню под wordpress?

Вот код меню
<nav class="navigation navbar navbar-default">
                <div class="container">
                    <div class="navbar-header">
                        <button type="button" class="open-btn">
                            <span class="sr-only">Toggle navigation</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                        <a class="navbar-brand" href="index.html"><img src="assets/images/logo.png" alt></a>
                    </div>
                    <div id="navbar" class="navbar-collapse collapse navbar-right navigation-holder">
                        <button class="close-navbar"><i class="ti-close"></i></button>
                        <ul class="nav navbar-nav">
                            <li class="menu-item-has-children">
                                <a href="#">Home</a>
                                <ul class="sub-menu">
                                    <li><a href="index.html">Home</a></li>
                                    <li><a href="index-2.html">Home style 2</a></li>
                                    <li><a href="index-3.html">Home style 3</a></li>
                                </ul>
                            </li>
                            <li class="menu-item-has-children">
                                <a href="#">Pages</a>
                                <ul class="sub-menu">
                                    <li><a href="about.html">About</a></li>
                                    <li><a href="about-s2.html">About style 2</a></li>
                                    <li><a href="team.html">Attorneys</a></li>
                                    <li><a href="attorney-single.html">Attorney single</a></li>
                                    <li><a href="faq.html">FAQ</a></li>
                                    <li><a href="testimonials.html">Testimonials</a></li>
                                    <li><a href="404.html">404</a></li>
                                    <li class="menu-item-has-children">
                                        <a href="#Level3">Third level</a>
                                        <ul class="sub-menu">
                                            <li><a href="#">Level 3</a></li>
                                            <li><a href="#">Level 3</a></li>
                                            <li><a href="#">Level 3</a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </li>
                            <li class="menu-item-has-children">
                                <a href="#">Practice Areas</a>
                                <ul class="sub-menu">
                                    <li><a href="practice-area.html">Practice Areas</a></li>
                                    <li><a href="practice-area-s2.html">Practice Areas s2</a></li>
                                    <li><a href="service-single.html">Practice single</a></li>
                                </ul>
                            </li>
                            <li class="menu-item-has-children">
                                <a href="#">Cases</a>
                                <ul class="sub-menu">
                                    <li><a href="case-studies.html">Cases</a></li>
                                    <li><a href="case-studies-s2.html">Cases s2</a></li>
                                    <li><a href="case-single.html">Cases single</a></li>
                                </ul>
                            </li>
                            <li class="menu-item-has-children">
                                <a href="#">Blog</a>
                                <ul class="sub-menu">
                                    <li><a href="blog.html">Blog Default</a></li>
                                    <li><a href="blog-left-sidebar.html">Blog left sidebar</a></li>
                                    <li><a href="blog-fullwidth.html">Blog fullwidth</a></li>
                                    <li><a href="blog-details.html">Blog Details default</a></li>
                                    <li><a href="blog-details-left-sidebar.html">Blog Details left sidebar</a></li>
                                    <li><a href="blog-details-fullwidth.html">Blog Details fullwidth</a></li>
                                </ul>
                            </li>
                            <li><a href="contact.html">Contact</a></li>
                        </ul>
                    </div><!-- end of nav-collapse -->
                    <div class="search-quote">
                        <div class="header-search-area">
                            <div class="header-search-form">
                                <form class="form">
                                    <div>
                                        <input type="text" class="form-control" placeholder="Search here">
                                    </div>
                                    <button type="submit" class="btn"><i class="fi flaticon-magnifying-glass-browser"></i></button>
                                </form>
                            </div>
                            <div>
                                <button class="btn open-btn"><i class="fi flaticon-magnifying-glass-browser"></i></button>
                            </div>
                        </div>
                        <div class="quote">
                            <a href="#" class="theme-btn">Free consultation</a>
                        </div>
                    </div>
                </div><!-- end of container -->
            </nav>

При попытке сделать как на сайте wp-cama. Меню работает но не выводит 2 уровень помогите пожалуйста. Что мне нужно вставить между <ul class="nav navbar-nav"> и </ul> уже все перепробовала. Проблема в том что надо чтобы ul оборачивался в <li class="menu-item-has-children"> и еще ему присваивался class="sub-menu" вот в чем проблема
  • Вопрос задан
  • 58 просмотров
Пригласить эксперта
Ответы на вопрос 1
AntonLitvinenko
@AntonLitvinenko
HTML coder
тут ничего не надо специально адаптировать, потому что классы от вордпресса, оставляем все что вокруг ul, а само ul выводим типа както так
<?php
	wp_nav_menu(
		array(
			'theme_location'  => 'menu-1', // так зарегестрировано в функциях
			'menu_id'         => 'primary-menu', // необязательно
			'menu'            => '', 
			'container'       => false, 
			'menu_class'      => 'nav navbar-nav', 
			'depth'           => 3,
			'before'          => '',
			'after'           => '<span class="submenu-toggle"></span>', // эту штучку можно красиво оформить в стрелочку и даже использовать как кнопку на мобилках
		)
	);
?>

после в вордпрессе создать меню и прикрепить его галочкой к этому меню, иначе выведет некорректно
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы