之前的兩篇文章Shopify主題的選擇競爭對手研究,可以幫你在確定使用哪款主題之前對自己的網站的功能需求有一個預期。在確定使用哪款主題之後,接下來就是主題的下載與安裝,也就是本篇文章要說明的問題。

圖片[1]-Shopify主題上傳安裝與更新教程 | 歪貓跨境 | WaimaoB2C-歪貓跨境 | WaimaoB2C

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

Shopify主題下載

Shopify官方的Themes主題市場目前(20191211)共有72款主題可供選擇,其中免費主題8款,付費主題64款。你可以在該頁面左側邊欄按照主題價格,產品數量多少,頁面佈局方式,以及產品頁面功能等等條件對主題進行篩選,也可以在右上角Sort按鈕按照主題的價格,受歡迎程度以及主題發佈時間對主題進行排序。
Shopify主題安裝與設置

點擊主題即可進入到主題的詳情頁面,在主題的詳情頁面,你可以切換查看該主題不同的風格樣式,點擊View Demo按鈕查看主題的演示站點。點擊Start with this theme (免費主題) / Try Theme (付費主題) 則可以直接將這個主題安裝到你的網站上。下方的Documentation按鈕則是該主題的使用說明書。Theme Features會簡單列舉該主題的主要功能,Reviews則是用戶對該款主題的評價。如下圖

Shopify模板安裝與設置

Shopify官方的所有主題都是在線直接安裝的,點擊Start with this theme (免費主題) / Try Theme (付費主題) 即可直接安裝該主題到你的Shopify網站,其中付費主題爲一次性付費,費用會直接從你Shopify網站綁定的信用卡里面扣除。

主題安裝之後不會自動啓用,頁面會自動跳轉到你的Shopify後臺 > Online Store > Themes 頁面。要啓用新安裝的主題,需要在MORE Themes一欄中,點擊主題對應的Actions按鈕,在下拉選項中選擇Publish按鈕就可以了。

Shopify模板安裝與設置

