> For the complete documentation index, see [llms.txt](https://rakosell.gitbook.io/rakosell-tutorials-zh/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://rakosell.gitbook.io/rakosell-tutorials-zh/12-rakosell-dao-lan-lie-navbar-gong-neng-jie-shao-yu-ying-yong-zhi-nan.md).

# (12) Rakosell 導覽列 (Navbar) 功能介紹與應用指南

在網站設計中，導覽列 (Navbar) 是訪客快速瀏覽和探索網站內容的關鍵工具。Rakosell 提供靈活多樣的導覽列設定選項，讓創作者能輕鬆設計符合品牌風格的網站導覽，提升訪客體驗和轉化率。本文將介紹 Rakosell 導覽列的功能、應用方式及其好處，幫助您更好地設計和優化網站。

## 一、網站導覽的用處及重要性

導覽列是網站的重要組成部分，幫助訪客快速找到他們需要的內容或服務。良好的導覽列設計可以：

* **提高訪客留存率**：幫助訪客輕鬆找到所需資訊，提升使用者體驗。
* **增強網站結構清晰度**：良好的導覽列有助於網站內容的組織，使網站更具邏輯性。
* **提高 SEO 效果**：有條理的內部連結結構有助於搜索引擎的索引和排名，提升網站的可見度。

## 二、如何設定導覽列

<figure><img src="/files/T3VLaIS39a2T73roLWD2" alt=""><figcaption></figcaption></figure>

在 Rakosell 平台上，您可以輕鬆設定和自定義導覽列。步驟如下：

1. 進入網站後台管理。
2. 點擊「網站設定」->「導覽 Navbar 及頁尾」。
3. 根據需求新增或編輯內部連結、外部連結和選項單，並進行設計。

以下是 Rakosell 導覽列功能的詳細介紹：

## 三、Rakosell 導覽列支援的功能

**新增內部連結 (Internal Link)**

<figure><img src="/files/1eys0XjUid1rRFsEQzmW" alt=""><figcaption></figcaption></figure>

* **介紹**：內部連結可以連結到網站上的任何頁面，包括已上架的產品、課程、會員文章、網誌等。
* **用途與好處**：
  * **提升訪客體驗**：幫助訪客快速找到想要瀏覽的內容，提高網站的便利性。
  * **增強 SEO 效果**：內部連結有助於搜索引擎更好地索引網站頁面，提升網站排名。

**新增外部連結 (External Link)**

<figure><img src="/files/imF6vGK7Sv3NnapqgExa" alt=""><figcaption></figcaption></figure>

* **介紹**：外部連結可以將訪客導向其他網站，如社交媒體或相關資源。
* **用途與好處**：
  * **增加網站價值**：透過分享外部資源或合作夥伴頁面，增強網站的專業性和信賴度。
  * **擴大合作機會**：方便分享合作夥伴的內容，促進商業合作和互動。

**新增選項單 (Dropdown Menu)**

<figure><img src="/files/CKsebUjzL5x8L5DuIHSY" alt=""><figcaption></figcaption></figure>

* **介紹**：選項單可用於內部或外部連結的分類，幫助整理網站結構並展示多個選項。
* **用途與好處**：
  * **提高導覽靈活性**：讓訪客可以快速找到不同類別的內容或服務。
  * **增強網站組織感**：選項單能清楚呈現網站的主要分類和次分類，提升網站的專業性。

**Navbar 顏色變化**

<figure><img src="/files/8tFYs2BsJ3pCTWwIXwzc" alt=""><figcaption></figcaption></figure>

* **介紹**：您可以自定義導覽列顏色，系統自動根據顏色深淺調整文字顏色（深色背景使用白色字，淺色背景使用黑色字）。此外，Navbar 也可以設定為透明效果。
* **用途與好處**：
  * **彈性設計**：可以自由選擇顏色，使網站與品牌形象保持一致。
  * **增強視覺效果**：透明導覽列能夠創造出更具吸引力的設計，突出網站的背景圖或內容。

<div><figure><img src="/files/xMoptHZh1EaCdDavZ4C6" alt=""><figcaption></figcaption></figure> <figure><img src="/files/v6UyhcXxmdj04ThI3Jj4" alt=""><figcaption></figcaption></figure></div>

**更改字型**

<figure><img src="/files/xkW6kdA6DX5vKM3gvYtF" alt=""><figcaption></figcaption></figure>

* **介紹**：在「主題設定 -> 字體風格」中，您可以選擇多達 20 多種字型，讓您的網站更具個性化。
* **用途與好處**：
  * **統一品牌形象**：選擇與品牌風格一致的字型，提升網站的專業感。
  * **提升設計美感**：靈活的字型選擇讓網站設計更具吸引力，增強用戶體驗。

**個性化 Navbar 的進階設計**

<figure><img src="/files/OwVo5k3AaGOOmDBtMOZJ" alt=""><figcaption></figcaption></figure>

* **介紹**：如需更個性化的設計，您可以在「Advanced 客製化代碼」的 \<head> 區域使用 HTML 進行深度自訂。
* **用途與好處**：
  * **深度自訂**：創作者可依需求進行設計，實現獨特的網站外觀。
  * **滿足各類需求**：無論是特定風格的排版還是複雜的功能需求，都能通過客製化達成。

#### 四、總結

Rakosell 提供豐富且靈活的導覽列設計選項，不論是內部連結、外部連結還是選項單，都能滿足創作者的各種需求。透過靈活應用這些功能，您可以輕鬆打造符合品牌形象的網站導覽，提升訪客的瀏覽體驗。同時，透過自訂字型、顏色及透明效果，您可以讓網站設計更具吸引力。如果需要更多客製化選項，Rakosell 也提供了 HTML 編碼區域，讓您能創造出真正專屬的網站風格。

現在就開始使用 Rakosell 的導覽列設計工具，為您的網站增添更多價值和魅力吧！
