如何向您的 WordPress 主題添加下拉菜單

向您的 WordPress 主題添加下拉菜單可能是組織內容並使其更加用戶友好的好方法。 有幾種不同的方法可以為您的 WordPress 主題添加下拉菜單，在本文中，我們將向您展示如何使用WordPress 菜單系統來實現。

最近幾週，導航菜單備受關注。 在開始編寫高級菜單代碼之前學習如何設計下拉菜單是個好主意。 它將為您提供在本教程中創建高級菜單所需的基礎。 跟隨本教程將需要： 第二步是學習 WordPress 菜單設計。 WordPress的內置菜單功能； 3. 這本書是為 WordPress 初學者編寫的，涵蓋了開發下拉菜單的基礎知識。 如何使用 CSS 定位由 WordPress 菜單功能生成的 HTML。

在您的數據庫中，您會在 wp_posts 表中找到導航菜單中每個項目的帖子。 每個帖子的元數據都是獨一無二的，其中包括將顯示的文本以及鏈接的目標。 確保在主題樣式表中默認隱藏二級項目。 在這種情況下，頂部的元素不會被隱藏，因為它的一個嵌套元素將在頂部的另一個元素中。 您會注意到內容旁邊有一個下拉菜單。 我們希望它看起來好像漂浮在材質之上。 因此，我們需要在樣式表中包含佈局樣式來解決這個問題。

頂層項目的相對位置也必須在正文中列出。 為您的主題添加一個名為媒體查詢的新類和一個名為 burger-menu.js 的新文件將允許它運行。 當用戶點擊圖標時，可以使用腳本創建菜單。 在媒體查詢中，我們將使用 CSS 隱藏菜單元素，該元素位於具有類的元素內部。

如何在 WordPress 頁面中添加下拉菜單

要在 WP Admin 中創建下拉菜單，請轉到外觀。 菜單允許您通過拖放來更改項目的順序。 要創建下拉菜單，請將一個項目向右拖動以將其“嵌套”在其正上方的另一個項目下； 通過再次向左拖動項目，您可以撤消此操作。

由於您網站上頁面和帖子內容的增加，您可能難以在菜單欄中包含每個目的地。 在這個簡短的提示中，我將介紹兩種將 WordPress 菜單轉換為下拉菜單的簡單方法。 在添加下拉功能之前創建一個標準的 WordPress 菜單。 登錄您的 WordPress 帳戶並創建一個菜單。 拖放是將常規菜單變成下拉菜單的最佳方式。 下拉菜單也可以使用 WordPress 的實時預覽和定制器創建。 例如，以下屏幕截圖顯示 Settings 是父級，Password Reset 和 Logout 是子級，並且兩者都已註銷。

如果您將菜單分為父母和孩子，您將在實時預覽中看到您的更改。 選擇“菜單位置”複選框之一，以確保您的新下拉菜單在該位置可見。 使用下拉菜單可以使您的網站更易於瀏覽，同時還可以減少菜單欄上的空間。

如何在 WordPress 的頁面中添加菜單？

單擊屏幕右上角的“查看全部”選項卡可查看您網站的所有頁面。 接下來，通過單擊要添加到菜單的每個頁面旁邊的框來選擇“添加到菜單”選項。 添加頁面後，您可以通過拖放來移動它們。

如何在 WordPress 中創建動態下拉菜單

在 WordPress 中添加動態下拉菜單相對容易，只需幾個簡單的步驟即可完成。 首先，創建一個父菜單項並在其下方添加任何所需的子菜單項。 接下來，轉到外觀 >菜單頁面並從下拉菜單中選擇新創建的菜單。 最後，選​​中“啟用動態下拉菜單”旁邊的框，然後單擊“保存菜單”按鈕。 而已！ 您的 WordPress 網站現在應該有一個動態下拉菜單。

WordPress 主題中下拉菜單的編碼相對簡單。 使用下面描述的兩種方法，WordPress 可以為下拉菜單創建 HTML。 如果您不知道如何構建下拉菜單，下面的帖子將向您展示如何構建。 在早期版本的 Internet Explorer 的 Suckerfish 菜單中使用了一個非常小的 JavaScript 文件。 許多人將他們的 HTML 硬編碼到他們的 header.php 文件中，但這並不是特別有效。 因為 WP_list_pages() 生成列表項，而不是 *ul> 標記，所以我對這些標記進行了硬編碼，以將我們的 id 和鏈接包含到列表中。 因為您的主頁通常不是 WordPress 頁面，所以我在菜單中添加了一行代碼，僅在標籤中顯示 index.php 頁面。

