當我們的商城網站產品比較多的時候，為了讓用戶快速找到想要的分類，錨點定位已經不夠用了，我們就需要為商城網站添加產品分類導航。像京東商城這樣的產品分類導航，借助建站寶盒V9，毫無代碼基礎的情況下也能做。

在京東的產品分類導航中，主要分為左側主欄目大類，右側擴展二級欄目，再到詳細的類別分類三級欄目，右側還除了了品牌的廣告欄。對比建站寶盒V9模板網站的產品分類導航效果：

要做一個這樣的產品分類導航，其實很簡單。小耐今天給大家分享幾個簡單步驟，看一遍就能自己動手做！

操作過程：

1、添加模塊>產品模塊>產品分類，這里有很多風格可以選擇，小耐選擇第一種。

直接把模塊拖拽出來。大家拖出來的效果可能是只看到左側橙色部分，我們需要橫向和縱向拉伸，因為系統默認模塊是縮略顯示，需要拉伸后才能看到整體效果。

2、雙擊模塊，在屬性框中可以看到勾選的產品分類，這些就是要在分類導航中顯示的內容。

這里的設置需要在系統設置中的產品系統下進行。

比如想在手機數碼主欄目下添加一個新二級欄目：品牌手機。選擇添加產品>添加分類，設置一個“品牌手機”分類，并把上級分類選為最頂級的“手機/運營商/數碼”。

品牌手機欄目下若要新增多個品牌分類，選擇添加產品>添加分類，設置一個“華為”分類，并把上級分類選為最頂級的“品牌手機”。

這時候可以順便把產品的具體信息補充完整，都是直接上傳圖片、添加文字的簡單操作。

3、所有分類添加完成后，我們可以在產品管理>產品分類下查看我們已經設置好的欄目。

回到網站編輯頁面，可以發現產品分類已經自動展現了新增的內容。

4、這時候，如果不喜歡目前的展示風格，可以直接在屬性框中切換樣式，已經修改的產品分類不會改變。

5、下圖的橫向展示怎么設置呢？在屬性框中的類別屬性中開啟分類主菜單內容顯示，可以添加8個選項。

小耐新增了三個，可以對選項設置頁面跳轉。刷新頁面預覽即可看到效果。

6、右側滾動廣告欄怎么設置？同樣在屬性框的類別屬性中開啟右側廣告位。選擇自定義，自由上傳圖片，設置跳轉。

7、刷新后預覽即可顯示最終效果。

由于建站寶盒是H5響應式建站，在電腦站頁面設置了分類導航后，手機站無需重復設置，預覽手機站的時候我們會看到這樣一個按鈕：

點擊后就是手機展示效果啦！

有沒有很簡單？一遍不會，看多幾遍就能輕松設置啦！當然，有用戶會覺得這樣的設置還是有點麻煩，但和一個個代碼敲出來相比，這已經是對小白最友好的設置辦法了。想零基礎做出精美商城網站的，不妨試試建站寶盒V9。

免費體驗地址：http://m.alapot.com/special/v9special/index.php?s=yuqiuping

H5響應式建站寶盒V9線上發布會火熱報名中，全程免費還有互動大獎，想深入了解建站寶盒V9的你千萬不要錯過！報名：http://m.alapot.com/video/?s=yuqiuping