Question

我的汉堡菜单在所有其他页面上都能正常工作 - 我只是不希望它显示在主页上，目前它在768px及以下可见。

footer.php是菜单所在的位置：

<div class="mobile-nav">
    <div class="menu-btn" id="menu-btn">
        <div></div>
        <span></span>
        <span></span>
        <span></span>
    </div>

    <div class="responsive-menu">
    <?php
        if ( ! is_front_page() && ! is_home() ) {
        wp_nav_menu();  
        } 
    ?>
    </div>
</div>

你可以看到我告诉它不要在首页（也是主页）上显示导航菜单，而且它正确地做到了 - 但我如何对汉堡包菜单做同样的事情？

我按照this tutorial中的说明创建了我的汉堡包菜单。如果我尝试复制PHP if语句，告诉浏览器在除Front Page / Home Page之外的所有其他页面上显示Nav Menu，然后将它粘贴到div之前，并使用class和id“menu-btn”，我得到语法错误：

<div class="mobile-nav">
    <?php if ( ! is_front_page() && ! is_home() ) {
        <div class="menu-btn" id="menu-btn">
            <div></div>
            <span></span>
            <span></span>
            <span></span>
        </div>
    } 
    ?>

    <div class="responsive-menu">
    <?php
        if ( ! is_front_page() && ! is_home() ) {
        wp_nav_menu();  
    } 
    ?>
    </div>
</div>

我不确定是否有办法用CSS隐藏特定页面上的汉堡菜单，或者，如果我确实需要使用PHP或JS，我应该在哪里放置函数/我应该使用什么函数？ / p>

谢谢！

Answer 1

在打印HTML代码之前，您必须关闭php代码部分。

<div class="mobile-nav">
    <?php if ( ! is_front_page() && ! is_home() ) : ?>
        <div class="menu-btn" id="menu-btn">
            <div></div>
            <span></span>
            <span></span>
            <span></span>
        </div>
    <?php endif; ?> 

    <div class="responsive-menu">
    <?php
        if ( ! is_front_page() && ! is_home() ) {
        wp_nav_menu();  
    } 
    ?>
    </div>
</div>

Answer 2

您正在将HTML与PHP混合。

试试这个：

<?php if ( ! is_front_page() && ! is_home() ) { ?>
    <div class="menu-btn" id="menu-btn">
        <div></div>
        <span></span>
        <span></span>
        <span></span>
    </div>
<?php } ?>

<强>解释

正如您所看到的，<div>...</div>内有PHP。您需要先关闭php-section，然后发布html，然后必须结束if。

您需要在?>

后if(...) {

希望这有帮助。

Answer 3

你可以这样做：

 <?php if ( ! is_front_page() && ! is_home() ) {
<div class="mobile-nav">
        <div class="menu-btn" id="menu-btn">
            <div></div>
            <span></span>
            <span></span>
            <span></span>
        </div>


    <div class="responsive-menu">
    <?php
        wp_nav_menu();  
    ?>
    </div>
</div>
 } 
 ?>

在WordPress网站的特定页面上隐藏汉堡菜单

3 个答案: