如何在四個熱門主題中移動您的 WordPress 菜單

已發表: 2022-11-01

您是否正在嘗試將WordPress 菜單移動到新位置? 也許您想將它放在標題上方、標題下方或側邊欄中。 根據您的主題,您可以通過幾種不同的方式移動 WordPress 菜單。 在本文中,我們將向您展示如何在四個流行的 WordPress 主題中移動您的 WordPress 菜單。

如何在 WordPress 中拖放菜單?

要在 WordPress 中拖放菜單,首先單擊 WordPress 儀表板外觀部分中的“菜單”鏈接。 在“菜單”頁面上,您將看到為您的 WordPress 網站創建的所有菜單的列表。 在每個菜單的右側,都有一個“管理位置”鏈接。 單擊此鏈接可查看您要更改的菜單。
在“管理位置”頁面上,您將看到可以顯示 WordPress 站點菜單的所有位置的列表。 要更改菜單的順序,只需將它們拖放到所需的順序即可。 完成後,單擊“保存更改”按鈕。

Sajjad Hossain Sagor 發布了他的 Drag 插件的第一個版本,它允許您創建下拉菜單。 該插件使從導航菜單屏幕編輯和復制菜單項變得簡單。 當您移動菜單項時,每個現有項之間會出現一個下拉框。 子菜單結構相同。 喜歡使用 Gutenberg 插件將項目添加到菜單的拖放方法的用戶是一個不錯的選擇。 我認為這將是一個很好的接觸,可以作為現有組件添加到 WordPress 中。 將來很可能無法再訪問下拉菜單項。 新的導航屏幕最終將集成到 WordPress 的核心中。

如何向您的 WordPress 網站添加下拉菜單

如果要在主菜單中添加子菜單,則需要先添加一個新的子頁面。 以下步驟將帶您進入“添加新子頁面”對話框,您可以在其中選擇要創建的子菜單,輸入標題並保存。 要將下拉菜單添加到主菜單,首先將子頁面放在主菜單的右側。 為此,請導航到外觀並選擇要移動的子頁面。 從右側的主導航鏈接中選擇“下拉菜單”,然後再次單擊“主導航”以選擇下拉菜單。 通過按保存,您現在可以完成任務。

如何在 WordPress 中組織我的菜單?

照片由 – https://winningwp.com/after-installing-wordpress/

假設您想要有關如何組織 WordPress 菜單的提示:組織 WordPress 菜單的一種方法是嵌套項目。 這意味著您將有一個主菜單項,其下方有子菜單項。 這是保持菜單項井井有條且易於查找的好方法。 組織 WordPress 菜單的另一種方法是使用標籤。 標籤是對菜單項進行分類並使它們易於查找的好方法。 您可以按位置、食物類型或您能想到的任何其他標準來標記您的菜單項。 最後,您還可以使用搜索功能來查找菜單項。 搜索功能是查找特定菜單項或查找與您要查找的內容相似的菜單項的好方法。

頁面的組織方式必須使它們對您或組織來說是獨一無二的。 確保訪問者可以看到您最重要的常綠頁面,例如“關於”頁面或業務使命聲明。 通過單擊我的站點中的添加菜單按鈕,您可以自定義菜單。 要創建新菜單,請從菜單選項中選擇創建新菜單。 您可以根據您的受眾使用粗體或另類的短語或總體主題,以使您的菜單標籤脫穎而出。 您可以更改站點上菜單項的順序,使標籤準確地位於您想要的位置。 Tandem Trekking 是一個 WordPress.com 商業網站。

通過比較它們,您可以了解我們的計劃是什麼。 如果您使用的是我的站點,請導航到菜單並單擊重新排序以將菜單項從列表中移動或拖動到新位置。 有許多主題可讓您移動菜單並將它們顯示在不同的位置。 例如,Zuki 主題提供了三個自定義菜單:兩個在頂部,一個在底部,用於社交鏈接。

如何在 WordPress 中更改菜單樣式

