隱藏漢堡菜單

我的漢堡包菜單上的所有其他網頁正常工作 - 我只是不希望它顯示的主頁，這是目前在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以外的所有其他頁面上顯示導航菜單，然後將其粘貼到帶有class和id「menu-btn」的div的前面，我會得到語法錯誤：

<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，我應該在哪裏放置功能/我應該使用什麼功能？

謝謝！

來源

2016-11-23 Sean

在打印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>

來源

2016-11-23 06:32:04 Alex

我看啊，這做到了 - 謝謝！ – Sean

您在混合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 } ?>

說明：

正如你可以看到你有你PHP內的<div>...</div>。您需要先關閉您的php-section，然後發佈您的html，然後您必須結束您的if。

你只需要一個?>你if(...) {

希望這有助於以後。

來源

2016-11-23 06:37:54

是有道理的 - 現在我知道如何正確關閉PHP部分/結束If語句！ – Sean

你可以做這樣的：

<?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> 
} 
?>

來源

2016-11-23 21:18:21

隱藏漢堡菜單

回答

相關問題