WordPress 2.7 包含一個名為 WP_page_menu() 的新模板標籤，它在一行中產生與上面基本相同的結果。 代碼生成如下： code type=html 頁面將根據頁面名稱命名，鏈接由鏈接來源描述。 當我們將 show_home 設置為 1 時，WordPress 應該在菜單中包含我們的主頁。 儘管它經常用於編碼drop downs ，但包裝器 div 不是必需的。 可以使用類名參數設置類名。 無法將新的屬性類添加到主頁 current_page_item。 如果您正在尋找一種方法來設置當前頁面的菜單項的樣式，那麼 WP_list_pages() 可能是一個更好的選擇。

如何在 Woocommerce 中添加下拉菜單

在 WooCommerce 中，轉到設置。 然後，在產品表下，選擇您在許可證密鑰後輸入的默認設置。 必須包含列部分中的添加到購物車列，並且必須在“變體”下選擇變體下拉菜單。

WooCommerce 店主的最終目標是為他或她的客戶提供最佳的購物體驗。 當任何人點擊一個按鈕或指向他們的文本時，下拉菜單會打開一個項目列表。 通過執行這些步驟，您將能夠將下拉菜單添加到您的 WooCommerce 產品頁面。 WooCommerce 中的額外產品選項（自定義插件）模塊包括 16 個自定義字段，包括用於顯示產品詳細信息的下拉菜單。 您可以使用我們的自定義和默認產品字段作為您的利基來創建、編輯、刪除和重新定位它們。 此插件也可以作為免費版本購買，如果您願意，請立即試用。

沒有頁面的WordPress下拉菜單

有幾種方法可以創建沒有頁面的 WordPress 下拉菜單。 一種方法是使用 Superfish 或 Dropdown Menu 之類的插件。 這些插件將允許您創建可以顯示為下拉菜單的自定義菜單。 另一種方法是使用支持下拉菜單的主題。 一些主題，如默認的 WordPress 主題，將有一個內置的下拉菜單。

使用 PHP 這樣的腳本語言，我可以輕鬆地在 WordPress 上創建一個下拉菜單。 這很簡單； 只需按照我們的分步指南立即開始。 您不需要任何插件或編碼知識即可很好地完成此操作，這太棒了。 執行作為管理儀表板一部分的四個步驟很簡單。 當您選擇顯示 WordPress 下拉菜單的位置時，您可以選擇它的顯示順序。 您可以通過轉到管理位置或單擊菜單結構鏈接來執行此操作。 有一個用於將頂級頁面添加到此菜單的選項，稱為自動添加頁面。

如果您想實時查看正在執行的操作，可以通過從“工具”菜單中選擇“使用實時預覽管理”來實現。 如果您想要下拉式大型菜單，則應使用這些插件。 除了可擴展菜單和二維下拉菜單外，此應用程序默認顯示所有項目。 使用免費版本，您可以添加水平巨型菜單、懸停或單擊事件、支持彈出窗口以及使用多個菜單。 一個站點的 Pro 插件價格從 29 美元起，並根據項目的複雜程度而上漲。 您可以使用具有多種主題的 WP Mobile Menu 創建免費增值響應式移動菜單。 使用簡單； 只需按照說明進行操作即可。

Hero Menu 插件售價 20 美元，提供六個月的支持。 不應使用包含太多或太少項目的下拉菜單。 如果它們太長，就會被認為是低於標準的，並且用戶體驗會受到影響。 選項少的下拉菜單如果選項少，就毫無意義。 您現在可以輕鬆創建自己的。

為目標空白菜單啟用鏈接目標選項

要創建目標空白菜單，請執行以下步驟： br> 通過選擇“高級菜單屬性”下的“鏈接目標”，您可以通過首先啟用“鏈接目標”選項訪問“屏幕選項”屏幕。
如果要鏈接計算機，請轉到“顯示高級菜單屬性”下的“鏈接目標”菜單。