要開始,請轉到外觀。 導航到菜單,然後單擊右上角的“屏幕選項”按鈕。 當您單擊它時,您將被帶到一個帶有“CSS 類”選項的下拉菜單。 您必須向下滾動要修改的菜單項,然後單擊擴展按鈕使其變大。

即使您的 WordPress 主題處理了導航菜單的外觀,也可以使用 CSS 來自定義它們。 在本文中,您將學習如何將 WordPress 導航菜單應用到您的網站。 因為第一種方法使用了插件,所以最適合沒有任何編碼經驗的初學者。 CSS Hero 使更改背景、排版、邊框、間距和其他元素變得簡單。 要使用此方法,您必須手動添加自定義 CSS。 其他 WordPress 生成的類也被添加到所有菜單和項目類型中。 您可以在這些類的幫助下自定義導航菜單。

在 WP 中,您還可以將自己的 CSS 類添加到各個菜單項。 您可以通過這種方式更改導航欄的樣式和菜單,也可以修改它們。 這是使用檢查工具確定您需要在瀏覽器中更改哪些類的最簡單和最快的方法。 如果您想為您的WordPress 導航菜單的第一項和最後一項添加自定義樣式,您可以在此處進行。 由於菜單的透明度,它與圖像融為一體。 考慮到這一點,您更有可能讓您的用戶採取行動。 您可以使用以下 CSS 代碼使粘性菜單在您的主題中可見。

主題的 functions.php 文件的代碼片段應包含在以下步驟中。 您需要為您的第一個和最後一個導航菜單項創建.first 和.last CSS 類。 您可以選擇使用哪個類來設置菜單項的樣式。 有關如何實現相同效果的更多信息,請參閱我們的 CSS 選擇器指南。

如何在自定義菜單中添加菜單項

要將菜單項添加到自定義菜單,請轉到外觀 > 菜單或自定義。 如果您有多個菜單,請使用列表選擇您要編輯的菜單。 如果選擇了按鈕,菜單項將轉換為按鈕。 如果您需要保存設置,請單擊保存菜單,然後繼續下一個任務。 添加菜單項後,轉到外觀 - 自定義 - 標題 - 主要 - 頂部 - 選項 - 正常,懸停或活動以更改菜單的顏色。 要更改站點背景的顏色,請導航至外觀 - 自定義 - 樣式 - 背景。

WordPress導航菜單CSS

在 WordPress 中,導航菜單通常是使用自定義菜單功能創建的。 此功能允許您創建包含頁面、類別和自定義鏈接的菜單。 然後,您可以將菜單分配到主題上的位置。 默認位置是主菜單和二級菜單。 要更改導航菜單,您需要訪問定制器。 在定制器中,您需要單擊“菜單”選項。 這將帶您進入菜單頁面,您可以在其中編輯菜單。

任何網站最重要的方面之一是導航菜單。 他們將通過適當的詳細信息引導您瀏覽該網站。 可以通過兩種不同的方式自定義導航菜單。 插件是獲取內容最方便的方法,而高級用戶可以使用 CSS。 以下是我們將介紹的兩種方法。 如果您有一個大型網站並且需要高帶寬和擴展性,VPS 託管是一個不錯的選擇。 您還可以通過打開 WordPress 主題的 CSS 文件並上傳代碼來手動添加導航。 我們基於 CSS 的WordPress 導航菜單指南的最後一步是使用 CSS 設置菜單樣式。

如何更改主題中的菜單樣式

要更改菜單樣式,您必須先打開功能。 為您的主題創建一個新的 php 文件並將以下行放入其中: Filter ('style_menu,'style_custom_menu');br> 然後,您必須將以下參數傳遞給 style_custom_menu(): *br 'CSS' 表示路徑到要修改的css文件; 此外,“br”代表文件名的路徑。 菜單項的標題是指項目標題的詞。 'Undertitle'——菜單項的標題; 出現在菜單項下方的代碼。 將用作菜單項圖標的圖像文件的路徑; 'icon' 是指圖像文件的路徑。 菜單項的位置; 它可以在頁面的右側找到。 “重量”是菜單項所需的重量。 “類型”是菜單項的類型。