如何在WordPress中創建和編輯菜單導航

導航菜單是您網站上最重要的元素之一。沒有它,您的訪問者將無法獲得他們所需的內容,無法理解您提供的內容,並且通常會在您的網站處於混亂狀態。不幸的是,WordPress菜單系統不是CMS(內容管理系統)中最直觀的部分。我們了解這一點,並希望向您展示如何最好地導航WP導航系統。使您和您的用戶獲得最佳體驗。

創建WordPress菜單之前

現在,在深入探討WP菜單結構之前,讓我們花一點時間進行規劃。創建菜單很簡單(只需轉到  外觀–菜單並開始單擊),創建一個  有用的菜單就更深入了。本質上,問自己兩個問題:

  • 我要為誰做菜單?
  • 我要我的訪客去哪裡?

至於  我是誰製作菜單?,這似乎很愚蠢。因為答案無疑是「您的用戶」。但這不是那麼簡單。不同的用戶需要不同的東西。新用戶是否需要與返回頁面相同的頁面?登錄成員會看到與未登錄成員相同的菜單嗎?

通過考慮將使用此特定菜單的人員,您可以使其簡單。您可以避免在頁面上塞滿所有內容,以免淹沒看過它的人。WordPress菜單的妙處在於,您可以創建許多版本並將其顯示在不同的位置。

這使我們想到了第二個問題:  我希望我的訪客去哪兒?與哪些用戶需要哪些菜單緊密結合,決定您希望這些用戶去哪裡,將決定您創建哪種菜單。

ElegantThemes.com作為真實示例

例如,我們在不久前的「優雅主題」中重新設計了標題菜單。我們想專註於為我們的Facebook小組,Divi Theme UsersMeetup網路吸引流量。除了Divi本身外,這毋庸置疑。為此,與過去存在的功能更強大的版本相比,我們簡化了菜單結構,僅向用戶提供了幾個選項。

001-WordPress-Menu將滑鼠懸停在  Divi上,您不僅會看到指向主題功能的鏈接,而且還指向我們要強調的社交網路的鏈接。 所有產品還將Divi作為旗艦產品展示,因此定價也會隨著人們查看我們的會員資格而有所不同。帳戶不在新用戶範式之內,但它使新用戶可以快速訪問其成員資格,並提供了新成員註冊的選項。聯繫,也有適合每一個人。

因此,您可以看到,每個菜單項都將選定的訪問者群體定向到我們希望他們最多看到的頁面。就是說,我們在頁面的頁腳中還有一個更完整的菜單,可鏈接到我們的博客,資源,單個產品頁面等地方。

002-WordPress-Menu

標題菜單也仍然存在。但是我們知道,頁面底部的菜單將被有特定需求的人們使用,他們知道要尋找另一個菜單(如今是網路標準)來找到他們想要的東西。

考慮到這一點,您可能已經弄清楚了要為誰創建菜單以及希望他們做什麼。因此,讓我們開始構建WordPress菜單。

如何創建WordPress菜單

前往  外觀– WordPress信息中心中的菜單。您應該會看到以下內容:

002-Creating-a-Custom-WordPress-Menu-Structure

該頁面不是WordPress最人性化的部分,但是您會看到一些與我們上面討論的內容相關的部分。

菜單名稱供您參考。沒有用戶會看到此信息。通過適當地命名菜單來跟蹤哪個菜單在哪裡。在左側,您可以看到  頁面,帖子,自定義鏈接類別。一些主題在此處包含更多選項。您可能會或可能不會。菜單項可以是單獨的帖子或頁面,也可以是類別鏈接。此外,「自定義鏈接」可讓您鏈接到所有內容,只需記住  https://,否則您的鏈接可能會失效。

在「 菜單設置」下,我們強烈建議您禁用「 自動添加頁面」。此選項會將您在網站上創建的所有新頁面添加到WordPress菜單。大多數人永遠不會選中此框。

現在,「 顯示位置」選項因主題而異,因為每個主題在允許WordPress菜單顯示的位置方面都有不同的布局。但是,這些是站點中菜單可以完整顯示的位置。您無法在屏幕頂部的「 管理位置」標籤下對菜單位置進行微調。

004-WordPress-Menu

接下來,在菜單本身中添加所需的任何內容。只需選中其旁邊的框,然後單擊「  添加到菜單」。這樣做會將其添加到「 菜單結構」下。單擊箭頭以顯示其他選項,例如「  導航標籤」 

003-Creating-a-Custom-WordPress-Menu-Structure-1

