WordPress-将嵌套下拉列表分隔到新部分

我有三级导航（默认情况下隐藏第三级）：

是否可以将第二级和第三级导航分离为各自的

？这样，第二层位于

左面板中，第三层位于
右面板中，如下所示：

<!-- @start -->
<ul>
    <li>
        <a href="/">Top menu</a>
        <ul class="dropdown">

            <!-- Left Panel -->
            <li class="col-md-5">
                <ul>
                    <li>
                        <a href="/">Second level menu A</a>
                    </li>
                    <li>
                        <a href="/" data-target="menu1">Second level menu B</a>
                    </li>
                </ul>
            </li>
            <!-- @end Left Panel -->

            <!-- Right Panel -->
            <li class="col-md-7" style="display: none">
                <ul id="menu1">
                    <li>
                        <a href="/">Third level menu A</a>
                    </li>
                    <li><a href="/">Third level menu B</a></li>
                </ul>
            </li>
            <!-- @end Right Panel -->

        </ul>
    </li>
</ul>
<!-- @end -->
























我发现的大多数示例中，第三级导航直接位于其父级下

<!-- @start -->
<ul>
    <li>
        <a href="/">Top menu</a>
        <ul class="dropdown">

            <!-- Left Panel -->
            <li class="col-md-5">
                <ul>
                    <li>
                        <a href="/">Second level menu A</a>
                    </li>
                    <li>
                        <a href="/" data-target="menu1">Second level menu B</a>
                    </li>
                </ul>
            </li>
            <!-- @end Left Panel -->

            <!-- Right Panel -->
            <li class="col-md-7" style="display: none">
                <ul id="menu1">
                    <li>
                        <a href="/">Third level menu A</a>
                    </li>
                    <li><a href="/">Third level menu B</a></li>
                </ul>
            </li>
            <!-- @end Right Panel -->

        </ul>
    </li>
</ul>
<!-- @end -->