主页 / 问题 / 1187895
Accepted
Сергей
Asked:2020-10-09 05:34:47 +0000 UTC2020-10-09 05:34:47 +0000 UTC

如何将 Wordpress 生成的 HTML 菜单代码替换为布局设计器提供的 HTML 菜单代码？

  • 772
  1. 我在模板中连接菜单：
wp_nav_menu([ 
    'menu' => 'topmenu',
]);
  1. 我得到了 Wordpress 生成的代码：
<div class="menu-topmenu-container">
    <ul id="menu-topmenu" class="menu">
        <li id="menu-item-42" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home current-menu-item page_item page-item-6 current_page_item menu-item-has-children menu-item-42"><a title="Услуги" href="" aria-current="page">Услуги</a>
            <ul class="sub-menu">
                <li id="menu-item-61" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-61"><a href="">Изготовление кухонь</a></li>
            </ul>
        </li>
        <li id="menu-item-48" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-48"><a href="http://fure.local/%d0%ba%d1%83%d1%85%d0%bd%d0%b8/">Кухни</a></li>
        <li id="menu-item-49" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-49"><a href="">Материалы</a></li>
        <li id="menu-item-50" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-50"><a href="">Наши работы</a></li>
        <li id="menu-item-51" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-51"><a href="">О компании</a></li>
        <li id="menu-item-52" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-52"><a href="">Контакты</a></li>
    </ul>
</div>
  1. 布局设计器的布局如下所示：
<div class="header_bottom--a header_bottom--a__sub">Услуги
    <span class="triangle-bottom"></span>
    <div class="sub_mnu sub_mnu1">
        <h3 class="sub_mnu--title">Услуги студии</h3>
        <a href="/kitchens" class="sub_mnu--item">Изготовление кухонь</a>
        <a href="/3d-modeling" class="sub_mnu--item">3д моделирование</a>
        <a href="#" class="sub_mnu--item">Подготовка чертежей</a>
        <a href="#" class="sub_mnu--item">Дизайн интерьера</a>
        <a href="#" class="sub_mnu--item">Изготовление фасадов</a>
    </div>
</div>
<div class="header_bottom--a header_bottom--a__sub">Кухни
    <span class="triangle-bottom"></span>
    <div class="sub_mnu sub_mnu2">
        <div class="sub_mnu--flex">
            <div>
                <h3 class="sub_mnu--title">Типы Кухонь</h3>
                <a href="#" class="sub_mnu--item">Изготовление кухонь</a>
                <a href="#" class="sub_mnu--item">3д моделирование</a>
            </div>
            <div class="sub_mnu--col">
                <h3 class="sub_mnu--title">Стили кухонь</h3>
                <a href="#" class="sub_mnu--item">Кухни в стиле Модерн</a>
                <a href="#" class="sub_mnu--item">Кухни в классическом стиле</a>
            </div>
        </div>
    </div>
</div>
<div class="header_bottom--a header_bottom--a__sub">Материалы
    <span class="triangle-bottom"></span>
    <div class="sub_mnu sub_mnu3">
        <h3 class="sub_mnu--title">Материалы и Фурнитура</h3>
        <div class="sub_mnu--flex">
            <div>
                <a href="#" class="sub_mnu--item"> Фасады</a>
                <a href="#" class="sub_mnu--item">• C фасадами из ДСП</a>
                <a href="#" class="sub_mnu--item">• С фасадами из МДФ</a>
                <a href="#" class="sub_mnu--item">• С фасадами из пластика</a>
                <a href="#" class="sub_mnu--item">• С фасадами из массива</a>
                <a href="#" class="sub_mnu--item"> • С фасадами из дерева</a>
                <a href="#" class="sub_mnu--item sub_mnu--item2"> Мойки</a>
                <a href="#" class="sub_mnu--item">Скинали</a>
            </div>
            <div class="sub_mnu--col2">
                <a href="#" class="sub_mnu--item"> Столешницы</a>
                <a href="#" class="sub_mnu--item">• Камень</a>
                <a href="#" class="sub_mnu--item">• Дсп</a>
                <a href="#" class="sub_mnu--item">• Luxform</a>
                <a href="#" class="sub_mnu--item">• Kronospan</a>
                <a href="#" class="sub_mnu--item">Фурнитура</a>
                <a href="#" class="sub_mnu--item sub_mnu--item2"> • Blum</a>
                <a href="#" class="sub_mnu--item">• Hettich</a>
             </div>
         </div>
     </div>
</div>
<a href="/portfolio" class="header_bottom--a">Наши работы</a>
<a href="/about" class="header_bottom--a">О Компании</a>
<a href="/contacts" class="header_bottom--a">Контакты</a>

如何将 WordPress 生成的布局替换为布局设计师以编程方式提供的布局？

wordpress

1 个回答

  1. Best Answer

    您可以将菜单放入数组并自己形成html

    $menu = wp_get_nav_menu_object( 'topmenu' ); 

$menu_items = wp_get_nav_menu_items( $menu ); 


<nav class="header-nav">
    <ul>
            <?php foreach ( (array) $menu_items as $key => $menu_item ) : ?>
                    <li><a href="<?php echo $menu_item->url; ?>"><?php echo $menu_item->title; ?></a></li>
           <?php endforeach; ?>
    </ul>
</nav>

    有关所有选项的更多详细信息https://wp-kama.ru/function/wp_get_nav_menu_items

    • 0

相关问题