請記住,導航標籤將向用戶顯示。這是出現在菜單中的部分。因此,如果頁面標題太長,可以在此處縮短。

現在,創建WordPress菜單最重要的部分(也許是所有平台中最被遺忘的操作之一)是單擊屏幕右側的「 保存菜單 」。

005-WordPress-Menu

保存後,菜單將生效。如果它已經顯示在您的網站上,則更改將立即生效。

如何創建一個下拉WordPress菜單

在大多數情況下,上述步驟與在WordPress中創建下拉菜單的步驟相同。但是,還需要執行另一個步驟以使子菜單出現。

菜單結構部分下,每個項目都是可拖動的。要創建下拉菜單,只需單擊所需的項目並將其作為父項拖動到所需的項目。WordPress足夠聰明,可以知道如果將某個項目帶到另一個項目中,則想將其旁邊。然後將它們嵌套將在前端創建一個下拉菜單。

004-Creating-a-Custom-WordPress-Menu-Structure

在下拉菜單中,根據需要對所有項目重複此操作。嵌套層次結構易於理解。每次在結構中創建一個新級別時,菜單都會具有一個附加的下拉菜單。

005-Creating-a-Custom-WordPress-Menu-Structure

在前端,它看起來類似於:

006-WordPress-Menu

現在,這些步驟假定您正在使用現有的菜單項。但是,如果您不希望將觸發下拉菜單的項目設置為可導航鏈接,則可以簡單地創建一個包含  而不是URL 的  自定義鏈接

007-WordPress-Menu

這樣做將創建一個菜單項,但是單擊它只會擴大下拉菜單。

如何在整個WordPress網站上使用多個菜單

回到前面討論的內容,我們要確保顯示的每個菜單都具有焦點。有時,大型菜單是網站導航的最佳選擇。例如,亞馬遜就是很好地利用大型菜單的網站的一個很好的例子。但是,大多數使用大型菜單的網站都不需要它們。它們不必要地使站點導航複雜化。

但是,如果您確實有一個大型站點並且可以將其分隔開,那麼在整個站點上使用多個菜單幾乎總是更好的選擇。用戶必須做出的選擇越少,意味著他們做出您希望他們做出選擇的可能性就越大。

現在,例如,假設您要創建一個僅出現在博客側邊欄中的菜單,以幫助引導用戶。我們可能會名稱的菜單有點像小號idebar的Widget來跟蹤它。但是,如果您查看「 顯示位置」或「 管理位置」選項卡,則可能沒有側邊欄選項。

009-Creating-a-Custom-WordPress-Menu-Structure-1

那只是意味著我們將不得不手動放置菜單。在WordPress儀錶板中,轉到「 外觀-小部件」,然後找到「  導航菜單」小部件。

008-WordPress-Menu

在大多數情況下,您的主題將具有通用的補充工具欄選項。該導航菜單控制項是默認使用WordPress。因此,無論您使用哪種主題,它都將起作用。但是,您的主題可能還包含菜單小部件的其他內容,並且基本步驟仍然適用。

像下拉菜單項一樣,單擊並將其拖動到「 邊欄」區域。由於小部件在WordPress中的工作方式,該小部件將立即顯示在您的網站上。但是,您尚未選擇要顯示的菜單,因此它將是空白。

009-WordPress-Menu

如果選擇  標題,它將顯示為菜單上方的標題。在選擇菜單選項是你選擇特定的菜單,你想顯示。您還可以單擊「  可見性」鏈接,然後打開上面看到的額外框。這個新框為您提供了條件可見性的選項。為此,我們可能只希望此菜單顯示在分類為Podcasts的帖子上  ,因此,當我們單擊  Save時,更改將保留。

010-WordPress-Menu

這就是他們的全部。您應該記住,您作為標題菜單的下拉菜單創建的所有內容都將在側邊欄小部件中顯示為嵌套菜單。因此,如果您使用#創建了任何佔位符URL,則它將是此菜單中不可點擊的鏈接。只需相應地計劃您的WordPress菜單創建。

總結WordPress菜單

WordPress菜單系統不必令人生畏。有時似乎還不清楚,但是如您所見,這是一個易於導航的過程,一旦您知道如何做就可以非常強大。但是請記住,當您繼續創建自己的網站導航時,菜單並非一帆風順。確保考慮到要在站點上找到哪些頁面並創建菜單系統以創建該體驗的用戶。並非每個頁面,帖子和鏈接都必須出現在同一菜單中。就WordPress菜單而言,少可肯定會更多。

相關文章