Shopify 導航菜單設置 – Navigation 的添加和管理

Shopify 導航菜單 Navigation 是我們設置網站前臺頂部和底部導航菜單項目的基礎。同時 Shopify 的 Navigation也提供了一個鏈接重定向的內容。本節內容我們要做的就是把之前創建好的Collections和Pages以及Legal頁面添加到網站的前臺菜單中。另外要說的就是使用Shopify的URL Redirects生成我們自己網站的短鏈接服務。

最近 Shopify 在國內不太穩定，如果打不開 Shopify 官網, 或者打開速度很慢，無法註冊或者登錄 Shopify 賬戶，請使用“魔法”重試，你懂的。

Shopify 導航菜單設置

打開Shopify的後臺，在在線商店 Online Store – 導航 Navigation 頁面，打開Shopify導航設置頁面，如下圖。

Shopify系統默認生成了兩個菜單組，一個是Footer Menu，放到網站前臺頁面底部的菜單項目，一個是Main menu，放到網站頂部的菜單選項。如果有需要的話，點擊右上角的添加菜單鏈接 Add menu 可以創建其他菜單組比方說 Sidebar menu， 放到網站側邊欄。雖然名字寫的是Main menu，footer menu，但是其實我們可以不侷限於菜單名稱，在主題設置的時候是可以把Footer menu放到網站前臺頂部的，只不過方便管理，我們就一一對應的去設置就OK。

Shopify 網站頭部菜單設置

點擊Main menu，進入到頂部菜單項目添加和管理頁面。如下圖所示，我們可以修改標題 Title 以方便你的辨識管理。按照我自己的習慣，我會把 Main Menu 改成 Header Menu，來和 Footer Menu對應，方便其他業務在修改網站內容的時候理解。我們甚至是可以直接使用中文填寫在標題 Title 的位置，菜單的Title文本框內容只是我們自己內部管理方便，不會顯示在網站的前臺。

點擊菜單項 Menu items 板塊中的添加菜單項 Add menu item，可以給這個菜單項目中添加鏈接地址。通常我們要加在網站頂部的菜單爲網站的產品目錄，也就是我們在產品系列 Collection 中創建的項目，所以，直接點擊彈窗中的鏈接 Link，在下拉選項中選擇產品系列 Collections。

Shopify 如何創建下拉菜單或二級菜單

然後依次將我們在Collection中創建的產品分類添加到這個頁面就可以了。要在Shopify中創建下拉菜單，或者二級分類，只需要在下圖所示的菜單項目中，鼠標按住並拖動Collection名稱前面的6個點的圖標進行左右上下拖動，就可以實現下拉菜單的設置。

目前shopify最多支持三級下拉菜單，要支持更多級別的下拉菜單，可以搜索”Mega Menu”安裝相關應用來實現。

菜單設置好之後保存。打開網站前臺，就可以看到我們剛剛添加到Main Menu的菜單項目了。三級菜單顯示效果如下圖：

Shopify 菜單如何添加純文本菜單項

有時候，我們想要在菜單欄中添加不帶鏈接的純文本菜單項，點擊添加菜單項，在鏈接欄中輸入 “#”，名稱填寫你想要的菜單名稱，然後添加到菜單欄中就可以了。根據我們下圖所示的設置，在網站前臺，客戶點擊 Products 這一菜單項之後，會出現各個產品系列的菜單項，而不會有任何頁面的跳轉。

前臺顯示效果如下

Shopify 前臺不顯示菜單？

如果在後臺設置好了Main menu，但是在網站前臺的頂部還是看不到菜單，則需要仔細閱讀主題使用說明文檔，然後去主題自定義設置中進行相關操作，大部分主題會出現在 Header 設置中，如下圖，需要我們選擇要顯示在網站頂部的菜單組，我們之前設置好的菜單纔會出現在網站前臺。

主題自定義未選擇頭部菜單蘭之前的樣子

主題自定義選擇頭部菜單蘭之後的樣子

Shopify 網站底部菜單設置

和 Main menu 的操作流程一樣，我們需要把我們之前創建好的 Policies 政策頁面以及 Page 頁面中的 About us，Contact us等等頁面添加到網站的底部。如果網站底部只有一個菜單組，和頭部菜單設置流程基本一致。

如果網站底部有2個及以上菜單組，則需要我們在後臺創建新的菜單組來依次對應的加到底部菜單欄中。例如我使用的 Ella 主題，默認網站底部提供3個菜單組。我們可以通過主題自定義功能添加更多菜單組，或者刪除掉用不到的菜單組。

確定好菜單組的數量之後，下一步我們在 Shopify 後臺添加和設置對應的菜單組：

保存修改之後，有些主題會在網站的前臺底部可以直接看到我們新添加的菜單項目。同樣，如果你的網站前臺底部沒有看到任何變化，則說明你還要在網站的主題中進行進一步設置。如下圖，在頁腳選項中，我們需要把上一布添加的菜單組，一一對應的添加到網站底部。

Shopify URL Redirect 重定向功能

接下來說下Shopify的鏈接重定向URL Redirects功能。點擊上圖所示的查看 URL 重定向 URL Redirects 打開如下圖所示頁面。鏈接重定向的目的是將原來有但是現在失效的鏈接地址重定向到現在新的可以正常打開的鏈接地址。

比方說，你原來用的是Woocommerce搭建的獨立站，現在把網站系統換成了Shopify，那麼原來Woocommerce上面的產品信息遷移到Shopify上之後，需要將原來Woocommerce上原來的產品鏈接地址重定向到新的Shopify網站上對應產品的鏈接地址，那麼用URL Redirects就可以實現。

不過這裏的一個應用場景則是，使用URL Redirect生成我們Shopify網站自己的短鏈接服務，而不是用Bitly生成短鏈接。方法很簡單，在Redirect from輸入任意單詞，redirect from就可以看作我們自己製作的短鏈接。

如下圖所示，我在Redirect from中填寫了bfcm，我的網站域名爲shopify.waimaob2c.com, 則我的短鏈接地址爲 shopify.waimaob2c.com/bfcm， 當在瀏覽器中打開shopify.waimaob2c.com/bfcm，則頁面會自動跳轉到我們在Redirect to輸入的任何鏈接地址。而Redirect to填寫的鏈接地址通常就是我們要推廣的完整的產品鏈接地址。

URL 重定向批量操作

URL重定向設置頁面右上角的導入導出操作，可以幫我們使用 CSV 表格批量添加或者修改 URL 重定向規則。整個操作方法很簡單，Redirect from 是原鏈接地址，Redirect to 是新的鏈接地址。

Shopify 產品系列和搜索篩選器

Shopify 產品系列和搜索篩選器是顯示在產品系列列表頁面側邊欄，以及搜索結果頁面的篩選功能。默認有兩個篩選器，Availability 和 Price。點擊“添加”按鈕之後，會跳轉到 Shopify 應用市場安裝這個應用。不過應用評分比較低，而且如果想要刪除掉 Availability 和 Price，必須先安裝這個應用。刪除掉 Availability 和 Price，再卸載應用，Availability 和 Price 也不會被添加到後臺。

當然，我們如果用不到篩選器，也可以在主題自定義設置中直接隱藏篩選器，或者隱藏側邊欄，就不會看到這個篩選器了。

在產品列表頁面篩選器的顯示效果如下圖：