第三方的Shopify模板市場,Themeforest (https://themeforest.net/category/ecommerce/shopify) 是第一選擇,主題數量多,價格也便宜。趕上美國的節日,例如聖誕,元旦,黑五,有些主題也會有比較大的折扣。另外要注意的是在Themeforest上瀏覽購買主題之前,一定要看清楚你瀏覽購買的是否是Shopify的主題,不要買錯了。

在Themeforest上購買主題之後,在該主題的頁面就可以看到下載按鈕了,或者在登錄Themeforest賬戶之後在頁面 https://themeforest.net/downloads 查看並下載所有你買過的主題。

通常在第三方Shopify模板市場上購買的主題,下載下來的是壓縮文件,壓縮文件裏面會有和很多和該主題的相關文件,例如Documentation, Licensing等等等等不需要上傳的文件,因此首先需要解壓縮,找到裏面的需要上傳的主題文件,然後再打開Shopify後臺 > Online Store > Themes 頁面,找到Upload Theme按鈕點擊上傳。

Shopify模板安裝與設置

這裏要注意的是,上傳的文件必須是ZIP格式的壓縮文件,上傳文件最大50M,如果你的文件超過50M,建議先解壓縮你下載的文件,然後在解壓文件中再仔細查找甄別你下載的主題裏面哪個纔是真正需要上傳的模板文件。模板上傳成功之後,默認是未激活的狀態,需要點擊主題對應的Actions按鈕,在下拉選項中選擇Publish按鈕來發布主題。

通常出現的上傳模板文件出現錯誤的原因可能有:

  • 未解壓縮查找模板文件而是直接上傳的從Themeforest上下載下來的壓縮文件
  • 下載過程中因爲網速問題導致的文件不完整,出現上傳錯誤
  • 上傳過程中因爲網速問題導致的文件不完整,出現上傳錯誤

Shopify模板的安裝

在Shopify網站後臺模板管理頁面,主要有兩大板塊,一個是Current Theme, 一個是MORE Themes, Current theme就是你的Shopify網站當前使用的主題,Current Theme有且僅有一個主題。 More Themes是你安裝在Shopify後臺的,其他未啓用的Shopify店鋪主題。一個Shopify網站一次性最多安裝20個主題,即1個激活的主題和19個爲激活的主題。

每個Shopify模板在你的網站後臺都會有兩個功能按鈕,一個是Actions,一個是Customize。

Shopify Theme Actions

Actions按鈕的功能包括:

  • Preview: 在你的網站前臺預覽主題顯示效果
  • Publish: 激活該Shopify模板
  • Rename: 重命名該主題
  • Duplicate: 複製/備份主題
  • Download Theme File: 下載主題
  • Edit Code: 編輯該主題代碼
  • Edit Langulages: 編輯主題框架特定文字的語言或者顯示方式
  • Remove: 從Shopify後臺刪除該模板

這裏面,詳細解釋下下面的幾個Shopify模板的Action功能

Duplicate

點擊Duplicate按鈕之後,會在你的Shopify網站後臺生成一個該主題的副本文件,意即你Duplicate Brooklyn主題之後,在後臺會生成一個名叫Copy of Brooklyn的模板文件。Duplicate功能的使用目的通常是在你對你的Shopify網站進行排版,代碼修改之前,做一個當前模板的備份,如果出現問題,可以儘快激活備份的模板文件使你的網站恢復正常。

還有就是在做一些特定活動的時候可以使用Duplicate功能,例如我使用Duplicate功能對Brooklyn模板生成了3個Copy of Brooklyn模板文件,並將這三個Copy of Brooklyn文件重命名爲Brooklyn-NEWYEAR, Brooklyn-Christmas, Brooklyn-BlackFriday,分別對這三個主題進行編輯,在三個節日期間分別激活對應的模板,在平常激活Brooklyn主題。這樣可免於對模板樣式調整過來調整過去造成的麻煩。

Download Theme File

下載已經安裝到Shopify後臺的主題,可以幫你快速的複製你當前的Shopify網站樣式到新的Shopify網站,免於重新調整設置的麻煩。

Edit Code

所有對Shopify模板的代碼修改都是在這裏進行的。建議在修改代碼之前先使用Duplicate功能備份然後再進行修改,以免出現不必要的麻煩。

Edit Languages

修改的是你Shopify網站的語言以及框架的文字內容。一個Shopify網站的文字內容由兩個部分組成,一個是你可以在你的Shopify網站後臺直接添加修改的,例如產品標題,描述,價格,產品目錄名稱,博客內容,頁面內容等等等等,一個是你無法直接在Shopify網站後臺直接修改的,如購物車按鈕上的Add to Cart文字等等。

在Edit Languages可以幫你修改你的Shopify網站的語言,例如將英語改爲西班牙語。

Shopify模板安裝與設置
Shopify模板安裝與設置

也可以幫你修改網站框架的文字內容,例如購物車按鈕默認顯示的Add to Cart改爲全部大寫的ADD TO CART,或者BUY NOW

Shopify模板安裝與設置

Shopify Theme Customize

Shopify另外一個功能按鈕是Customize, 也就是Shopify網站各個頁面板塊的顯示佈局設置。

點擊Customize按鈕之後,網站會自動跳轉到網站前臺,並且在網站前臺會有一個左側邊欄,列舉了網站當前頁面各個板塊的功能設置。左側邊欄分爲兩個部分,一個是Sections功能,一個是Theme Settings功能。

Sections功能負責的主要是網站頁面的佈局以及各個板塊內容的設置。

Shopify模板安裝與設置

Theme Settings功能負責的是網站框架的顏色設置,字體設置,社交網絡設置,購物車頁面設置以及結款頁面的設置。

Shopify模板安裝與設置

目前大部分Shopify模板是支持Shopify的Section模塊功能的,在設置上所見即所得,也就是說你在左側邊欄做了哪些改動,在右側網站前臺視窗會做對應的改變。如下圖,將Newsletter板塊移動到Featured Collection上方,只需要用鼠標拖動左側邊欄的板塊名稱,右側網站前臺視窗就可以即時的顯示你所做的修改。

Shopify模板安裝與設置

左側的任意模塊都是可以點擊進去進行詳細設置的,要添加模塊,點擊Sections項下的Add Section按鈕,選擇要添加的板塊,點擊Add按鈕就可以了。然後對板塊拖動進行頁面的排序。

要刪除某個模塊,需要點擊去模塊,在該模塊的最下方找到Remove Section按鈕,然後點擊確認保存,就可以了

在右側的網站頁面視窗上方左側,爲頁面切換按鈕,下拉選擇不同的頁面,會在左側邊欄顯示不同的頁面模塊,然後對對應的頁面進行設置。網站前臺視窗的正上方三個按鈕分別顯示的是手機移動端的顯示效果,帶左側邊欄的顯示效果,以及不帶左側邊欄的全屏顯示效果。

Shopify模板安裝與設置

如果你在後臺安裝了多個主題,那麼Shopify各個主題之間的設置是相互獨立的,也就是說,你在設置好Brooklyn主題之後,安裝並激活新的主題,新主題就需要重新進行頁面排版,顏色字體的設置,而且對新的主題的設置不會影響到Brooklyn之前的設置,重新激活Brooklyn主題之後,顯示的還是安裝新主題之前的樣子。

關於詳細的主題設置,建議查看主題的使用說明文檔。

Shopify主題的更新

通常開放這會對主題定期進行更新,修復bug,添加新功能。Shopify官方的主題不會主動通知你主題的更新,在第三方主題網站如themeforest會主動的推送主題的更新通知到你的註冊郵箱裏面。

Shopify官方說明指出Shopify的主題不支持自動更新的原因就是Shopify的主題尤其是支持Section功能的主題,用戶對主題的個性化定製會隨着主題的更新而被覆蓋,因此需要用戶在有更新需求的時候,手動更新。

和Wordpress不同,Shopify的主題更新是一個相對比較麻煩的操作,相當於安裝了一個全新的主題,然後從頭到尾重新配置網站的所有設置。主題的更新不會影響到你的產品信息,頁面信息,只會影響到網站頁面的產品佈局,顏色設置,banner設置。

因此,在更新主題之前,需要首先備份當前的主題文件,就是上面說到的主題的Duplicate功能了,以防止更新主題的時候新的主題文件直接覆蓋當前的文件,導致之前的設置全部丟失。更新的主題安裝好之後,不用着急發佈,可以直接參照之前的主題設置重新對新主題進行customize設置,包括網站顏色搭配,網站首頁的佈局與內容,字體等等的設置。之前對主題代碼的設置也要重新調整到更新後的主題裏面。

全部設置好之後,再發布更新之後的主題,就可以了。

你可能感興趣的內容: