一、功能效果

利用“欄目導(dǎo)航”模塊可以達(dá)到點擊左邊的欄目，頁面右邊出現(xiàn)相應(yīng)的內(nèi)容的效果。

點擊下圖可訪問示例網(wǎng)站測試效果。

二、功能說明

【版本】免費版及以上版本

三、設(shè)置教程

1. 新增欄目導(dǎo)航模塊

進(jìn)入電腦網(wǎng)站設(shè)計頁面，在左側(cè)導(dǎo)航欄點擊【模塊-新增模塊-基礎(chǔ)】，添加【欄目導(dǎo)航】模塊。

2. 新增欄目

在【欄目導(dǎo)航】模塊上新增欄目。（欄目類型選擇“默認(rèn)”，代表新增一個空白頁面）。

3. 完成模塊信息

如需展示公司電話、郵箱、地址等，則分別添加這三個信息的欄目并設(shè)置顯示。添加完成后點擊保存。

4. 設(shè)置版式

點擊頁面左側(cè)導(dǎo)航的【樣式-版式】，選擇顯示“區(qū)域1和區(qū)域2”，綠色則代表已選中顯示。

5. 加到指定欄目

首次添加了欄目導(dǎo)航到左側(cè)后，鼠標(biāo)右鍵欄目導(dǎo)航，選擇【加到指定欄目】，在彈窗中將要展示出來的欄目選中添加到右框欄目中。

注意：如果未設(shè)置欄目導(dǎo)航【加到指定欄目】，點擊任意欄目進(jìn)入的頁面顯示是空白的，沒有左側(cè)的欄目導(dǎo)航。

此時可返回添加【欄目導(dǎo)航】模塊的頁面，將【欄目導(dǎo)航】模塊右鍵點擊加到指定欄目（詳見步驟5）

或點擊左側(cè)【添加模塊】新增【欄目導(dǎo)航】模塊，并將已添加過的欄目設(shè)置顯示。

6. 為欄目導(dǎo)航添加內(nèi)容

點擊欄目導(dǎo)航中相應(yīng)的欄目，在頁面的右側(cè)添加想要展示的內(nèi)容。

（例如，頁面左側(cè)需要分別點擊“公司電話、公司郵箱、公司地址”，在這三個頁面的右側(cè)分別添加“文字模塊、文字模塊、在線地圖模塊”，即可實現(xiàn)點擊左側(cè)的標(biāo)題，右邊出現(xiàn)相應(yīng)內(nèi)容的效果。）

7. 完成效果

完成后的效果如下，點擊左側(cè)的標(biāo)題，右側(cè)能出現(xiàn)相應(yīng)內(nèi)容，您還可以給模塊設(shè)置好看的樣式和動畫，讓模塊與您的網(wǎng)站設(shè)計效果更加貼合。

四、常見問題

Q：為什么我點擊導(dǎo)航欄目進(jìn)入后右側(cè)沒有添加模塊的按鈕？

A：在右側(cè)導(dǎo)航點擊【樣式-版式】，再次勾選版式1和2即可。