【 WordPress 入門】 9. 設置導航菜單

正在查看 2 個帖子:1-2 (共 2 個帖子)
  • 作者
    帖子
  • 小雨
    參與者
    • 文章數量: 13
    @xiaoyu
    樓主

    WordPress 3.0 添加了一個自定義導航菜單的功能,讓你可以很自由地設置網站的導航菜單。現在大多數的主題也都支持這個功能了,那麼,究竟該如何設置 WordPress 導航菜單?今天我就介紹一下。

    如何確定主題是否支持自定義菜單功能?

    啓用主題後,訪問後台 – 外觀 – 菜單,如果你看到下圖所示內容,説明主題不支持自定義菜單,反之,則支持:

    Wordpress建站教程入門 WordPress建站 WordPress教程

    自定義導航菜單

    在自定義菜單之前,你需要創建好所需的文章分類和頁面,請參考 《創建和管理文章分類》,下面進入正題。

    創建菜單

    打開後台 – 外觀 – 菜單,然後點擊頁面上的 「+」 按鈕,填寫一個菜單的名字 (可以是任意文字,只是用來識別罷了),然後點擊 「創建菜單」 。比如下圖我創建一個名為 「菜單」 的菜單:

    Wordpress建站教程入門 WordPress建站 WordPress教程

    注:有些新手朋友誤以為這裏添加的 「菜單」 就是一個單獨的鏈接,其實不是這樣的,這個 「菜單」 是一組鏈接,你可以給他添加 N 個鏈接,組成導航條。

    添加鏈接和設置菜單

    Wordpress建站教程入門 WordPress建站 WordPress教程

    ①從左邊選擇需要添加的鏈接 (自定義鏈接、頁面鏈接和分類鏈接),加入到菜單中去。 (自定義鏈接:允許你添加任何鏈接,比如你可以添加一個首頁,鏈接指向首頁網址即可)

    ②可以編輯每個菜單項目的信息,並用拖放的方式為其排序。將某個菜單項稍稍向右拖動,這個項目即變為子菜單 (低一格就是二級菜單,低兩格就是三級菜單,以此類推。前提是你的 WordPress 主題支持顯示子菜單哦),這樣您的菜單便有了層級關係。

    ③排好菜單以後,點擊 「保存菜單」 。

    ④然後為你設置的菜單選擇顯示的位置 (有些 WordPress 主題支持不同位置調用不同菜單,所以你可以設置不同的菜單,然後選擇顯示位置) 。

    菜單高級設置

    WordPress 菜單隱藏了一些功能,如果你想控制菜單更多的屬性,不妨點擊屏幕右上角的 「顯示選項」,讓隱藏的功能都顯示出來:

    Wordpress建站教程入門 WordPress建站 WordPress教程

    你可以選擇更多的菜單項目種類 (例如標籤和文章),還可以顯示菜單的高級屬性 (鏈接目標、 CSS 類、鏈接關係網、描述)

    Wordpress建站教程入門 WordPress建站 WordPress教程

    • 導航標籤 – 就是鏈接的文字
    • 標題屬性 – 就是 a 標籤的 title 屬性值,比如上圖填寫」WP 大學」
    • CSS 類 – 給某個菜單項添加 class,通過 css 是這個菜單項與眾不同,如上圖我添加了 「home-page」
    • 鏈接關係網 – 通過鏈接關係網 (XFN) 給菜單添加 rel 屬性,例如不想搜索引擎跟隨這個菜單,可以為其添加 rel=”nofllow” 屬性
    • 鏈接目標 – 控制菜單打開方式,在新窗口打開 (target=”_blank”) 或在當前窗口打開 (默認) 。

    以下代碼就是根據上圖的設置顯示的效果:

    • WordPress 大學

    好了,關於 WordPress 自定義導航菜單就介紹到這裏。

    殼殼蟲
    參與者
    • 文章數量: 330
    @kekechong

    沒錯,我就是——美貌與智慧並重,英雄與俠義的化身,存在的意義就是消滅零回覆!

    為什麼我會出現在這裏:

    1 、時間過長、此貼發佈時間太長,且未收到相關回復;

    2 、水貼、單純的發表見解,尚未收到相關回復;

    3 、不支持或未解決的問題,無法回應或未收到相關回復

    如有與之相關的問題,請發表新話題進行討論。

正在查看 2 個帖子:1-2 (共 2 個帖子)
  • 板塊 「教程存檔」 已關閉,不接受新話題和回覆。

話題信息

  • 當前位於:教程存檔
  • 1 條回覆
  • 2 個參與人
  • 最後回覆:<a href="https://bbs.weixiaoduo.com/users/kekechong/" title=" 查看殼殼蟲的個人資料" class="bbp-author-link"><span class="bbp-author-name"> 殼殼蟲</span></a>
  • 上次活動:<a href="https://bbs.weixiaoduo.com/topic/11602/#post-17389" title=" 回覆至:【 WordPress 入門】 9. 設置導航菜單">9 年、 3 月前</a>