從零開始學習用兩個月建立 Shopify 跨境abe電商網站的實戰經驗,正在邁向進階的路上!透過不斷執行與測試整理出來的實戰筆記,無私分享資源,包含 Shopify Theme 版型精選、Shopify App 精選,內容會持續更新,為 Shopify 台灣在電子商務網站設計貢獻一點心力!實戰學習才會扎實,有問題就加入 Line 的 Shopify 學習社群,一起交流進步!(更新時間:2024/11/02)
「實戰經驗分享,非只是網路資料整理」- Irving 爾文
之前 Shopify 有一個教學影片:如何建立一個電商網站,片長不到 25 分鐘,步驟講解清楚,有點不可思議,但真的半小時就完成了!
從影片中會讓人以為就這麼簡單?是真的,但實際上老闆的需求或我們自己的需求就僅此於止?當然不。Shopify 平台本身預設的網頁客製化功能算是中高程度,雖然 WordPress 架站更客製化,但基本上 Shopify 還是遠勝於其他電商架站平台,且已經相當夠用於建立國際級的電商網站或不串接金物流的品牌網站,即使使用上有部分限制,但這可以用程式碼或 Shopify App 解決這個問題。
一來找工程師,但熟悉 Shopify 開發的工程師在台灣還是極少數,且對他們loloyal而言還要摸熟 Shopify 的版型語言 (Template Language):Liquid;二來對一般人來說就是使用資源豐富的 Shopify App 、無數免費和付費的 Shopify 版型,善用組合這些擴充功能就可以解決「客製化電商網站」的問題囉!詳情請繼續看下去!
嗨!我是爾文(Irving Chen),資深網頁設計師,先快速介紹一下自己的架站經驗,本人有多年使用 WordPress 架站與網頁設計的經驗,近年則專注 Shopify 電商網站設計與建置。對於這類架站平台的限制與可塑性有一定的了解,例如 Squarespace、Wix 後台真的限制超多,大部分的情況只能按照其版型去做編排,要做其他設定會相當困難而痛苦;WordPress 則是彈性度超高,可以在後台來去自如、修改頁面程式碼、使用海量的版型和外掛資源為網站打造全方位數位能力。若有網站相關問題,可以前往填寫表單留下訊息或需求給我,我會盡快回覆!
若是 WordPress 版型架站建議盡量使用原本版型預設的功能,而不建議過於改造原本版型的程式碼,影響其日後更新,除非未來版型不想再透過官方更新了;而 Shopify 版型其實不用更新過於頻繁,更新時也會牽動到很多原版安裝好的 Shopify App 程式碼等,轉移時相當麻煩,個人是認為除非版型升級會有重大的進步,否則兩三年以上升級一次是絕對 OK 的。
若版型未來都不更新而自行客製化大改造或許還可以,但 WordPress Plugin 和 Shopify App 的核心程式碼則不太可能去動,這些外掛的開發商都會持續更新,若真的有想法回饋直接聯繫開發商請他們優化與打造新功能囉!只是單純寫些 CSS 設計樣式,更新後出問題還比較容易解決,但別直接更改運算邏輯,例如寫 JavaScript 擅改該外掛的核心程式碼。
擴充功能在 WordPress 稱為 Plugin,在 Shopify 稱為 App,WordPress Plugin 基本上類似 Shopify App)
至於 Shopify 的後台客製化編輯程度就介於 WordPress 和 Wix 之間,對於網站剛入門者會稍微輕鬆一些,亦即 Shopify、Wix、Squarespace 等這類架站會感覺建立網站「好像」不是很困難的事,會讓人寸步難行的是若想要隨心所欲進行網頁排版或想要寫個簡單的 CSS 或 Javascript 語法等等,限制多多。WordPress 雖然真的也很適合一般沒有程式背景零經驗的人學習,但實際上遇到很多客戶使用起來他們還是覺得很痛苦、小複雜,要記住很多設定,只能說要大量去摸熟後台操作邏輯,才能跨過心中那個門檻囉!
開始免費試用 Shopify 建立電商網站,可享精選方案優惠,每月只要 $1,為期 3 個月,手刀前往立即註冊
這是 Shopify 官方目前正在跑的優惠活動,不知何時會結束,若試用後不想用,也可以隨時取消訂閱
若有網站設計與建置的需求,歡迎填寫表單,與 Irving 爾文深度諮詢與討論!
網站架站平台客製化程度(由高至低)
- WordPress:客製化程度極高,有海量的版型、外掛、教學資源 ,全方位架站從部落格、形象網站到電商網站,全都包起來!初學者到進階使用者、開發者、網頁設計師都可以盡情使用,打造方寸的個人化設計與功能,但也因為可以客製化的程度非常高,了解後續維護的難易度,再加上 WordPress 主程式本身、版型和外掛本身的相容性、與更新後產生的問題都是維護此網站需要費點心力的地方。PS. 這裡指的是 WordPress.org 而不是 WordPress.com
- Shopify :客製化程度中等,以架設電商網站為主,重點在於電商的安全性與開方式生態系的擴充功能,程式碼編輯和版型備份容易上手,Shopify App 滿多需要訂閱付費的(部分功能可以先用免費版也不錯),整體的介面也比 WordPress 少一點複雜,畢竟有相當的限制。對一般人、設計師、工程師都很友善,全部一起合作使用沒問題的。可以確定的是 Shopify 目前是要將產品賣到國外的唯一首選跨境電商平台,且全球市占率和使用者滿意度目前皆為第一(如下圖所示)
- Webflow:如果不使用 WordPress 或 Shopify,我還真不知道該找哪一個架站平台作為長久經營的網站,最近我開始測試 Webflow 之後,真心覺得 Webflow 對「網站初學者」、「想轉網頁的平面設計師」不友善,頁面編輯器琳瑯滿目、密密麻麻的設定選項,看了眼花撩亂,尤其選取任意元素時所顯示「詳細徹底」的「視覺化 CSS 欄位」直接讓人退避三舍。Webflow 常常拿「動態特效的網頁 Demo」來大肆宣傳,我自己也被吸進去,但還好有免費方案可以實際測試,確認不會想繼
- 續使用。單純 PK 頁面編輯器(Page Builder),WordPress 和 Shopify 的選擇都超過 10 種以上任君挑選,而 Webflow 就一種,沒得選。
- 即使像我非常熟悉 HTML/CSS 和擁有數年的架站平台使用經驗,我還是不會想將 Webflow 作為「主力」,若真的要用一下下,或許可以當作助力行銷宣傳頁面用途。結論:可以 100% 確定的是若要經營電商網站販售商品或經營部落格內容 SEO,都完全不推薦!
- Squarespace、Wix、Weebly 客製化程度極低,基本上選好版型後就不用有過多的期待,若要長期經營部落格 SEO 或電商線上銷售也不建議。即使他們有提供付費版升級功能,也很難跟 WordPress 和 Shopify 並駕齊驅。且即使我拿 WordPress.com(非 WordPress.org)最便宜的兩個方案月費都比 Squarespace 和 Wix 最基本的方案還便宜 2-3 倍以上,紀錄時間是 2024/03/16,當然,他們是也有提供最基本頁面範本,若想簡單用一用也是可以的。但若真的對於品牌設計或 SEO 內容經營有相當的要求、對於網站想要長久經營且不斷持續可以優化的話,我是不會使用這些平台作為主力的。
以上平台都是相互比較而言,或許你在使用某個架站平台就覺得算滿足需求了,那就 ok 沒問題!因為真的端看人力、技術、資源、時間、成本而定,選出現階段最適合自己的方式。
爾文選擇:若以我的角度來執行,品牌形象網站、部落格主要用 WordPress,電商網站用 Shopify,僅供參考之。
Shopify 跟 WordPress 一樣有很多外掛可以使用,而他們兩者在外掛最大的差異是:WordPress 外掛免費版真的是超多,且很多不用到付費版就可以完成需求,可以參考我寫的另外一篇文章:WordPress 外掛推薦精選;Shopify App 也不少,但大部分滿足需求的功能都要付費,而且幾乎沒看過一次性購買,而是訂閱費為主(通常是每月付款)。
注意事項:很多在門外觀望的使用者,其實不知道無論是 WordPress 或 Shopify 的版型或外掛皆琳瑯滿目、五花八門,而我們要了解商業世界中的行銷語言:每個都說自己的功能多強、評價多高,但,等你真的去安裝使用後會陸續發現「意想不到」的問題需要解決,而且很有可能一個問題會帶出更多的問題,並沒有想像得輕鬆!終究還是需要親自去測試與修正,找出最佳組合才能讓網站順暢運作。
下方投影片是我在 2022 年一場 Shopify Meetup 小聚分享的內容,概要簡介「Shopify 網站如何客製化設計」,我著重在「設計」而非只是「網站建立」而已,若想要另外了解如何更自由地進行網頁排版與配置(Shopify 平台本身在這個設定上的預設功能相當陽春),可以參考此篇:如何打造 Shopify 電商網站客製化設計排版
Irving 爾文的實戰分享 Shopify Meetup 2022 – Irvinglab 爾文實驗室Shopify Markets 國際商務未來趨勢
說明:根據官方網頁 Shopify Markets 的說明,您的全球版圖,我的商家標配。有了 Shopify Markets,只需單一商店,就能輕鬆上線暢銷全球客群。可以觀看一下 Shopify CEO 的專訪新聞,在這我先簡單整理出頁面說的幾大功能:
- 為您備妥全球銷售一切所需:Shopify Markets 能為大小商家簡化全球拓展作業,讓事業成長易如反掌,也不增加工作負擔。
- 依市場需求打造購買體驗:提供消費者熟悉的購買體驗,讓國際顧客能更輕鬆地瀏覽與購買商品,使您在每個市場都能更快成交。
- 幣別多元:將您的標價換算成超過 133 種當地幣別,方便國際顧客購物。
- 語言無礙:翻譯商店內容,為國際顧客提供自在輕鬆的購物體驗。
- 網域有別:以相關的語言和幣別向世界各地的顧客展示商品。
- 稅款透明:結帳時自動計算進口費用,讓顧客清楚瞭解總金額,不會在配送期間才發現需支付額外費用。
- 付款方式便捷可靠:讓顧客使用熟悉且直接安全的方式付款。
- 進軍全球,行銷有據:我們的數據導向式設定,能自動提升轉換,創造更完善的顧客體驗,快速最佳化您的國際策略。
Shopify 每年都有好幾波大更新:Shopify Editions | Winter ’24 ,相當精彩很令人期待!回顧之前 Shopify Editions | Summer ’23 – 深度擁抱 AI、 Shopify Editions | Summer ’22
有任何想問的問題,歡迎填寫表單留言或寄信給我 irving@irvinglab.com、FB 粉絲團或直接線上交談,我們一起交流、成長!附上我的網頁設計作品,可以來逛逛喔!歡迎加入 Shopify 網站設計與架站學習交流:Line 社群 一起交流與學習!但在美國的用戶無法加入台灣的 Line 社群,所以我也另外建立了 Telegram 社群,兩邊珍貴的經驗會同步分享與整理,或加入專接收資訊非討論的 WhatsApp 頻道。若想進一步了解服務內容,可以加入 Irvinglab 爾文實驗室的 Line@ 官方帳號留下訊息給我們。
進入本文重點,用 Shopify 打造電商網站是我幾年前剛進公司得到的任務,那時完全沒用過 Shopify,很多時候會在其後台尋找 WordPress 的影子,進而發現以往隨心所欲打造網頁的自由度不復存在,意思是被限制在極少的設定選項,無法任意新增區塊和任意排版。
因此,為了解決這個問題,我開始深入了解 Shopify 的運作邏輯,起初以為應該就是簡易版的 WordPress 應該很好上手,結果想要的都沒有 XD!
首先,老闆預期上線的時間點是四月六日(原預計是四月一日,但該週適逢清明連假,所以網站上線就沒人在上班了其實不太妙,所以上線日期最好在平日時間中間左右,盡量不要在上線隔日就放假的時間點),根據以往打造網站的經驗,兩三個月差不多也是架設中小型網站的時間,於是我規劃了 Shopify 網站進度時程表如下圖:
需注意的是,其實時間是滿緊湊了,但因為我們公司原本就有一個用 WordPress 架設的網站,只是今年要改成 Shopify 平台,內容上原本就有了,所以至少可以減少兩三週的文案撰寫和「網頁視覺設計」的時間,亦即按照正常的時程,至少三個月會較理想。備註:進度表中紅色的數字代表放假,但卻有底色,原因就是我有加班囉(至少九天吧!)
今年我正陸續籌劃錄製 Shopify 一些相關的實作教學影片,若你希望第一個收到通知,可以在下方訂閱 Irving 爾文實驗室的電子報
快速入門 Shopify 架站
我安排自己用一週的時間從零快速了解 Shopify 後台操作、研究版型設定、Shopify App 設定等,接下來就是邊做邊學、遇到問題邊找答案解決。看似平凡的旅程卻充滿各式各樣的問題襲來,還好,最後都能一一克服與舉一反三。後來經過無數專案的執行,我整理歸納出的網站設計流程與排程,可以參考此篇 Shopify 網站設計流程與時間規劃。以下列出我當時兩個月來威猛使勁地學習方法與資源分享:
那年 2020 年除了使用公司已付費版的,我也自己用帳號申請一個 Shopify 帳號進行免費試用,最多 14 天,客服就不讓我繼續延期 XD,所以我個人後來自掏腰包購買 Basic Shopify 方案,每個月 29 塊美金,一年大約一萬多塊台幣,為了學習,這點錢是滿值得的!
到了 2022 還是 2023 年開始,Shopify 的定價有變更,Basic 方案改為每個月 19 塊美金, 且無須提供信用卡資料,免費試用 Shopify 3 天,更棒的事開始方案後,前三個月每個月只要 1 塊美金,三個月過後也才 3 塊美金!真是佛心來著,可以好好試用一下,學習與了解後台的時間是滿充足的!
對了,有個很重要的事情需要先說明,就是選擇網域建議到全球最大最主流的 GoDaddy 平台購買,然後再串接到 Shopify,設定速度超快。因為 Shopify 平台本身就有與 GoDaddy 整合,若是在其他平台購買網域的大部分都需要設定 DNS 什麼的,挺麻煩!有些人也會卻步。然後也不建議直接在 Shopify 平台本身購買網域,之後若要遷移網站或不想使用 Shopify 時,網域會被綁定在平台中。所以網域和架站平台分開單獨選擇比較理想。若有網域選擇障礙或相關問題也歡迎寄信給我或透過社群或網站右下角的對話視窗傳訊息給我。
開始免費試用 Shopify 建立電商網站,可享精選方案優惠,每月只要 $1,為期 3 個月,手刀前往立即註冊
這是 Shopify 官方目前正在跑的優惠活動,不知何時會結束,若試用後不想用,也可以隨時取消訂閱
若有網站設計與建置的需求,歡迎填寫表單,與 Irving 爾文深度諮詢與討論!
為何不直接用公司的 Shopify 網站來操作?因為架設過 WordPress 網站的人都會遇到的問題就是安裝了某些外掛後結果網站爆掉 GG,可能是與版型衝突、也可能是外掛之間的衝突,所以要測試網站最好還是建立一個「測試站」來使用比較安全,不太好直接拿公司的囉!
而且不斷安裝和移除各式各樣的 Shopify App 會造成一些問題,例如若沒有妥善移除會造成殘留程式碼或檔案,造成網頁破版。有些 App 會需要「額外的步驟」才能「完整移除」,詳見文中下半部的常見問題。
兵貴神速!前往註冊 Shopify 免費試用!
Shopify 方案中,選擇付款週期越長,省越多
Shopify 的付費模式:一次選擇付款週期越長(單位:年)就省越多。著實應可吸引使用者選購並提高黏著度。圖中是:選擇 $79/month 方案,然後選擇每年付款可以省 $96 美金。
在去 Google 答案之前,先進入 Shopify 後台繞一圈,大致有個印象每個設定的位置、每個項目點進去看看,會出現哪些選項,這個階段不用每個都徹底了解。再加上 Shopify 的 Onboarding 引導初學者流程也是做得不錯的,「讓人覺得好簡單」,進入後台首先印入眼簾的是三個步驟:Add product、Customize theme、Add domain,「咦?根本幾乎完成就可以開賣了?!」也沒那麼快啦,電商除了網站之外,還需要設定金流和物流,這兩項之後需要再設定。
目前 Shopify 管理員後台已有繁體中文版可使用,連官方文件也有提供,在查找資料相當清楚。而除非消費者是中文世界為主的台灣或其他國家,不然若是面向國際還是都用英文版,讓自己時時刻刻了解每個英文用字遣詞的方式。Shopify App Store 儘管有提供中文版,但只有局部翻譯,且大部分的 App 開發者都是用英文撰寫內容,所以改成中文版也沒什麼特別意義。
瀏覽 Shopify 官方文件與幫助中心(當字典翻)
其實你也可以三不五時回來我這篇文章查閱,當字典翻 ^^ 我這幾年來持續三不五時更新此篇文章內容
Shopify Blog
簡介:A blog about eCommerce marketing, running an online business and updates to Shopify’s eCommerce community.
說明:官方部落格除了提供很多 Shopify 平台的更新資訊,還有電商經營方法與數位行銷觀念、創業家故事等,可以在學習之餘慢慢積累產業知識,扎實地建立自己的思維模式。
連結:前往瀏覽
Shopify Help Center
簡介:Shopify 說明中心將協助您瞭解及使用 Shopify。我們備有文件和影片以回答您的問題。
說明:裡面的文件都有中文翻譯,可以將文件掃描一下,大致上都能解決後台操作所遇到的問題,例如說網域如何設定、如何新增產品等。我沒有全部當書本來啃,而是在實際操作過程中有問題時才會來當字典翻,滿實用的!
連結:前往瀏覽
Shopify Help Center — YouTube
說明:官方的 Shopify 操作介面設定影片教學,有很多時候基本的操作介面都可以在上面找到解答,非常清楚易懂。
連結:前往瀏覽(英文版),近期剛推出新的繁體中文 YouTube 頻道,但目前影片數還很少,未來應該會陸續增加。
Shopify Community
簡介:Access a community of over 600,000 Shopify Merchants and Partners and engage in meaningful conversations with your peers.
說明:網站架設過程中會有很多問題在社群上討論,所以可以先去社群搜尋,瀏覽過所有討論串後,可以快速過濾並找到比較適合的方法。例如:想了解 Shopify 的 SEO 如何執行,畢竟每個架站平台本身都有其限制,在去 Google 搜尋之前,可以先在 Shopify Community 搜尋 SEO 相關問題,更有效率地大量吸收可能會遇到的問題。
連結:前往瀏覽
關於 Shpoify SEO 的實際執行方式,前往閱讀我剛出爐的文章:Shopify SEO App 推薦:Yoast SEO 實戰教學
如果是想要多了解 Shopify 程式語言 Liquid 的話,可以閱覽 Shpoify Partners 的官方部落格:Learning Liquid、YouTube 頻道:ShopifyDevs、Shopify 官方 Liquid 文件、Shopify Liquid GitHub,或直接瀏覽 Shopify Open Source Software Projects(這資源有夠棒的!)
若英文太多看了眼花也可以參考簡中版的 Shopify 部落格,需要的話可在瀏覽器空白處按右鍵可以改成繁中文字,文中有 Shopify 的 WeChat 官方微信公眾號 QRcode 掃描加入,還有 Podcast 節目:Shopify 跨境电商大家谈 聽聽看!感覺內容也挺豐富的!
線上客服是即時解答的盟友
Shopify 幫助中心 — Support channel
簡介:Contact Shopify Support by chat, email, or phone.
說明:英文版的支援中心比較多,有四種,如下圖所示。可以透過直接線上文字對談、電話對談、電子郵件和 Twitter 訊息提出問題。管道算是相當多元,幾乎不怕找不到他們。
連結:前往瀏覽
但線上客服最在意的還是「客服回應的即時度」,排除要講英文的電話、感覺就是要等待的 Email,以及步驟稍多且訊息似乎無法保存在一個地方的線上文字交談 Chat,我選擇了 Twitter 這個社群管道,我原本就有一個 Twitter 帳號,偶爾就會用一下,現在剛好可拿來與 Shopify 直接聊聊。
Shopify Support on Twitter
線上客服中,我最愛也是主要使用的是 Shopify Support @Twitter 社群管道,透過 Twitter 傳遞訊息跟他們直接線上聊將開來,他們每天每個時段會有不同的客服回應我提出的問題,而且幾乎是有問必答,通常是數分鐘到數十分內就會收到回應,速度算快了,很容易得到解答;若有他們回答不出的問題,例如問了程式碼編輯的問題就超出他們客服能回應的範疇,他們會直說。
我在學習操作 Shopify 架站的過程中,應該有一半以上的時間都是靠著跟他們「在 Twitter 開聊天室」迅速得到答案和很多額外的資源如他們時常提供文章網址連結、影片連結等。Shopify Support 也有自己的 Linkpop 頁面,網址:https://linkpop.com/shopifysupport,可以快速連結其相關資訊:如 Contact support、Check our status page 等,相當便利,就不用每次都要到官網翻找或是 Google(雖然 Google 關鍵字也滿方便的 ^^)
備註:Linkpop 為 Shopify 官方自己推出的 Social Bio 一頁式網頁,通常可放在如 IG、Twitter 等社群媒體的簡介中
Shopify 幫助中心的 AI 助理(Shopify Help Center Assistant)
隨著 2023 年 OpenAI 推出的 ChatGPT 使得 AI 應用大爆發,在全世界廣泛的被應用在各種商業服務中,順勢而為,Shopify 在 Help Center 網頁中新增這個 AI 助理,可以隨時回答使用者的任何問題,勢必能大大降低他們客服人員的負擔了吧 ^^
Shopify Help Center 英文版:https://help.shopify.com/en
以後有問題可以狂問且客服回覆速度更加快速了?!實測發現其實還是跟真人回覆的有些差異,所以真人客服和 AI 客服就同時使用,互補有無!目前英文版網頁有推出,中文還沒有,所以若要使用的話,可以去英文版,然後不用擔心,因為輸入中文也可通!例如問了個問題:Shopify 2023 年推出的新功能 Metaobjects 還不能在後台簡單的直接輸出,只能先使用 Shopify 的 Metaobject API 才行(Shopify AI 助理回覆),這功能我其實也在觀望中,剛推出想說先暫時不使用得太深,等其持續優化並更成熟後再看看
線上雇用 Shopify 專家(Hire trusted experts)
網路上已經有很多雇用專家、找專家這類的平台服務,海內外都有很多。Shopify 自己也有提供專家媒合的平台,有分六大類:Marketing and sales、Store setup、Development and troubleshooting、Visual content and branding、Content writing、Expert guidance 等,選擇需要專家幫助的類別,而且若你真的是英文苦手,也可以透過篩選器選則有提供中文服務的專家進行洽談,這些專家我發現有個人的、也有開公司的,可以參考看看。當然,也歡迎與我聊聊 ^^ 前往填寫表單~
我自己還沒用到 Shopify 官方提供的專家服務,或許未來有更重大的需求或困難會考慮使用。而關於這個,我是有用過另外一個成立於美國的外包平台 Upwork,當時需要的小功能是將 Shopify 的產品頁的縮圖區顯示方式改成 Slider(我們選的免費版型預設是沒有水平方向的 Slider),於是找了一位熟悉 Shopify 開發的印度工程師,過程滿順暢的。溝通方式是透過平台內的交談工具,在電腦上和手機上安裝 Upwork App 隨時可以聯繫,對方還會截圖講解與詳細列出設定的步驟,但是但是,這樣程式碼客製化的結果造成一個很麻煩的問題:我們交接之後很難維護,而且對方給的設定步驟看似詳細,其實還是相當麻煩,繁瑣的程序造成內部團隊直接移除不用,改採用 Shopify App 比較實在(例如產品輪播圖 Slider Product Image Gallery & Zoom 或 GG Product Page Slider&Gallery by Gigilabs),不僅功能設定更多、執行效率提高,且交接時順暢至極!所以哎,若真的某個大功能重要到非得請工程師打造,不然很多小功能或樣式設計其實可先以找 Shopify App 為主要解決方案,然後請網頁設計師寫 CSS 局部修改即可,大幅降低未來更新的問題。
我也時常在 Irvinglab 爾文實驗室的 Twitter、Instagram 和 Facebook 分享大量的相關 Shopify 網頁設計實作經驗或相關資訊等,歡迎追蹤 ^^
Shopify 網站在運作時遇到問題了,該怎麼辦?
試著回想一下問題發生前後這段期間,在網站後台做了什麼事?任何事情逐一清查,並用刪去法逐一排除。除了詢問 Shopify 官方的 Support 團隊之外,可先自己進行 Debug 的過程:
- 以前沒發生問題,最近才發生此問題?如果是,那表示很有可能在後來的某段期間有人在網站中「做了什麼事」導致問題發生。
- 網站後台設定有幾個人以上在使用?還是只有您一人使用?若兩人以上同時在使用,那是否先跟其他共同使用者詢問並了解他們有沒有在網站中做了什麼設定?
- 最近有沒有直接動過程式碼?程式碼設定在哪裡、哪些頁面?在編輯 Shopify 網頁程式碼時有可能先後順序設置或漏掉了一兩個程式碼就會導致問題產生。
- 「該功能」是使用哪個 APP 設定的?有沒有回報該 APP 開發公司此問題?他們怎麼回應?能否提供技術支援?
- 該功能是如何設定的?是不是少設定了什麼?
- 有沒有安裝類似功能的 APP?版型使用哪一個?APP 與版型或 APP 與 APP 之間他們或可能相互衝突?
- Shopify APP 一般都會自動更新,問題發生期間是不是該功能的 APP 更新了?更新的項目是什麼?有沒有可能就是主因?其他 APP 有沒有自動更新?若有,若前面所述都沒發現異樣,那逐一檢視網站所安裝的每個 Shopify APP,看是不是哪個導致的?
- ……(不定時補充 Debug 的思考過程)
若真的還是找不到,那加入 Line 社群 一起交流與學習吧!
在 Udemy 購買 Shopify 架站基礎的線上課程
對於數位軟體學習莫過於直接找幾門線上課程來上,有實際的操作畫面完全高效率看清楚每個動作的步驟,且又是終生觀看,於是我在 Udmey 挑選了兩門 Shopify 架站的基礎課程(真的是超基礎的),幫助我「了解 Shopify 的簡易操作和 Shopify App 生態系」
但下列兩項 Udemy 課程內容太基礎了,所以不是真的非買不可,直接註冊 Shopify 帳號搭配此篇文章開始摸索學習會比較實際!
課程 1:How to become a Shopify Expert (from zero to hero)
費用:新台幣 $600(當時買的價格)
心得:內容滿淺的,講解很多基本概念和操作方式,很適合初入門,有推薦一些常用的 Shopify App 幫助網上銷售,整理出購買版型和 App 的小訣竅。
課程 2:Shopify Power: Build An Ecommerce Website Using Shopify
費用:新台幣 $600(當時買的價格)
心得:內容是給初學者的,有大量介紹實用的 Shopify App,清單超長可以搜集,並一一試用篩選過濾。
另外官方其實也有出教學,主題滿豐富的,但必須先註冊 Shopify 帳號後才能進入瀏覽。
官方免費課程:Shopify Academy(Shopify Education)
若是英文苦手,也可以瀏覽 2020 年底聖誕節那週新上線的中國 Shopify 大學,需註冊 WeChat 或手機帳號才能登入。
Line 社群(台灣)
歡迎加入 Shopify 網站設計與架站學習交流:Line 社群 一起交流與學習!但在美國的用戶無法加入 Line 社群,所以我也另外建立了 Telegram 社群,兩邊珍貴的經驗會同步分享與整理。有任何關於 Shopify 網站設計與建立的問題都可以在社群中發問,而有些問題則已經很多人發問過了,例如金流,所以加入社群後,可以搜索關鍵字「金流」,快速瀏覽其他人曾經提出的想法與經驗分享,幫助你判斷時的依據。
Learn With Shopify
說明:直接觀看 Shopify 官方 YouTube 影片頻道:Learn With Shopify,主題分類相當廣,除了建立電商網站之外,還有其他有關電商經營策略和行銷方法等,相當多元。播放清單有:Build A Shopify Store、Product Ideas、Business Ideas、Opeartions and Logistics、Marketing、Business Strategy、Build A Brand
What’s New at Shopify?
說明:看一個平台是否在更新、進步和維護,才能讓使用者安心是否可以長期使用與投資時間在其上面,看它有沒有「公開展示」更新的資訊就能探知一二,Shoipfy 在 Chnagelog 頁中不斷新增關於優化的部分與新增的功能特色列表,相當清楚,對於熟手而言還可以隨時知道有什麼新的功能可以使用,頁面右邊還有資訊所屬分類可以篩選,進去瀏覽看看吧!前往:What’s New at Shopify
兩大 Shopify 資源庫(逛街採購時間)
Shopify Theme(選擇網站版型)
簡介:Ecommerce Website Templates — Free and Premium Themes for Your Online Store.
說明:版型設計算是不錯看了!選擇性真的滿多的,除了提供基本功能與排版的免費版型外,付費版型提供更多樣的設計樣式,普遍來看平均落在 $180 美金上下(實務上來說,我不會選擇免費版型,因為功能太陽春了!版型是一次性付費的,所以選購一款版型是值得的)
連結:前往瀏覽
Shopify Themes and Templates – ThemeForest(選擇網站版型)
簡介:還有一個相當推薦的平台 Themeforest,瀏覽其所擁有的 Shpoify 付費版型:Themeforest — Shopify Themes,非常推薦在這裡選購,因為其版型所提供的功能和排版功能相比官方來說顯得更具客製化與彈性,之後打算陸續選購幾個深入研究!(後面有精選清單,請繼續往下看下去)
購買 Shopify 版型前需要知道的事
無論是在官方的 Shopify Theme Store 或在第三方平台 Themeforest 購買 Shopify 版型,都要注意其不一定包含網站 Demo 所使用的 Shopify App。有些版型買了之後還需要另外購買月付費搭配的 Shopify App,才會有該功能。若確認是該版型的預設功能,才不用另外付費或選購。若想了解更多,可以在購買之前先瀏覽該版型的「線上文件」。以 Wokiee 版型為例,其使用文件為 Wokiee – responsive Shopify theme user guide,多瀏覽說明文件永遠是有利的!
在 Shopify 官方的 Theme Store 可以試用版型,試用後想買再付費即可。但在第三方平台如 Themeforest 大部分需直接購買才能使用,但其中還是有提供免費試用的如相當好用又有設計質感的 Minimog Shopfiy Theme。另外,一個版型只能安裝一個 Shopify Store 商店,詳情可參考官方文件:Adding, previewing, and buying themes
安裝好版型後,記得先備份一次,保留最原始的檔案
將購買好的版型安裝好後,先在後台備份一次,保留最原始的設定(這是好習慣)。然後複製一遍,改變名稱為「開發中」,開發完後再改變名稱為「發布中」。以下圖為例,圖中右下角有三個檔案:
- 備份原始檔:Copy of Prestige — Try Theme 20200910
- 開發中:Prestige — Staging 20201101
- 網站發布:Prestige — Launch 20201231
其中 Prestige 是版型名稱,後面都會附上時間,幫助自己在使用這些版型的設定版本時了解先後順序,未來若持續修該發布第二版本、第三版本等,也可以視需求新增備份。
若是在第三方平台如 Themeforest 購買的 Shopify Theme 版型,則購買完後會有一組序號,在安裝完版型後輸入這組序號才能開始使用版型設定,且一組序號只能使用於一個 domain(網站)。如下圖,我所購買的 Wokiee 版型,上傳到 Shopify 後進行安裝,進入商店首頁後顯示的畫面,會要求輸入序號(如何取得序號可參考:Where Is My Purchase Code?)
備註:開始建立 Shopify 網站時,因為內容都尚未完整,我會先將網站鎖上密碼,可以防止被 Google 收錄或不小心被自己或團隊轉貼連結出去。
小訣竅:佈景主題語言翻譯、Notifications 通知翻譯
問題:使用部分的 Shopify 官方版型例如 Pestige 或第三方購買的版型中,該佈景主題語言本身預設沒有繁體中文翻譯(而其他版型有些有預設,就輕鬆了)
解法:另外安裝一個 Shopify 官方免費版型有繁中翻譯的,例如 Minimal,安裝完後不要發布,開啟路徑「網路商店 > 佈景主題 > 動作 > 編輯語言」,複製其中的翻譯到現在已發布的版型即可,可用雙視窗開啟並排執行較方便。Notifications 通知的文字內容通常只要更改佈景主題語言即可。
Shopify App Store(選擇應用程式)
簡介:Ecommerce App Marketplace — Using the Shopify App Marketplace To Expand Your Store’s Functionality.
說明:我的經驗是,幾乎好用的、想要的功能都需付費,而且是每個月都要付款的訂閱費,所以在挑選這些 App 組合後,可以先估算一下每個月的成本大概有多少。
連結:前往瀏覽
例如專門打造網頁排版的 PageFly Advanced Page Builder 的 Gold 方案每個月 $39 美金(實際價格以官方發布為主,安裝後進入後台查看價格表比較準確),目前我常用到的就是這個方案,價格親民,花點小錢直接拿來學習和實際應用都很適合,用了至少一兩週以上一定會上手的!其也可以拿來建立轉換率高的登陸頁 Landing page、直接套用各式頁面模板等,前往瀏覽可以直接使用的各種頁面的 PageFly Templates,有任何設定的問題也可以直接來問我吧!我同時也訂閱 MESA 和 Store Leads 每週最新的 Shopify App 上架資訊以了解網站商店經營的可能性。
想了解更多 PageFly 網頁設計編輯器可以參考:如何客製化 Shopify 網頁設計排版、PageFly 初入門:快速建立 Shopify 網頁
如何選擇 Shopify App?
我通常也會將安裝過程的體驗是否較佳納入評估因素,因為有些 App 雖然「功能很強」,但 UX 使用經驗堪憂、用起來會頭皮發麻,又或者視覺介面設計「慘不忍睹」。除非市面上沒得選非用它不可,否則我還是會依照下列因素來確認選哪一款 App:
- 功能滿足需求(若不僅滿足需求,又額外提供多樣功能尤其迷人)
- 評論等級與評論數(至少 4 星以上,且評論數相對很多,例如有超過 50-100 則以上)
- 安裝與設定的過程 UX 佳(包含線上客服速度、Onboarding 流程順暢、文件說明詳細、後台介面設計是否賞心悅目等)
- 開發者時常在更新與優化 App(關注最新更新時間與更新 log)
- 開發者在 Shopify 中的資訊顯示有幾年的開發時間(當然越多表示其可能對 Shopify 開發經驗更多、更熟悉)
- 開發者網站有沒有在經營、部落格文章或其他社群媒體有沒有在更新內容、更新頻率如何等都可以看出一些端倪
- 開發者網站本身的視覺設計如何(若真的不優,那對於其開發的 App 介面設計也不用太期待,我通常會跳過這類的 App,因為美好的視覺通常可以帶來美好的使用體驗,畢竟長時間使用,至少在「視覺上要賞心悅目」或「舒適」)
- 選擇 App 我還會盡量選「能跨多種平台」為優先考量,表示我可以不受限於單一平台使用該 App,費用也不會因每個平台都被收一次,很傷荷包。跨多種平台可以使用在任一架站平台或自架,置入程式碼「都可使用」,這超讚!例如只是單純線上 Chat,我基本會以跨平台的軟體為主。ps. 但也有 App 想每個平台「分別都賺一波」,所以即使該 App 也針對跨平台如 Shopify 和 WordPress 都出外掛,但彼此無法共同使用
- 其次我會考量更相容於該平台的 App,通常這種方式,登入該平台後會有其最符合該平台的介面、相容度更高等優點,且若該功能找不到跨平台,那就也只能選擇該平台專有的 App,例如選擇能非常能整合 Shopify 訂單、顧客資料等的電子報訂閱系統 Newsletter
🎄 各有利弊,各有使用情境,端看需求而定,沒有絕對好或不好,網站經營依不同分階段轉換也是一種常見方式
🎄 不同平台、不同使用情境會有多種稱呼方式:App / Plugin 外掛 / Saas / 軟體 / 線上工具
🎄 關於第 3 點的測試,我會用一種方法:就是有沒有可能在不看 App 的官方說明文件的情況下也能順利安裝設定完成,這真是 UX 最高難度考驗。若通過,那真的使用起來相當舒適。當然這也牽涉到功能複雜度。無論如何,重視 UX 體驗與後台介面視覺設計的 App 開發者會是優先選擇。
Shopify Theme 版型推薦精選
為何會考慮購買第三方平台的版型?因為這些版型不僅功能強大、價格也是 Shopify 官方的版型商店的一半左右,功能強大意味著可以少購買好幾個每個月要付費的 Shopify App,無論初期網站經營或長期來說皆可以省下不少成本。但要挑揀一下並驗證,看有沒有 bug 或其他問題產生,例如 Ella – Multipurpose Shopify Sections Theme 之前用有一些問題,但後來有推出新版本,之後再來檢查有沒有完善。當然,若覺得還是希望有 Shopify 官方認證,那就直接到 Shopify Theme Store 官方版型商店購買也可。
雖然說端看需求是什麼才能評估理想的版型有哪些,但可以確定的是,我是完全不使用免費版型的,功能太基本了。若選擇免費版型,未來勢必有可能會需要使用更多付費 App 來加強,成本並沒有降低,反而可能墊高。
一言以蔽之:若使用的是「官方免費版型」,則很多功能是沒有的,功能保持陽春可呼吸的狀態;若選擇「官方付費版型」,則功能會稍微多一點,但官方認證下費用滿不低的,大約落在 USD250 – 350;若選擇「第三方付費版型」,則功能會更豐富不少,是一場場饗宴,費用也比 Shopify 官方便宜不少,通常小於 USD 100
以下列出的 Shopify 版型列表和 Shopify App 清單都僅供參考,實際需要根據產業與自身需求去作選擇,請斟酌使用!也會抽時間統整於 Shopify App 和 Shopify 版型精選檔案(持續更新中)
ThemeForest – Shopify Themes and Templates(第三方優質平台)
🚀 Minimog – Shopify Theme
如果你希望使用 UX 使用體驗設計良好且視覺優質的 Shopify 版型,更甚者有熟悉此版型的網頁設計師與工程師可以詢問,那 Irving 爾文推薦 Minimog 版型,我已經實務上使用在數個不同的 Shopify 品牌電商網站中,目前我的滿意度為 4.5 顆星 ⭐️⭐️⭐️⭐️
Minimog 版型視覺設計簡約、功能卻很豐富,開發商不斷推陳出新,每個版本的迭代都有不錯的優化進步,很適合初入門的商家或進階使用的設計師和開發者使用,其程式架構的邏輯值得參考、網頁設計師容易整理 CSS 等程式碼。可以前往瀏覽 Irving 爾文執行的品牌網站案例:JE22、GWS、Urban Drivestyle、CUiRASÉX、Cloudvocal 雲聲、Le Moi-Peau 等。
🎄 想了解更多 Minimog Shopify 版型特色與細節- Kalles(團隊用過,不錯)
- Rubix(團隊用過,不錯)
- Zeexo(瀏覽過覺得優質,已先購買入手,待研究)
- Avone(瀏覽過覺得優質,已先購買入手,待研究)
- Wokiee(使用過,功能是多,但覺得後台介面的使用體驗比較辛苦,要找個項目設定花不少時間)
- Debutify(看過有電商網站用過,設計質感不錯、功能多合一超強大。但不是一次性付費的版型,而是訂閱費)
- ……陸續蒐集並實際研究測試
Shopify Theme Store(官方版型商店)
- Prestige(使用過,版型優雅別緻,還不錯。實際案例:JOWUA)
- Impact(滿有質感的官方版型,很多設計巧思在其中,相當喜愛)
- Motion(試用中,還可以,但 Slider 中的文字區塊位置能設定的不多,只能設定在左下角)
- Empire(看其他網站使用,看起來不錯)
- Boost(設計圓潤、很 Q 彈,列入蒐藏清單)
- Masonry(若希望網站選單固定在側邊欄,可以看看)
- Maker(用在化妝品產品呈現滿清新的)
- ……陸續蒐集實際案例
此 Shopify Theme 版型精選清單會不定時更新,同時附上獨立網址,方便大家蒐藏,可以隨時回來這個網站或直接瀏覽:https://share.irvinglab.com/shopify-theme-irvinglab
Shopify App 推薦精選
此份清單僅供參考,可以針對實際需求斟酌使用,如果有覺得不錯的 Shopify App,也歡迎隨時推薦給我囉!
- 網站頁面編輯器:PageFly Advanced Page Builder(目前首要推薦,正在使用中,已經超過三年,前往瀏覽現成的超過 100+ 的 PageFly Templates,有深度整合另外一款 Shopify App 網頁圖片優化 Tiny SEO Speed Image Optimizer,好方便!)、Instant ‑ Landing Page Builder(後台介面很有質感,功能也很細緻,特別的是可以複製 Figma 設計檔直接貼到編輯器內使用)、EComposer Landing Page Builder、Replo – Shopify pages without the dev time(滿創新的頁面編輯器,使用方式很獨特,操作方式有部分類似 Figma)
- 網頁圖片優化:Tiny SEO Speed Image Optimizer(TinyIMG 不僅優化圖片,還有其他許多提升頁面速度和 SEO 工具輔助:圖像 ALT 文本,JSON-LD(豐富片段),404 頁面,301 重定向,SEO 圖像壓縮器,生成 AI 描述,照片調整大小,壓縮,延遲載入,網站地圖,縮小 JS 和縮小 CSS。使用圖像和 SEO 優化器來優化頁面速度和搜尋引擎排名)
- 產品敘述分頁:Tabs Studio(常用功能,免費版設定簡單又好用,顯示方式可以設定 Tab 或 Accordion)
- 插入程式碼:XO Insert Code(插入程式碼於 <head>、<body>、<footer> 之間,可方便管理所有網站追蹤碼)
- 多國貨幣:Currency Switcher by Secomapp
- 多國語系:Language Translate & Currency by Transcy(首推這款翻譯 App,相當喜歡,不僅有多國翻譯,可以自動翻譯也可以手動翻譯,也有貨幣轉換功能設定。有一個小限制:若是 PageFly 建立的頁面內容,只能自動翻譯而無法手動翻譯)、Weglot、langify、T Lab ‑ AI Language Translate(Weglot、langify、T Lab 這 3 款目前跟 PageFly 相容)、Translate My Store & Currency by Hextom
- Language Translate & Currency by Transcy 常見問題
- 若已經自動翻譯,再切換成手動翻譯可以嗎?可以的,手動翻譯的部分會蓋過自動翻譯。
- 若我已經設定自動翻譯了,然後改成手動翻譯後,那還能不能再改回自動翻譯?可以,隨時都可。
- 「手動翻譯」還是不能翻譯 PageFly 的頁面對嗎?還不能,目前 PageFly 頁面內容只能自動翻譯。
- Language Translate & Currency by Transcy 常見問題
- SEO:Yoast SEO – SEO for everyone(Yoast 為老牌的 WordPress SEO 外掛,如今推出 Shopify App 相當值得期待!也解決了 Shopify 平台本身 SEO 設定的缺陷,例如終於可以透過 Yoast SEO 設定 Shopify 每一個頁面的社群預覽分享圖 Social sharing image 等,可以參考我這篇文章:Shopify SEO App 推薦:Yoast SEO 實戰教學)、SearchPie: SEO Booster & Speed(免費版可以大量編輯 Meta + ALT Tags、SEO Report 概要等)、Rich Snippets for SEO by Orbis Labs(這款下架了!Shpoify App 要慎選,有些廠商會下架)
- 貨到通知:Notify! Back in Stock | PreOrder(同時擁有預購和貨到通知兩個功能)、Back In Stock — Restock Alerts、Back In Stock: Customer Alerts by SureSwift Capital、Pre-Order Helper、SC Back in Stock Restock Alert
- 電子報 Newsletter:Mailchimp(推薦!可先至 MailChimp 官網註冊帳號,選擇免費方案,再去安裝 Shopify App for MailChimp。之前使用 ShopSync 才行串接,後來 MailChimp 跟 Shopify 又願意合作了 XD,直接推出官方版本,設定容易上手)、Klaviyo(相當新潮、設計質感的軟體,有 Newsletter 和 SMS Marketing 功能,自動化功能與 Shopify 生態系整合密切,非常適合 Shopify 商家經營者使用)
- A/B Testing 測試(網站轉換率優化工具):VWO(這款是我夢寐以求的 AB Testing 主流軟體,其功能的專業程度與順暢度相當高!可以先用免費試用三十天,有提供免費版和付費版,免費版可以當作小試身手)、Mida(是一款輕量級且強大的 A/B 測試平台 Lightweight A/B Testing Tool,專為企業打造,能與 GA4 無縫整合,通過可視化編輯器和代碼編輯器進行無限測試。不會減慢網站速度,避免頁面載入時間過長,以免影響轉化率。同樣有可視化編輯器,設定容易上手)、Convert(這也是一款非常扎實、重量級的的 AB Testing 主流軟體,跟 VWO 時常被拿來比較,官網註明客戶有 Sony、Audi 等。Convert Experiences(是一款專業的 A/B 測試平台,提供全面實驗功能,包括網站與應用程式測試、目標設定及 API 整合)、Plerdy(全方位的網站優化分析工具,其中 AB Testing 功能完全免費!太佛心!Plerdy 是一款強大的轉換率優化工具,結合 UX 和 SEO,幫助網站提升用戶行為分析並轉化訪客)、Instant ‑ A/B Testing(喔天!免費的 AB 測試)
- 客戶分析管理和行銷應用(精準分析、掌握回購率):Segments Analytics by Tresl(終極客戶細分工具,由數據科學家構建,自動產生分析結論,分眾行銷軟體 Segments,讓電商也能擁有自己的數據科學家。即時價值:獲得 50+ AI 生成的細分,包括 RFM 和行為。與 Klaviyo、Meta、Google、TikTok、Postscript 等整合,由 AI 驅動 — 使用自然語言提問並發現有利可圖的新分中。產品洞察 — 產品旅程、親和力、生命週期、同期群留存率等界級的支援 – 我們本質上是數據科學家)
- 結帳頁面再行銷:qikify Checkout Customizer(使用 qikify Checkout Customizer 釋放 Checkout 頁面的全部潛力。自定義結帳追加銷售,使用 9 種不同的結賬擴展和免費自定義品牌進行交叉銷售)、Checkout Extensions Plus
- 感謝頁面再行銷:Reconvert(滿推薦的!目前看過最完整的追加銷售功能應用於「購買後的感謝頁面」)
- 售後購買追加銷售:AfterSell Post Purchase Upsell
- 多組優惠券:DiscountYard — Stack Discounts
- 產品搜尋:AI Search, Filter & Recommend by Boost Commerce(推!五星評價,其中有兩個功能真的滿需要的,例如整個網站的搜尋即時結果建議、產品篩選器可以用 Tag 或 Metafield 設定;官方還提供客製化服務,可能會酌收一些費用,但目af前經驗是更新了滿多樣式沒有收費;可以指定版型安裝,這功能相當方便!亦即可以先安裝在未發佈的佈景主題測試,測試沒問題再發布。若要移除 App,也需要參考官方文件說明步驟才能正確地移除乾淨:Uninstall Product Filter & Search from your store),注意事項是該 App 可能會取代版型原先的 Collection page 版型喔,亦即樣式排版都須額外調整與設定、Smart Search & Filter by Searchanise(也是五星評價,智慧搜尋與篩選功能,可以去官網瀏覽介紹,若覺得不錯選擇 Shopify 平台進行安裝即可)
- 訂單追蹤:Track123 物流追踪 3D、Parcel Panel Order Tracking、TrackingMore‑Order Tracking(比較平價的選擇,可以參考看看)、AfterShip(可以讓消費者輸入訂單編號和 Email 或物流編號即可查詢目前物流狀態與進度。也可以設定讓消費者輸入手機號碼查詢,但好像卡住,改用輸入消費者的 Email 還滿順暢的。進入該 Shopify App 後的線上客服反應也很及時回覆,著實幫我解決了不少問題),實際案例可參考 JOWUA 台灣站訂單追蹤和美國站訂單追縱頁面,開啟的貨運業者有 FedEx、USPS、UPS、DHL Express、黑貓 PRESIDENT TRANSNET CORP、順風 SF Express、郵局 Taiwan Post,我自己也有下載 AfterShip 的 iOS app 登入使用,也有 Android 版本,使用體驗不錯!
- 新增多種形式的產品子類(產品選項):Hulk Product Options
- 麵包屑:Category Breadcrumbs – Zoom Buzz(解決 Shopify 在麵包屑路徑無法自定義設定層級,例如 Home > 狗 > 主食 > 乾糧,尤其在商品系列頁滿有可能有這方面的需求。此 App 主要是抓取主選單的方式顯示,所以端看主選單的商品系列而定。但要注意的是:Shopify 導覽列的選單最多三層而已)
- 販售數位產品(例如電子書、有聲書、攝影素材等):SendOwl
- Email Popups 提高轉換率與銷售:Wisepops – Onsite Marketing Platform(Popups、Notifications、AI Wishlist、Push Notifications)、Upsell, Discount, Email Popups by Getsitecontrol、Pop Convert ‑ Pop Ups, Banners – CartKit、Poptin‑Exit & Email Pop Ups(跨平台,包含 WordPress 和 Shopify)、Personizely: CRO & A/B Testing
- 多重選單 Mega Menu:Smart Mega Menu & Navigation by qikify(若產品分類或網站內容分類超多可考慮使用,排版方便、設定快速,還可在選單文字旁邊設定 Banner 圖等功能)、Mobile Menu & Navigation by qikify(而這款是專門設定行動版選單客製化使用)- 前面兩款 App 我都有用過,有個網站甚至兩者同時使用。付費版比較好用倒是真的。
- Instagram Feed:Instagram Feed — elfsight(激動推薦!進入官網首頁後找到,在選單找到 Widgets > Instagram Feed)、Instagram Feed Pro ‑ Instafeed by Expert Village Media Technologies
- Instagram 購物:Lookbook ‑ Shoppable Galleries、Shop Instagram & UGC by Growave
- 產品推薦 Product Recommendation:Frequently Bought Together – Code Black Belt、Rebuy Personalization Engine(號稱 AI 機器學習推薦系統,而其中覺得很棒的功能是可以在結帳頁推薦其他產品增加銷售)、Personalized Recommendations by Expert Village Media Technologies
- 互動式影片 – 提高轉換率:Tolstoy Product Video & Quiz(相當有趣與網站訪客的互動方式!透過互動式影片嵌入在網站任何地方,可以應用在產品銷售與導購、產品操作教學、客戶服務等場景)
- 追加銷售 – 產品組合優惠:Discount Buy X Get Y BOGO Gift(推薦!使用 BOGO、買 X 送 Y、免費禮品、捆綁包、折扣,賣得更多,賣得更多,AOV 更高)、Upsell & Cross Sell — Selleasy(推薦!)、Bundles Upsell | PickyStory(Combo Products – Bundle products as a single product、Buy X Get Y / BOGO、Bundles 等功能)、BOGOS.io Free Gift Buy X Get Y、Zoorix – Cross Sell & Bundles by Zoorix(Cart & Product Bundle Upsell, Quantity Breaks, Bundle Builder)
- 追加銷售 – 再訂購:Reorder Master ‑ Repeat Orders by HulkApps.com(介面一般,前往瀏覽 App)、Customer Accounts Concierge by Froonze(提供顧客後台更多選項設定,如可以新增地址、取消訂單、再訂購、最近瀏覽的產品顯示等)、
Completo ‑ In Cart Upsell(使用過這款,問題滿多的,不定時顯示錯誤然後無法使用)、Orderify - 追加銷售 – 購物車:qikify Slide Cart Drawer(通過側邊購物車追加銷售、免費送貨進度條、倒數計時器來激勵客戶購買更多並減少廢棄的購物車等)、iCart Cart Drawer Cart Upsell by Identixweb(在結帳前的購物車頁面追加銷售、提高轉換率)、Cart Upsell, Free Gift Monster by Monster Upsells(在購物車提供達到一定金額免運費或送贈品、買越多省越多、推薦商品等功能,需注意的是只能顯示在側邊欄購物車 drawer cart ,而非無法顯示在完整購物車頁 full cart page,顧客購買後會直接導入結帳頁 checkout page)
- 免費贈送禮物(買一送一):EG Auto Add to Cart Free Gift(運行有針對性的規則,向客戶提供免費禮品、附加商品或免費產品。添加基於特定產品或系列的購買免費禮物。為 BOGO、Buy X Get Y 優惠安排規則)
- 分享購物車清單:Keep & Share Your Cart
- 禮品卡、禮物卡:Giftnote Digital Gift Messages
- Social Proof:Sale Kit‑Social Proof, Pop Up by qikify
- 產品評論:Loox Product Reviews & Photos(推薦!視覺介面不錯,用起來舒服且美美的,功能會持續新增,很強的評論 App,可以讓使用者上傳影像或影片留下評論等)、Stamped – Reviews and Loyalty for Ecommerce Brands(推薦!重量級的 Shopify App,同時有產品評論和會員制 VIP 兩款可選擇,也可合併使用,透過收集和展示高品質的產品評價、使用者生成的視覺內容,提升了品牌可信度,以及 Net Promoter Score (NPS) 淨推薦值的計算與滿意度分析了解品牌忠誠度。此外,透過積分和獎勵系統、VIP 計劃和推薦計劃,平台不僅強化了與活躍顧客的關係,還鼓勵客戶參與並推廣品牌)、Ali Reviews ‑ Product Reviews by FireApps(五星好評跟 Loox 不相上下,介面設計簡潔、SEO 友善等),重點是這三款都有整合 Top 1 的 Shopify 網站頁面編輯器:PageFly Advanced Page Builder、Opinew Product Reviews App UGC
- 聯盟行銷 Affiliate Program / 網紅行銷 KOL Marketing:RecomSale: Affiliate Marketing – Channelwill(輕鬆建立聯盟計劃,將影響者變成合作夥伴並為商店創造收入,平台還支持建立推薦計劃,以激勵現有客戶通過社交媒體推薦品牌,並通過折扣促進銷售)、UpPromote Affiliate Marketing(UpPromote 是一款完整且易於使用的推薦及聯盟計劃應用程式,受到頂尖品牌和專家的信賴,能有效提升收入。該應用提供靈活的佣金選項、自動優惠券和聯盟鏈接,幫助商家增強顧客忠誠度,並建立強大的推薦和獎勵計劃以激勵顧客合作)、GrowthHero(綜合功能,可用於 KOL 網紅行銷)、Referral Candy by ReferralCandy(將你的客戶變成有影響力的人,讓他們推薦朋友得到獎勵)
- 會員制 Memebership / Loyalty Program:Loloyal – Loyalty and Referrals – Channelwill(有提供免費方案,這款質感很好,幫助品牌輕鬆客製化忠誠度計劃,能夠培養顧客忠誠度,增加顧客重複購買率,Loloyal 提供積分、獎勵、推薦計畫、VIP會員等級、限時優惠等功能,能夠無縫協作並有效協助商家建立顧客忠誠度系統。 商家可以設定自訂獎勵:折扣、優惠券、免運費、贈品,商店積分等,激勵顧客透過註冊、下單、寫評論、社媒分享、生日等互動方式賺取積分)、Stamped – Reviews and Loyalty for Ecommerce Brands(推薦!重量級的 Shopify App,同時有產品評論和會員制 VIP 兩款可選擇,也可合併使用,透過收集和展示高品質的產品評價、使用者生成的視覺內容,提升了品牌可信度,以及 Net Promoter Score (NPS) 淨推薦值的計算與滿意度分析了解品牌忠誠度。此外,透過積分和獎勵系統、VIP 計劃和推薦計劃,平台不僅強化了與活躍顧客的關係,還鼓勵客戶參與並推廣品牌)、BON Loyalty Rewards & Referral(有提供免費方案,這款質感也不錯,功能不少,跟前述差不多,客服積極回覆問題與解決問題)
- 表單(聯絡表單,包含設定讓顧客上傳檔案、Shopify 會員註冊表單等進階欄位設定):qikify Contact Form Builder(經濟實惠)、Helium Customer Fields、Powerful Contact Form Builder by Globo、Hulk Form Builder
- AI 線上客服:Rep AI: ChatGPT Sales Chatbot(ChatGPT 驅動的聊天機器人利用行為 AI 提高轉換率,生成式 AI 處理銷售與支援,減少工單。品牌可自訂外觀,並與 Shopify 應用無縫整合。快速設置,10-15 分鐘即可上手,適合提升電商轉換率的品牌。可以使用此折扣碼 10% discount coupon:10OFF12MO)
- 線上客服 Online Chat / Helpdesk:WD‑Live Chat, Helpdesk,Chatbot – Channelwill(綜合性功能,有線上交談,商家有後台交談紀錄、整合多個社群渠道來的訊息如 Meta Facebook Messenger、Instgram Message、WhatsApp、Gmail 等)、FAQ 常見問題等,集成訂單追踪和常見問題,方便用戶隨時隨地自助查詢訂單狀態,自動解答「我的訂單到哪了」等常見問題)、Gorgias(借助 AI 驅動的 CX 實現增長,為了發展品牌,商家需要提供能夠建立忠誠度的體驗。線上購物應該像訪問最喜歡的商店一樣個人化和輕鬆。增長取決於創建個人化、準確和快速的客戶對話)、Crisp:新創公司和中小型企業提供的資訊平台。在這個平台上,可以實現銷售、行銷和支援的一站式服務。功能包含提供知識庫、團隊收件箱、聊天機器人、CRM及其他多種功能,幫助你打造獲得客戶成功的獨特方式。可以整合 Shopify、WordPress,且升級到最高方案還可以整合更多的其他交談軟體如 Line、Facebook Messenger、Instagram Message、WhatsApp、Twitter Message 等,Irvinglab 爾文實驗室官網右下角的線上交談工具就是使用 Crisp。Business Messaging Platform For Startups & SMBs
- 加入蒐藏:Wishlist King、Hulk Advanced Wishlist
- 會員制與評論 All-in-One:Growave(會員制 Loyalty and Rewards、產品評論 Reviews、Instagram UGC、加入蒐藏 Wishlist、會員登入 Social login,最近用到的 How to embed the Social Login buttons on any page)
- 行銷 All-in-One 增加銷售:Vitals:Reviews, Bundles (40+)(包含 Product Reviews、Pre-Orders、Volume Discounts、Sticky Add to Cart、Currency Converter、Description Tabs、All-in-One Chat 等)
- 綜合功能:POWR(選擇 Business 方案可以直接使用 60 多個功能,包含表單建立、社群分享、彈出視窗、FB meseenger 線上交談、評論等功能)
- 產品輪播圖 Slider:Product Image Gallery & Zoom、GG Product Page Slider&Gallery by Gigilabs(這款新發現,滿新穎的,若你使用的版型沒有產品輪播圖 Slider 可考慮先使用其功能限制的免費版本看看)
- 前後對比圖 Before & After:Widgetic (Before and After)
- 購買按鈕對外連結:AOD External Links Button(目前有用過,設定簡易)、Outlink External Links Button
- 偵測使用者所在國家自動轉址到指定網址:GeoIP Country Redirect/Blocker(雖然介面設計陽春,但設定功能等都容易上手)
- 商店實體店地圖:SC Store Locator Map
- 社群登入:Oxi Social Login
- 訂閱制 Recharge Subscriptions(台灣 Shopify 商店不能使用):Recharge Subscriptions(透過洞察、動態訂閱者體驗和受信任的訂閱核心,幫助品牌提升訂閱策略以增加收入。提供無需編碼的客戶入口、動態產品組合和多層次折扣的訂閱管理,並通過分析工具監控業務表現以優化結果)、Appstle Subscriptions & Loyalty、Bold Subscriptions、PayWhirl
- 訂單印表機(自訂發票、標籤、收據、裝箱單及其他文件):Order Printer(解決問題:目前客人的追蹤碼是一個一個輸入,但是要匯出所有訂單資訊時,卻沒有包含訂單追蹤碼 Order’s Tracking Number,而每個月對帳需要匯出訂單,要有追蹤碼。所以此 Shpoify 官方推出的 App 即可客製化資訊包含訂單追蹤碼。參考官方文件)
- 自動化流程:MESA‑ Workflow Automation(這款是專門 for Shopify)、Make
- 高度客製化報表與數據輸出:Xporter Data Export Tool
- SMS Marketing:Postscript SMS Marketing(國外滿多商店使用,台灣商店目前不能使用)
- 貨到付款自訂顯示與費用:Releasit Cash On Delivery(根據任何條件隱藏或顯示貨到付款選項如訂單總額、國家等、向貨到付款添加自訂費用依據固定值或百分比、添加貨到付款說明訊息等功能)
- 貨到付款 COD 的 SMS 驗證:COD Order Confirmation King(通過簡訊一次性密碼或鏈接驗證客戶的手機號碼,減少貨到付款訂單的退貨。免費方案的簡訊費由 Store Owner 負擔,而非消費者)
- 貨到付款訂單表格:Releasit COD Form & Upsells
- 商店資料備份:BackupMaster Backups(可以拿來作爲 Shopify 網站內容的備份、Shopify 網站轉移或複製到第二個 Shopify 商店)
- 購物車預留時間倒數:Countdown Timer Ultimate by KILATECH
- 修改已成立的訂單:Edit Order by Cleverific(當訂單問題發生時,例如缺貨產品、客戶訂單更改請求或延期交貨問題,能夠解決訂單更改問題)
- 訂單購買金額與產品數量購買數量設定(例如設定顧客每筆訂單最低購買總金額、指定產品最小購買數量):Order Limits ‑ MinMaxify by Intillium(使用過,運作正常)、Advanced Order Quantity by Extendons
- 輕鬆標記和排序訂單:SC Order Tags & Flows
- 批發 Wholesale:SparkLayer B2B & Wholesale、EasyLockdown ‑ Wholesale Locks by NexusMedia(推薦,方案費用也不貴,但要注意跟所使用的版型有沒有完全相容)、Wholesale Lock Manager: B2B、B2B 批發價優惠(Wholesale Pricing Discount B2B)、B2B Lock Password Protect by BSS Commerce、AReceivables(輕鬆追蹤未付批發訂單)
- 鎖定部分內容,讓特定用戶才能瀏覽:Locksmith(使用時要多加留意,先閱讀其官方文件)
- 購物車顯示運費:Shipping Rates Calculator Plus
- Dropshipping:Syncee ‑ Global Dropshipping(B2B Platform For Dropshippers, Retailers, and Supplier:看起來不錯!另外有款工具 Dropship 可以追蹤其他商店的銷售業績、競品分析等)
- Mobile App Builder for Shopify Store:Hulk Mobile App Builder
- 大量編輯產品:Ablestar Bulk Product Editor
- 產品中不同顏色連結到不同產品頁 Separate Colors as products(此功能是想要在一個產品頁中呈現很多「顏色選項」時,分別點擊之後都會分別連到該顏色的獨立產品頁,亦即一個顏色一個產品頁):Color Swatches, Image Swatches by Platmart(我選擇這款,主因是載入速度較快)、Product Colors by Webyze
- Meta 臉書像素與事件設定:Trackify X Facebook Pixel(除了臉書像素,還有 TikTok、Snap 像素與事件設定等,相較於 Shopify 透過銷售管道安裝的 Facebook & Instagram 功能更多,且跟很多 Shopify App 的頁面編輯器相容,如 PageFly Landing Page Builder,提供的客服支援也會提供有關臉書廣告或 Shopify 相關問題的建議)
- 直接使用現成的 Shopify 區塊和版型 Sections and Template(須注意版型相容度):Luna Templates、qwiqode
- GDPR(Cookie Consent):Hulk GDPR Cookie Consent Bar
- 修復 404 錯誤:SC Easy Redirects
備註:有時因應 Shopify 發布新功能、政策變更、API 變動等,通常你安裝的 Shopify App 會寄信通知你說要去後台將 App 更新,才能正確讀取以達到最新狀態,意思是安裝 Shopify App 後,也要不定期去每個 App 巡視一下有沒有發布更新,若有,就直接更新,以讓功能完全發揮
此 Shopify App 精選清單會不定時更新,同時附上獨立網址的清單檔案,方便大家蒐藏,可以隨時回來這個網站或直接瀏覽:https://share.irvinglab.com/shopify-app-irvinglab
Shopify 台灣商家如何串接台灣金物流與超商取貨、電子發票?
更詳細的內容說明,可以前往閱讀:Shopify 台灣金流、電子發票、物流與超商取貨解決方案
開始免費試用 Shopify 建立電商網站,可享精選方案優惠,每月只要 $1,為期 3 個月,手刀前往立即註冊
這是 Shopify 官方目前正在跑的優惠活動,不知何時會結束,若試用後不想用,也可以隨時取消訂閱
若有網站設計與建置的需求,歡迎填寫表單,與 Irving 爾文深度諮詢與討論!
若你是平面設計想轉職網頁設計師或從未熟悉網站開發程式的行銷人員,想了解網頁程式開發是怎麼一回事,極度推薦六角學院的線上課程:使用 HTML、CSS 開發一個網站,上完之後會有初步的概念,不僅可以開始看懂網頁的基本語法,有助於執行網頁設計介面時的實際作法,更能提升與工程師的溝通效率,而不致於完全雞同鴨講。若是完整的基礎學習則可以再修此兩門課:一變應萬變:RWD 響應式網頁設計、使用 jQuery 打造互動性網頁動畫效果
針對 SEO 初學者、初入門的人,可參考 Hahow 的線上課程:SEO 白話文:不懂程式也能學會的 SEO 秘密,上完後在知識與觀念上扎實打下基礎,接著進階的是了解整合 SEO 搜尋引擎優化和 Google Ads 關鍵字廣告的行銷策略:客戶主動找上門!全面佈局的搜尋引擎行銷策略,然後學習網站分析工具 Google Analytics 課程:GA4 新手完全攻略!用數據分析下商業決策,從做中學優化網站 SEO,學習效率倍增!有興趣的話再加入 Line 社群一起討論:SEO 資源彙整 / 學習,歡迎蒐藏並分享給你的同事們我持續更新的「SEO 免費學習資源」、「爾文 SEO 觀察室」。閱讀書籍的部分則超級推薦:SEO 超入門:教你免費又有效的網站行銷好點子
SE Ranking – 強大的 SEO 數據分析平台,滿足各種主要任務
直接使用 SE Ranking 關鍵字研究搜尋工具如下欄位,進行免費搜尋,輸入關鍵字、網域或網址後會另開新頁面進入到後台儀表板,搜尋引擎設定記得改成台灣,這樣搜尋結果才會是在地化。SE Ranking 可以是 Ahrefs 的一個替代方案,專為應對各種 SEO 任務而設計。它提供多樣的數據和直觀的儀表板,並為經驗豐富的 SEO 專業人士提供一系列量身定制的工具,包括 SEO 排名追踪、關鍵字建議及競爭對手分析等。此外,SE Ranking 還特別推出了專屬的行動應用程式,讓使用者隨時隨地輕鬆瀏覽 SEO 數據,極為方便!
爾文打造的客製化 ChatGPT
- SEO 搜尋引擎優化
- 名稱:與文同行 SEO 搜尋引擎優化師
- 簡介:Chat and Learn – 透過對話學習 SEO
- 網址:https://share.irvinglab.com/gpt-seo-mentor
- Shopify Liquid Dev 程式開發
- 名稱:Liquid 程式開發 AI 顧問
- 簡介:針對初學者 Shopify Liquid 程式撰寫的專業輔助,含豐富範例及詳細解說
- 網址:https://share.irvinglab.com/gpt-shopify-liquid-expert
- Web Design 網頁設計
- 名稱:成為網頁設計師
- 簡介:你的網頁設計學習諮詢顧問
- 網址:https://share.irvinglab.com/gpt-web-design-advisor
- 備註:歡迎前往試用,接下來會持續更新與優化,也可隨時給我回饋 ^^ 感恩!GPTs 已可以設定即時搜尋其他網站上的資料,確切地說,原本使用 Bing,並使用另一個 ChatGPT Plugin 來執行任務,該工具允許使用者提供一個(或多個)URL,並可以選擇請求與 URL 進行交互,提取特定資訊或如何處理 URL 中的內容,請求可能包括重寫、翻譯等。若遇到任何使用上的問題可隨時來訊息或截圖跟我說。
從 2020 年至今,Shopify 產品頁中的「產品輪播圖」需求大概被問了 n 次,官方社群也是很多人在詢問,但那時都還沒找到一個快速有效的可行方案,尤其是效率這件事,那時公司有給外包改過,但設定步驟繁複,版型某部分功能也被影響到,實為不是上上之策。
最近終於找到一款並實際使用過,目前還不錯的 Shopify App 如下所列:
產品輪播圖 Product Image Slider
使用時機
當你安裝的網站版型本身沒有提供「產品輪播圖」功能的時候,可以使用看看。
注意事項
如果能的話,先在測試站測試,沒問題再到正式站使用。因為我們使用的網站版型和 Shopify App 都不盡相同,所以測試的時候要去注意有沒有彼此衝突的問題。
補充說明
- 外包工程師客製化獨特功能沒有不好,但有時還是得靠運氣遇到優質的人或是那獨特功能真的太複雜所致,因此能先找 Shopify App 解決為上。
- 除非真的沒有其他變通的做法或嚴重影響生意的網站問題,再考慮找外包工程師長期配合,或就乾脆組建一個公司內部的工程師團隊,以「長期合作」的性質為出發點,不僅有利於網站的長久維護更新以及將溝通成本降到最低。
SEO for Shopify
方案:免費版只能設定5頁,14天免費試用,付費版 USD$19/月
老牌的 WordPress SEO 外掛:Yoast SEO 也推出相容於 Shopify App,解決了 Shopify 平台本身極度受限的 SEO 功能!
詳細介紹可以閱讀我這篇最新文章:Shopify SEO App 推薦:Yoast SEO 實戰教學
其中之一是賦予 Shopify 能夠設定「每一個頁面」的社群分享圖片(Social sharing image),這行銷人來講是最大的福音之一,其還可針對 Google preview、Facebook preview、Twitter 等分別設定不同的預覽內容。除此之外,Yoast SEO 還有不少好用的功能,例如可以在 SEO title 和 Meta description 插入變數(Insert variable),尤其在網站有大量頁面時使用以達到省時省力;Schema 則是會根據頁面類型自動套用,而 Pages 和 Blog posts 則可以手動設定 Page type 結構化內容,滿厲害的!還有很多很多,可以慢慢挖掘,付費版的功能將近跟 WordPress 外掛版本使用體驗好用夠用!
注意事項
- 此 App 會修改你的 Theme,在今年 2022 年上半年有不少使用者在評論區抱怨其讓網站出問題且變慢,而近期七、八月的評論開始是好的,因為該公司有修改了很多 bug,可以參考其官方文件:Yoast SEO for Shopify changelog – https://yoast.com/shopify/apps/yoast-seo/changelog/
- 我剛開始測試而已,是有成功,但沒測試過所有 Shopify Theme 是不是安裝後都沒問題,所以大家在測試此 App 時最好還是先將原本的版型備份或在測試站先測試比較保險。
- 安裝任何 Shopify App 我都會順便確認一下「如何正確適當地移除」,而移除此 App 的官方文件說明在這:How to uninstall Yoast SEO for Shopify – https://yoast.com/help/remove-yoast-code-from-theme-in-shopify/
- 可以先從常用的 Facebook preview 開始,設定完後用 Facebook debugger(分享偵錯工具)就可以立即看到成果,檢查工具網址:https://developers.facebook.com/tools/debug/
SEO – Rich Snippets(哭,此 App 下架了!)
Rich Snippets for SEO by Orbis Labs
說明
這一款 Shopify APP 使用後覺得還不錯,一次性付費(非月費),這實屬難見,竟然不用月費!設定滿簡單的,後來也有達到目的。之前建立完某個 Shopify 電商網站後,希望能將產品的 Rating 顯示在 Google 搜尋結果頁中,那時候只是為了這個功能而已。但產品頁要搭配使用評價 APP,然後真的有人留下評價且不錯,那顯示在搜尋頁會更有意義,意思是如果產品沒有任何人評價或評價不好,那…先不要使用吧!評價 APP 我是使用 Loox Product Reviews & Photos
*是否需使用請自行斟酌評估喔!這裡只是分享使用經驗
*為何要設定 Rich Snippets?讓產品在搜尋結果頁中提高能見度和點擊率
*如何驗證 Schema 設定成功?使用 Google 的 複合式搜尋結果工具
*可以挖寶 Shopify Apps 的一個國外論壇 Quora:What are the most useful Shopify apps?
這功能不知大家的想法如何?就是「購物車預留時間倒數」
Countdown Timer Ultimate by KILATECH
目的
- 創造緊迫感
- 減少廢棄購物車
- 鼓勵購物者加快結賬速度
備註
- 不是「單純倒數而已,是真的會被移除」
- 我沒親自用過,但看過 demo 以及該 app 五星評分和 reviews 數滿高的,超過 200 個
- 就當作參考看看,若有需要,可以自己去測試先,然後不錯用再使用即可,之後能分享使用經驗就更棒了 ^^
- 另一款有類似功能 Cart Reserved Timer Shopify App: Create Urgency | Vitals
- 搜尋關鍵字:Cart Reserved Timer、Automatically Empty Cart After Count
使用 Shopify 架站是不是要會程式語言?例如 CSS 及 HTML?
🍎 版型沒有的設定,就兩種解法:
- 找 App
- 寫程式
🍎 若只是單純視覺排版的問題:HTML/CSS 就可以解決一半以上的排版需求
🚀 會「基礎的 HTML/CSS」當然更好
- 一來廠商交接給你們團隊的時候,比較容易交接
- 二來整個網站專案執行效率提高
- 三來可以做的事情更多更多元
- 不會寫程式碼:就像騎腳踏車一樣,前往目的地
- 會寫程式碼:可以像開跑車一樣,秒速到達目的地
🚴🏼♂️ 若你們團隊不想學開跑車,只想騎腳踏車就好,那就……專案就會像騎腳踏車一樣,腳踩得再快還是慢。ps. 但只要持續不斷騎到底,還是可以到達目的地
🍎 我遇到的部分來諮詢的人,會先捲起袖子先自己做一遍,這樣通常是好的開始,因為:
- 自己做一遍才會知道「會遇到哪些困難無法執行」
- 沒有自己做一遍會以為「Shopify 很簡單啦~ 自己摸一摸就好了,無所不能」
備註
- 若你是工程師,那可以跳過以上內容 XD
- 若你不寫程式碼,且「覺得網站版型套一套、有存在就好」,那也可以跳過以上內容 XD
- 最終都會依照「需求的複雜度」來決定到底套版就好,還是需要客製化,沒有唯一的答案
網站的世界中,網域是最最重要的品牌資產,請先保護好
🍏 近日 Shopline 事件沸沸揚揚,可以瀏覽燒賣臉書社團的貼文討論串,貼文一、貼文二。所以哎,經營網站時,首要確認的事「網域是在哪裡購買的?」無論是哪個平台,包括 Shopify 都一樣,「完全不建議在這些架站平台上購買網域」,未來哪個時候因故要轉平台就麻煩大了,把網域「綁在平台上」風險絕對不低。🚀 請直接在第三方網域供應商購買囉,例如 GoDaddy 等,然後全面開啟二段式驗證提升安全層級到最高,網域絕對是網站最重要的品牌資產之一。不要嫌麻煩哎,將第三方網域設定一次就能綁定在所使用的架站平台,這小動作可以分散極高的風險。
😨 經手過無數的網站,還會發現一個嚴重的問題:就是當初申請網域帳號還有架站平台帳號的 Email 竟然是用某員工 Email 申請,而不是用「公司專屬的 Email」申請,😢 例如遇過某案子因某員工離職,發現 GA 進不去了,因為是綁定在該員工的「個人信箱」,也失聯了,該公司只好在網站數據上「從零開始」經營,而幾年的心血秒歸零,只能哭一發。
🚀 請直接用「公司專屬的 Email 帳號」申請:「網域」和「任何架站平台」等軟體,且「此 Email 的擁有權」需綁定在創辦人或核心成員中,他們才擁有至高無上的管理員權限。
對我來說,我如何看待網站這件事:
- 🍎 第一個看網域在哪裡購買的?擁有權在哪個帳號?
- 🍎 第二個看網站真正的擁有權是哪個帳號?
身為創辦人、品牌經營者,只有優先確認這兩個資訊是安全無虞的,才能安心執行接下來網站要做的事,無論是販售產品、內容產出、行銷經營等。🚀 網域,沒有模糊空間,絕對是網路世界中品牌最重要的資產,請放在 Top 1 優先保護好、管理好。
研究全世界的 Shopify 網站
說明:研究全球使用 Shopify 建站的品牌與公司,橫跨各種產業,了解他們的網站設計、行銷、文案、經營方式,分析其所使用的 Shopify Theme、Shopify App 等,站在前人的肩膀上,進步特快!
搜尋 Shopify 網站的平台
BuiltWith
- 簡介:Get a list of 4,766,134 websites using Shopify and 3,298,025 currently live websites(時間:2021/09/01)
- 標題:Search results for shopify
- 描述:BuiltWith lookup search results for shopify
- 網址:https://builtwith.com/shopify
- 流量:23,400 visitors per day
Shopifyspy
- Find 4,652,970 Shopify Stores(數據時間:2021/09/01)
- 標題:The Most Successful Shopify Stores in 2021
- 描述:Shopifyspy collects comprehensive data from the most successful and powerful shopify stores, containing rankings on Alexa and different social media.
- 網址:https://shopifyspy.com/stores
- 流量:7,250 visitors per day
Xpareto Spy
- Total records: 28339(數據時間:2021/09/01)
- 標題:Xpareto Spy on Top Shopify Stores
- 描述:Xpareto- Spy on Top Shopify Stores, Now you Can Reverse Engineer these Proven Winners to Replicate their Success!
- 網址:http://xpareto.com
- 流量:3,640 visitors per day
Commerce Inspector – Shine Commerce(需登入)
- 標題:Commerce-inspector
- 描述:Grow your brand faster and more profitably with Shine’s eCommerce intelligence software.
- 網址:https://www.commerceinspector.com
- 流量:20,400 visitors per day
Shopify Stores List – Shulex
- Total records: 4931(數據時間:2023/11/05)
- 標題:Shopify Stores List – Shulex VOC Best Ecommerce AI Tool
- 描述:Spy on shopify competitors, best selling & trending & winning products, shopify themes, apps, fastest growing stores, newly released products, dropship and more by Shulex VOC.
- 網址:https://www.voc.ai/tools/shopify-stores
- 流量:<200 visitors per day
Flippa
- Total records: 28339(數據時間:2021/09/01)
- 標題:Online Business For Sale | 5,000 Listings | Flippa
- 描述:No. 1 Marketplace for Online Businesses for Sale. Over 5,000 websites, ecommerce, SaaS and app businesses for sale. Start your search today.
- 網址:Search Online Businesses for Sale – Filter by Types: Shopify
- 流量:22,400 visitors per day
Shopify
說明:Shopify 官方也會選出用 Shopify 建立的最佳電商網站 Shopify Commerce Awards,從三個面向評估:UX + FED、Development and apps、Overall builds。可以參考這由官方認證的得獎網站,並且有概要的評析,相當值得參考!
- Shopify Blog 文章列表(Shopify 官方部落格也會撰寫與評析優質的電商網站)
- Shopify Theme Store(Shopify 官方的版型商店有很多 Demo 和實際案例也不錯)
解析其他 Shopify 架設的電商網站(借力使力)
為了瞭解其他用 Shopify 電商網站是用了哪種版型與哪些 Shopify App 讓其網站打造得這麼優質與超能力,就需要一些工具來分析。
網路上有分析 WordPress 的 Chrome Extension 如 WordPress Theme Detector and Plugins Detector,以此類推,Shopify 發展這麼久了,一定也有開發者開發類似的,果不其然,我篩選後選擇了這款 Shopify App/Theme Detector by Fera.ai,記得在小視窗往下捲動,還有剩下沒在畫面中一次呈現的的,右邊都有附上該應用程式的官網和購買連結,超方便!如下圖所示,觀察此賣貓兒產品的國外公司 Katris 的網站使用的版型名稱是 Minimal theme,而其所使用的 App 清單如下,但實際上是有限制的,不能完全截取其所使用的每一款 Shopify App,通常只會找到一部分,聊勝於無囉!
- Hextom Shipping Bar
- Mailchimp
- Sales Rocket 等等
能偵測到的版型也是有限制的,若顯示的不是某 Shopify 版型名稱,表示該網站使用者在 Shopify 後台有改過名,也因此會很難一眼就知道這網站所使用的版型。如果你也不想讓別人知道你使用哪一套版型,可以去後台更改「版型名稱」即可,設定路徑:Shopify Admin > 佈景主題 > 擇一版型 > 點擊「動作」 > 「重新命名」
有注意到我的 Chrome 瀏覽器上方還安裝了超過二十個的 Extension,排排站好是驚人!我之後會再另外寫一篇分享我用的這些瀏覽器擴充功能用在哪些地方與使用方式,包含 SEO、網站技術分析、網頁設計中的字型解析等。
Shopify 官方其實一直在更新系統,從設計到功能面都在優化,可以前往 Shopify changelog 瀏覽他們每個月更新了哪些,挺有趣的!
開網店的路上你不孤單
Free Business Tools — Online Tools for Small Businesses
說明:開設網店通常還需要許多數位工具相扶持,除了上述所列出所有的教學與社群支援外,Shopify 還提供免費的線上工具供開店老闆、創業者使用,有點酷,無論是 Logo 產生器、Slogan 金句產生器等都可以玩玩看!
連結:前往瀏覽
品牌識別設計 AI 產生器 Logo Maker – Looka
說明: Looka 是用 AI 產生無數個品牌 LOGO,相當方便!平面設計師的工作再度受到挑戰……?!我自己因為有數個新品牌正在建立中,先免費試用,覺得有夠讚,後來我就選擇了付年費方案也不貴,直接取得整組 Brand Kit 素材,還可以隨時進後台編輯與修改!Design a Logo, make a website, and create a Brand Identity you’ll love with the power of Artificial Intelligence. 100% free to use.
品牌標語產生器 Slogan Maker
說明:Slogan 沒靈感嗎? 可以先用 slogan maker 品牌標語產生器快速產生列表,輸入關鍵字或產品名稱,就會自動列一堆列表,雖然不是說百分之百完美,但當作起個頭也好,然後再從中挑選繼續構思。而我常用到的原因是常常客戶或團隊沒有提供完整的文案,為了讓網站盡可能準時上線而必須同時進行設計,雖然也可以先用假文字頂著用,但常常執行時很沒有 fu,「設計搭配假文字」其實到最後還是有可能需要重新設計,造成重複工時、消耗團隊人力。所以這時若能設計師跟需求方能先討論出個「大方向的文字概要」,例如主視覺與標語、每個段落的標題,之後再細修即可,這樣一來,設計師比較不會偏離最後成果的方向太多。以下列出其中可以參考看看的標語產生器線上工具:
- Marketing Slogan Generator – Shopify(中文版也有,但似乎不太能用,就用用看囉 ^^”)
- Free Slogan Maker Tool – ClickFunnels
- Slogan Maker – Designhill
- AI Slogan Maker – Zyro
- Slogan Creator – Oberlo
Shopify 後台還是有可以優化的地方
產品標籤 (Product Tag) 不支援大小寫
有關 Shopify 的產品標籤設定問題,例如若有人拿來設定作為商品篩選器用,要注意的是:Shopify 目前還無法區分產品標籤大小寫,例如若先建立了 ABC,就無法另外建立 Abc,也無法編輯原本的 ABC,以此類推。這是 Shopify 目前的小問題,有回饋給他們,看未來會不會更新。
另外若會將產品標籤顯示在網頁上,不小心設定到全部小寫如 abc,但希望顯示的是全大寫或只有英文字首字大寫,則就用 CSS 設定解決即可。設定英文字字母的大小寫,CSS 語法:text-transform
text-transform: uppercase 所有字母大寫
text-transform: lowercase 所有字母小寫
text-transform: capitalize 每個單字只有第一個字母大寫
備註:
- 若一個單字中有大小寫混雜成這樣如 gHijKLM,則可能就沒救了 XD” 乾脆用 JS 強制替換掉(也太麻煩),所以設定產品標籤時在執行時要先思考清楚、規劃謹慎,再去設定
- 很妙的是,Shopify liquid 的 capitalize 只設定整句話的第一個英文單字的首字改成大寫,不同於 CSS 的 capitalize 是將整句話中的每個英文單字的首字改為大寫,eg. Shopify liquid 範例:{{ “prodcut Title name” | capitalize }}
不建議使用 Shopify 內建的 Free images 導入的圖片
Shopify 內建的 Free images 導入的圖片檔案非常大,幾乎都是好幾 MB,所以不建議直接使用。
文字編輯器基本功能不是很全面
Product page 的編輯器滿難用的,css 樣式也怪怪的,例如 h5 的 margin 高度異常的高,或是複製貼上文字時即使已經清除格式,還是會產生一些不必要的程式碼,我是直接手動方式貼在編輯器中轉換程式碼狀態後再切換回來進行排列與文字設定,滿麻煩的。而且複製貼上時,除了清除格式外,最好還要手動去分行、斷行,進行格式化,不然每個頁面會不一致。
沒有一個真正好的媒體檔案素材管理
在 Shopify 後台管理沒有一個很好的媒體檔案管理方式,圖片上傳後不能有資料夾分類和搜尋,很不直覺且難用。如果我有一百個產品,照片應該會超過兩三百張,很難想像這怎麼處理,反而是要在頁面中要上傳圖片時才會發現有這個「圖片空間」XD”(妙哉!)即使官方有推薦此 Shpify App — Image Manager,但其功能有限,只能篩選和搜尋,依然無法建立資料夾進行分類,重點是還真不便宜!另一款 Variant Image Penguin 專門處理 Prodcut photos 看起來有一點點幫助,同樣價格不便宜然後功能應該還能更好,所以就等待囉!暫時還是先用預設的方式執行。
目前尚不支援 SVG 圖檔(2023 年重大更新後,現在已經支援囉!讚讚)
用過 SVG 圖檔格式的應該就回不去了!因為解析度真的太好,完全不怕電腦和手機的大小螢幕解析度,而且清晰的可以!尤其用在 Logo、小圖示呈現都不怕品質變差。Shopify 目前依然尚未支援,可參考官方文件。而若要解決此問題,一可以到設定 > 檔案 > 上傳 SVG 檔後再複製圖檔網址到頁面中使用,但要寫 CSS;二可以透過 Shopify App 上傳如頁面編輯器 PageFly 上傳 SVG 檔直接使用。
圖片上傳後 Shopify 會自動壓縮
照理說這功能滿棒的,可以省下優化圖片的時間與人力。但是就變成無法自己「完全掌控」並決定圖片品質的高低。因為有時候就是想要在品質和圖片壓縮之間取得平衡(可以是八成給品質、兩成給網站效能),而非百分百以效能為主壓縮圖片,設計師應該都有這方面的小堅持吧!XD
圖片檔案名稱無法使用中文命名
無法使用中文名稱命名的圖片檔,上傳之後中文字會被自動濾掉、而字間的空白會用自動產生底線。意思是必須要全英文命名,但在這種情況在 WordPress 是沒問題的。
部落格文章無法設定「所謂的文章分類」,目前只能用文章標籤替代之
雖然可以在 Shopify 的部落格功能中,建立不同「網誌名稱」來達到類似的目的,但邏輯其實不太一樣,因為這樣其實會是屬於不同的部落格,文章也很難真正管理。且還需要透過撰寫程式或另外安裝 Shopify App 來將「不同網誌作為分類」顯示在同一頁面中,實屬麻煩。解法是將「文章標籤」當作文章分類來設定。
社交媒體圖片只能設定一張精選圖片
用 WordPress 架站的人就會知道網站中的每一頁面(包含每一篇部落格文章)都可以分別設定社交媒體圖片(Social Media Image),但 Shopify 只能設定一張首頁的精選圖片。其他頁面不能單一設定。雖然還是找得到 Shopify App:Social Media Share Image(還沒測試過),但因為覺得只為了這個功能就每個月花這額外的費用感覺不值,所以就先暫時不用(當然還是依需求程度而定)
社交媒體圖片(Social Media Image)或稱社群分享圖片(Social Sharing Image)
Shopify App 評價資訊少,使用者挑選時判斷資訊不夠多
目前每款 Shopify App 頁面的評價資訊主要有評分(幾顆星)和評論(使用者回饋留言),其他技術細節、被購買(使用)次數都沒有,而覺得最重要的資訊還有此 App 的開發者最新更新時間為何時,這點超重要!才能讓我們這些使用者直接判斷 App 有沒有在更新,若超過一年、兩年以上都沒更新,那其實可以合理推測此 App 未來可能成為孤兒,不太適合使用,因為平台、網路環境等不斷更新,App 若不即時更新,應該會有很多 Bug 出現。
後來 Shopify 是有推出官方認證的標籤如 Built for Shopify,也是可以參考看看。只是無論是哪種產品,需要了解的是:
- 以前覺得好用,未必現在就覺得好,競品越來越多,相比之下就會發現
- 持續不斷挖掘與嘗試新的 App,慢慢「刷新自己的 App 清單」
- 競品越多,以結果而言:對終端使用者是好事,選擇變得更多而不會落得「沒得選的窘境」,如此也才能讓開發者持續精進,越來越懂得「聆聽使用者的回饋」
- 挑選與篩選 App 時,「看評價」只是其中一種方式,Shopify 官方自己推出的 App 應該有一半以上評價都不到 3 顆星,但實際用了以後有些沒有心中預期那麼糟,「端看需求而定」。
所以若沒有團隊支持而獨立架站的話,最理想的情況還是:能親自去測試,並廣泛研究 Google 到的資料、社群分享等,精選出屬於自己的 Shopify App 清單。
相比 Shopify App,像是 WordPress 外掛、Themeforest 就有相當豐富的資訊提拱給使用者評估是否能選到穩定、優質的數位產品。另外一種解法:安裝 Store Leads Chrome Extension 在 Chrome 瀏覽器,啟動後就可以在瀏覽 Shopify App Store 時看見每個 App 的下載次數、使用趨勢等,可以閱讀官方說明文件。
Shopify 畢竟還是第三方平台,網站能備份的東西其實有限
若不是工程師或也不想付費使用備份功能的 Shopify App,至少能手動的備份的項目有:
- Shopify Theme:點擊備份後會寄到你的 Admin 信箱,至少還可以將原始碼保存下來,尤其客製化一堆程式碼和安裝一堆 App
- Shopify App 如有使用頁面編輯器 PageFly:辛苦建立了很多頁面萬一有人或自己不小心刪除了某些頁面,那真會欲哭無淚,全選後輸出可以將設定格式備份下來,「但圖片無法」!
……(未來會繼續新增)
實戰經驗分享,而非僅止於網路資料整理
我很重視實戰經驗,因為真的是實際去做一遍後才會發現不是每款外掛都適用於自己的網站,因素與變數太多了,且有些外掛還過時卻依然存在於被推薦的清單中,作者本身若不是真的實際用過體驗過,單純只是從很多網路文章篩選做個重點整理而已,這樣是不能提早了解「潛在的實際問題」,所以跳下去 Make your hands dirty 吧!
行文至此,接下來一週內會持續更新內容,因為內容有點多,所以分幾天寫完這一篇文章,歡迎隨時回來逛逛 XD!預告的內容主題如下:
未來預計分享的 Shopify 電商網站相關主題
Shopify 電商網站設計與建置的流程
說明:概要描述架設 Shopify 網站的過程與設計方法、使用的工具。我會根據此文中那張圖「網站進度表」的每個階段在做什麼的工作內容,以及思考方式與原因進行簡介。
可以參考此篇:Shopify 網站設計流程與時間規劃
Shopify SEO 怎麼做?
- 在執行長期的 SEO 規劃或找 SEO agency 之前可以先做好的事。
- 原來用 Shopify 建置的網站,sitemap 檔案連結是:https://www.your-shopify-domain.com/sitemap.xml
- 網站的 sitemap.xml 和 robots.txt 檔案會自動產生。
可參閱官方文件:SEO 概覽、改善搜尋引擎最佳化 (SEO)、The Beginner’s Guide to Ecommerce SEO
Email Marketing — MailChimp 電子報行銷自動化設定
有設定過 EDM 系統的人通常是寄出電子報,還可以測試標題的 AB Testing,而實際使用 MailChimp 設定自動化行銷的相對應該會比較少。我會針對電子報行銷自動化做一個設定示範,也會分享我從哪裡學習到這些設定技巧。
更多的主題待續發酵中…
執行網站專案常用工具推薦
專案管理:ClickUp
簡介:An all-in-one suite to manage people, projects, and everything in between. Start for free! Stop switching between multiple tools. With ClickUp, manage everything in one platform。 Amazing 5-Star Reviews。Collaboration & Reporting。Does What Others Can’t。
說明:我使用過很多套專案管理工具來統整團隊、任務執行規劃、內外部資源等,後來發現 ClickUp 之後,就不用 Asana(另外一套工具)了!這家公司真的很自信十足,立志要成為第一,打趴所有潛在對手,請看此競品比較表,而且動不動就在更新軟體,速度超快,真的是很驚人!功能越來越強,而價格依然不變,非常有感。目前已經用了至少十個月以上,相當滿意,而我就被轉換了 XD!因為我在使用十個月後決定付費。但有個需要注意的地方:若你使用的是其桌機版 App,則當網速不快或當專案檔案太多的時候,開啟與執行速度會稍微延遲,這時改用網頁版瀏覽應該就會比較順暢。
連結:前往瀏覽
創意設計:Adobe Creative Cloud
說明:只要是設計師應該幾乎每個人都必備的 Adobe 系列軟體,尤其是 Photoshop、Illustrator、Premiere Pro、After Effects,廣泛應用在視覺影像設計必用,用在平面印刷、網站設計的影像合成與修圖、圖示製作,影片剪輯或動態影像 Motion Graphic 等,彼此相容整合提升效率。看了官網好幾年,幾乎沒變過的就是立即購買即享有第一年的 6 折優惠 XD”。透過 Adobe Creative Cloud 可以一次管理與下載所有軟體直接使用,隨時更新相當方便,也可根據需求只選購單一軟體。
連結:前往瀏覽
網頁設計:Figma
簡介:Build better products as a team. Design, prototype, and gather feedback all in one place with Figma.
說明:用途相當多元,雖然此軟體原本是被定位在協作的 UI 設計上,但我廣泛用在打造網站地圖、Wireframe 線框圖、網頁視覺設計、流程圖,以及與客戶、團隊共同協作編輯的使用上。達到遠端開會高效率、大幅降低溝通成本與時間成本,並且是我大腦「記憶的延伸」,可以放很多筆記在裡面,太強大啦!用了 Figma 之後,就回不去了,以往使用 Photoshop、Sketch、Axure 都沒有這個來得驚嘆!另外想了解其豐富的生態系外掛 Figma Plugin,可以參考這篇文章:資深網頁設計師常用的 Figma Plugin 推薦
連結:前往瀏覽,免費註冊
圖庫影音素材:Envato Elements
簡介:Unlimited downloads of stock videos, royalty-free music, photos, graphics, graphic templates & more. The only creative subscription you need.
說明:Envato Elemetns 素材包含攝影、平面設計、圖示設計,到影片模版、音樂、音效、簡報、字體、3D 模型等皆無限下載,每個月只需美金 16.50 元,相當豐富實用!儘管攝影圖片不能跟專門的圖庫網站如 Shutterstock、iStock 等相比,但還算能應付大部分的需求(相對於專業級圖庫,還是可以省不少成本),重點是除了照片之外,還有影音模板、音樂、簡報範本等,全面而實用,可以非常有效率且經濟實惠地處理各種需求。
我個人使用 Envato Elements 至少也有三年了,通常應用於平面設計、網頁設計、社群媒體等。因為專業級圖庫真的還是很高的成本哎!所以大部分的案子通常還是 Envato Elemetns 搭配其他免費圖庫使用,而除非特定的要求或內容,才會去購買高貴的圖片。
連結:前往瀏覽
常見問題(持續累積中)
新舊版型升級注意事項為何?
1. 版型升級後,等於是另外建立一個全新的網站,所有設定都要重新設定
儘管有部分可以用程式碼複製貼上,但還是得謹慎,因為新舊版型程式碼架構非常不同,所以很難一鍵完成
2. 舊的「客製化程式碼」需要逐一設定到「新的版型中」
很多我們自己手動撰寫的程式碼如 Liquid、CSS、JavaScript 等都必須找出來,然後設定到新版型「對的地方」中
3. 所有 Shopify App 都需要逐一檢查,必要時「需要重新設定」,原因如下:
- 有些 App 只會指定安裝到特定版型,所以新版型要重新安裝
- 部分 App 安裝步驟比較瑣碎,會需要「手動置入程式碼」
- 部分 App 沒有提供讓我們安裝在「開發商店」中,亦即不讓我們安裝在 Sandbox 環境下執行測試,所以這也會造成一定的麻煩
結論
先以版型本身的設定與視覺排版為主,這個可以直接在 Shopify Admin 後台進行大部分的「新舊客製化程式碼轉移」。雖然在 Sandbox 環境下的「開發商店」進行也是可以,但就會卡部分 App 無法先設定,如前所述
可以參考此篇:Shopify 版型升級或更換注意事項
網站中如果有中文跟英文,字體設定上可以分開嗎?
這問題說來複雜,情況特多,若以下說明還是不清楚,可以來信留下你的網站實際需求是什麼、如何運作等細節、截圖,以方便我更容易評估與提供建議。
- 中英文字體在網站上無法分開「一次設定」。有個例外,就是若是使用多國語系的方式例如安裝了多國語系的 Shopify App,則可以觀察看看是否在網頁程式碼中是否多了一些關鍵 class 名稱,若有,就可以針對不同語系一次設定不同字體。
- 若是使用版型內建的設定或手動寫 CSS 指定某些文字字體才可以,但這不切實際,因為整個網站有超多中英文夾雜,不可能一個一個手動,維護上也提高時間成本、人力成本。當然,若網站只有一兩頁左右,那可評估看看。
- 若是用平台架站如 Shopify 或 WordPress,不是每個文字都容易被單獨選取出來指定字體,很多局部的內容是很難甚至無法執行,沒事的話不會非常堅持進行,那樣有可能會需要直接更改版型或外掛底層程式架構,以長期而言,同樣會造成維護成本過高,然後很難找到其他人願意接手。
備註:沒事的話不會去用程式修改 Shopify App 或 WordPress Plugin,當該 App 開發商更新後可能又會被覆蓋掉甚至造成問題,畢竟,那是其他公司在維護的 ^^” 除非永不更新了,但 Shopify App 會自動更新,而長期而言 WordPress Plugin 不更新的話會造成安全上的隱憂。
網站字體設定:基本執行方式
- 主要根據這個網站是以哪一國語言為主來指定字體,其餘局部的地方可再了解平台、版型、外掛等可行性與限制來評估是否適合設定其他字體。
- 就設計而言,網站字體基本設定 2 種即可:一個為標題字體(h1~h6),一個為內文字體。頂多針對特出需求進行局部的「特別設計」與「指定第三種以上的字體」,例如某些行銷活動的銷售頁或 Landing page、或只針對 CTA 按鈕(CTA: Call to action,行動呼籲)等
- 其實無論是平面設計或網站設計,一個畫面出現 3 種以上字體,請謹慎服用,尤其是網站。
備註 1:設定整個網站字體時,是可以針對標題、內文等進行設定,有些版型或 Shopify App、可以選取局部區塊進行設定獨立字體。
備註 2:儘管有些版型可以讓字體設定可以切很細,但相對而言也造成「執行的時間成本高」,反而寫 CSS 指定字體才是極致高效率的表現。
是否直接找外包進行網站的客製化功能或客製化設計?
- 客製化網站功能要找工程師(可能是前端或後端,依需求評估),但在找工程師之前,先研究有沒有 Shopify App 可以滿足需求。
- 客製化網站設計通常可以找網頁設計師,但要看是網站的哪些部分以及未來容不容易維護,不是所有部分都建議進行直接修改(例如有些會牽動到 Shopify App)。若貴公司沒有會寫 CSS 的設計師或工程師,則不建議進行過度客製化的程式碼修改,不僅帶來維護上的費時費力,且效益不大。若在現階段沒有足夠的人力資源,那先以產品力為主,以打造核心產品或服務、行銷策略為優先,網站互動特效、精美的視覺為後。
如何挑選網站設計公司?
說明:每個人都有自己找網站設計公司的判斷方式,在這邊我是以「身為網頁設計師」的角度來判斷。看過很多重視設計的客戶踩雷的原因是因為他們以為找的是網站「設計公司」,但其實該公司主要是工程師組成的,可能沒有一個視覺設計很強的設計師,也可能是該公司的強項是行銷,但為了擴大客源也會接其他營業項目的案子。所以我判斷的思路如下:
- 了解該公司的團隊組成:看團隊組成就知道該公司的「強項」或「主力」應該是什麼。我非常重視團隊,也相信只有團隊一起努力才能成大事。
- 了解該公司的強項是什麼:通常我聽到「什麼都行」的這種答案,我都會三思,每家公司都有自己的主力營業項目和強項,不太可能樣樣精通。
- 了解該公司的設計作品:通常請該公司提供「設計作品」大概就能判斷五成是否符合需求。
但也要注意的是,即使該公司有提供網站作品,也要進一步了解該公司處理的是這個網站的哪些部分,因為也有可能只是處理這個網站的局部功能而非整個品牌網站的視覺設計。除了看作品集外,再進階詢問該公司的「設計流程與方法」、「設計師如何執行」、「設計概念」等之類的實務問題,問幾個網頁設計相關的問題以及從對方的回答就能立判其虛實與了解程度。
以上的方法也是我在為公司建立網站設計團隊時,面試來應徵「網頁設計師」時非常重視的關鍵,把「該公司」換成「該設計師」即可。
為保持客觀評估,原則是不打斷面試者、不提出引導性的問題、不用當下同意或反駁對方的想法,只需要靜靜地聆聽對方如何回答與表現即可,讓對方忠實呈現自己,我也更能得到客觀的「數據」來判斷是否符合職位需求。
備註 1:平面設計師和網頁設計師的差別?若找平面設計師執行「網頁設計」,那極有可能造成後續網站實際執行上的困難。這兩個領域與經驗真的不同,未來會再詳細整理一下差異在哪裡。
備註 2:當然若你的需求是想找一家可以統包所有服務的公司,不僅省力省事和溝通成本,那其實也有不少人會找可以處理所有業務的公司例如整合行銷或廣告公司等,因為只要對一個窗口即可。
如何找到產品發布的日期?How can I see what date a product was published?
方法一、在商店網址後加上 /product.json 即可,並且搜尋 “created_at” 就可以逐一找到每項產品「建立的日期」,搜尋 “published_at” 則可以找到該產品「發布的日期」
方法二、安裝付費 Shopify App:Xporter Data Export Tool
參考資料:How can I see what date a product was published? – Shopify Community(此方法從 Shopify Staff – Julie 的回答中整理出的,她在 12-11-2019 03:42 PM 回應)
Shopify 網站的結帳頁(Checkout page)可以多出自訂欄位(Custom field),讓消費者可以留言?
不行,目前只有使用 Shopfiy plus 方案才能客製化結帳頁面。相關討論可以參考官方討論區:Custom field at checkout。
Shopfiy 商店因為一些原因要暫停使用,可否暫停一段時間,之後再恢復上線?
如果您是商店擁有人且您的商店具有資格,您可以使用 Shopify 管理介面暫停營運或完全關閉您的商店。有三個選項可以執行:
- PAUSE AND BUILD:繼續以 $9.00 USD/月的價格打造您的商店。顧客依然可以造訪您的商店,但他們無法進行購買。
- 暫停 90 天:保留所有資訊無須支付訂閱費用。顧客將無法看到您的商店,且您無法進行任何變更。
- 取消訂閱並關閉商店:完全關閉商店並取消您的 Basic Shopify 訂閱方案。
詳情請參考 Shopfiy 官方文件以了解更多。
Shopify 的 Blog 功能滿陽春的,有沒有好用的 Shopify App 可以加強?
目前沒找到真正值得付費使用的部落格功能相關的 Shopify App
部落格最基本常見的功能有文章分類、文章標籤、相關文章、側邊欄位等,其中左右側邊欄的彈性設定、相關文章、最新文章在不少官方 Shopify 版型中沒有或不完整。除了直接找比較強的 Shopify 版型之外,例如 Minimog 版型的部落格功能基本的都有,而 Kalles 版型的部落格功能更進階一點,可以嵌入產品資訊,直接瀏覽此 Demo。但若原本使用的版型就很陽春,只好先往 Shopify App 尋找,以下是我快速測試的清單並附上概要的評語:
- 測試清單
- Related Blog Posts:免費,設定簡單,但樣式陽春,需要 CSS 設計。
- Pro Blogger:樣式與功能比 Related Blog Posts 多一些,可以將相關文章設定在產品頁,費用每月 5.99 美金。
- Better Related Blog Posts:感覺跟 Related Blog Posts 差不多,就沒測試了。
- Blog Studio:文章編輯器不好用,而且還不能設定 h1~h6,設定標題還滿基本且需要的。
- DropInBlog ‑ SEO Friendly Blog:費用不便宜,每年要 $228 美金或 $468 美金,功能看似強大,但似乎又不足以值得投入這樣的費用,有些缺點如相關文章功能需要最貴的方案、原本已經發佈的文章無法使用新編輯器設定,亦即需要重新設定、會有首頁是沒錯,但網址不好看,會有這樣的路徑 /a/blog 等問題。
- 其他相關文章 Best Blog Apps for Shopify in 2021:文章標題是 Best… 開頭,但實際使用後沒一個真正好看或好用的 Blog Apps,所以這類文章明顯是在做 SEO 流量使用,真的僅供參考,意思是網路上的資訊最好都要實際測試後才能判斷是否符合自己需求且能長期購買使用。
- 結論
- 若真的要用,頂多選免費的 Related Blog Posts,就增加個相關文章的功能,設計樣式用 CSS 設定好看一點。
- 若要付費的頂多選 Pro Blogger,每月費用 5.99 美金。
- 要我選的話,我會直接用 WordPress 架設部落格經營內容,彈性且客製化功能強大。
網頁速度分數一直不高,怎麼辦?
有關網站分數問題:目前經手過的數個 Shopify 網站分數都差不多不會太高,整個網站建立完成之後再來看 Shopify 後台的測速皆很難超過 60 分,那分數真的不是首先要顧慮的 ^^ 實際上網站只要開啟對使用者來說是順暢的,至少這一步沒問題即可。很多 SEO 公司都會說很重要需要提高,這句話是沒錯的,但實務上,即使真的沒達到那嚴苛的及格分數,網站運作好、產品好、行銷好,其實足矣,未來再逐步優化那分數也沒問題!
Google PageSpeed 一直以來都好嚴格,很多美國高科技公司的網站也很難通過 Google 的及格分數(假設我們設定 60 分為及格,滿分為 100),所以真的只能盡力,且當參考值即可。不過我相信一定有神人可以做到,若有發現會在這邊分享 XD
除了使用嚴師 Google Page Speed Tool 之外,通常我會先用此兩個測速工具測試一下網站速度:
- Pingdom:https://tools.pingdom.com,設定目標:看能否至少達到 80 分以上
- GTmetrix:https://gtmetrix.com,設定目標:看能否至少 B 以上
這些測速工具都可以用用看,其中最有價值的是他們會列出「可以優化的項目」,可以先從最好著手的地方開始,例如很多架站的人最常忽略的「圖片優化」事項。Shopify 官方文件也可以閱讀一下,有分能控制和不能控制的部分,如文件說明,改善線上商店速度。我其實也遇過很多網站圖片沒有經過優化與裁切,就直接將攝影師的原始檔上傳到網站中,這就會造成網站主機的負擔。所以通常在檢查網速時,第一個我會先檢查該網站的圖片使用方式。很多人都說理想是在 100KB,但在實作上真的太難了!所以我的原則是:一張至少不要超過 1MB (1MB = 1000KB)記得都要去 TinyPNG 優化一下,我之前有一篇文章有分享:如何製作與優化網頁圖片?。
若是自己架站,則可以控制的部分就滿多的,例如用 WordPress 架站,並且自己購買主機,會有很多快取外掛和主機端的設定方式可以試圖去解決很技術的問題。下圖提供參考我每次執行任何一個任務時都會紀錄、研究、分析過程:
Shopify 的確還可以再研究看看有沒有其他「較容易」的方式進行網站速度優化。最後有關「網站瀏覽體驗」的問題:
- 第一個動作:先連去網站上實際體驗,是否真的瀏覽感覺很慢,然後請朋友測試看看,最後再找實際的 TA 所在的國家或城市瀏覽看看,「至少這個實際體驗不要感覺很慢」
- 第二個動作:使用用測速工具,然後根據所列的項目能優化的部分先優化,不能的部分或很技術的部分再請在此經驗很多的工程師分析看看
問官方 Shopify Support,看他們如何建議
找有提供此服務項目的 Shopfiy Expert,看他們有沒有好建議
有些 Shopify App 會提供試用期,每次按開始試用的時候,會顯示「x 天之後以每月 x 元價格訂閱」的確認頁面,如果在試用期結束之前刪除應用程式,是否就不會自動收費?
基本上是。即使如此,盡量還是先找該 Shopify App 的文件說明,通常會有提供移除時應該注意的事項,以及附加說明移除後就不會產生費用。
Shopify 文件說明:Some apps modify the theme of your online store. You should check to see if the app requires additional uninstallation steps before you remove the app from your store.
為了測試功能,不斷安裝與移除多個 Shopify App,這樣做會造成什麼問題?
有些 Shopify App 移除後產生多餘的程式碼或檔案,未來「可能」會影響到其他的 App 使用、造成網站部分頁面「壞掉」,因此會需要額外的步驟才能「完整移除」,例如移除 PageFly 時,會需要進入程式碼區進行刪除檔案,請看說明。
分享一下我第一次發現有這種問題(如下圖),例如安裝了 Shopify App — Locksmith 但用不到了,照理說要按照官方的移除說明完整移除 App,但來不及了,所以只好進入程式編輯器手動修改,超麻煩!我有將「事後免搶補救」的執行步驟記錄起來,前往瀏覽。
購買 Shopify 版型後會有內建的字體,這些字體也可以用在其他地方嗎?
說明:字體的版權有分電腦(Desktop)、網站(Webfont)、App、電子書(ePub)等等,可以參考 MyFonts 的版權購買方式。例如若你只有購買該字體的網站版權,就不能在網站以外的地方使用。
Shopify 官方回應:通常官方提供的免費 Shopify 版型和 Shopify Font Library 所列的字體都可以使用在所有 Shopify 的線上商店中。而若購買的是第三方公司提供的版型(例如在 Themeforest 購買),則要確認購買合約中提及的字體使用範圍。
而 Shopify 有跟 Monotype 合作提供商家使用其公司的版權字體,但這些 Monotype 字體只能使用於所有在 Theme Store 中的 Shopify 版型中,不能使用在其他地方,亦即你必須在 Monotype 網站購買版權才行,也可以考慮 Adobe 的 Typekit。(參考:Hundreds of new fonts now available across Shopify)
參考 Shopify 社群問答:Font Copyright (Usage in Pictures and Videos)
另外,若真的有非常想用的字體但要付版權費,而沒那預算的話,可以考慮直接 Google Fonts。例如很熱門使用的標題字體 Helvetica Neue,可以考慮用 Google Fonts 的 Roboto 替代。要找出替代字體的方式可以在 Google 搜尋關鍵字如 Helvetica google font alternative,就會有很多推薦可以參考,如 10 Free Google Font Alternatives to Popular Fonts。
最後,提醒一下在使用字體時要嚴謹,不要心存僥倖囉!參考兩篇文章:被吉發函的創作者,字型廠商恐成最大贏家?創作者避免字體侵權的攻略、YouTuber 拍影片用華康字型被追討授權費,可商用免費字型報你知
如何確認 Shopify 的主機連線狀態
畢竟 Shopify 有自己的主機,若想知道主機有沒有出問題或連線中斷等,可以到 Shopify Status 查看,右上角還可以登入,直接看你的 Shopify 網站有沒有連線問題。
產品無庫存了,如何設定「貨到通知」?
一是通知消費者,產品可以買了、已經補貨了;一是通知商家庫存快沒了,需要補貨。根據此兩種通知進行分類,以下分別列出可以參考使用的 Shopify App,注意價格和限制,並實際試用安裝,才有辦法確認比較符合目前需求的方案。
對消費者 Customer
需求描述:產品若已經完售了,使用者可以在產品頁上點擊一個按鈕叫做「貨到通知」,留下信箱或手機號碼後,而當商家又補貨時,消費者會透過電子郵件、簡訊等收到通知。
功能:產品缺貨,一旦商家補貨,就會通知消費者。
Shopify App:Back In Stock ‑ Restock Alerts(推薦)
- 概述:Send Back In Stock notifications on Email,SMS,Push & Messenger
- 評價:4.95 顆星 (625 評論)
- 提供免費方案。 7 天免費試用。
- 前往安裝:連結
- 官方文件:連結
- 版型整合 Theme Integration:與很多官方和熱門版型相容,如 Prestige、Wokiee 等(此處的「整合」意思是安裝完 App 後會自動設定完成,不用手動安裝或請官方協助安裝)
- 備註:也可以升級到 Enterprise 方案,就可以開啟產品數量快見底時,通知 Store Owner
Shopify App:Back In Stock: Customer Alerts
- 概述:Notify your customers when products are restocked: Email & SMS
- 評價:4.95 顆星 (393 評論)
- 提供免費方案。 14 天免費試用。
- 前往安裝:連結
- 官方文件:連結
- 版型整合 Theme Integration:已整合的 Shopify 版型(但似乎有一些沒有被列表出來,所以可以安裝此 App 後去後台看看)
- 備註:安裝時有些版型有整合過,所以可以自動安裝。而其他版型可以手動安裝或請官方協助。
對商家 Store Owner
需求描述:產品若已經完售了,使用者可以在產品頁上點擊一個按鈕叫做「貨到通知」,留下信箱或手機號碼後,而當商家又補貨時,消費者會透過電子郵件、簡訊等收到通知。
功能:產品快沒貨了,會通知 Store Owner
Shopify App:Notify Me
- 概述:Get notifications for out of stock products
- 評價:4.55 顆星 (130 評論)
- 前往安裝:連結
- 每月 $4.99 起。 14 天免費試用。 可能需支付額外費用。
如何在 Shopify 設定多組優惠碼?
需求描述:能否同時套用一組以上的優惠碼?目前 Shopify 每張訂單最多只能使用一組優惠碼。
Shopify App:Stack Discounts(設定超快,不到五分鐘)
- 評價:5.0 顆星
- 實際使用經驗:目前用過最簡單、最容易安裝和設定多組優惠碼的 App,功能非常非常單純,主要使用 Shpoify 新增 Discount codes 即可。可以限制使用幾組優惠碼、最多折扣的金額或 %。若使用的版型沒有安裝成功,可以尋求官方協助安裝。
- 前往安裝:連結
Shopify App:Discount Ninja(設定起來要人命,使用體驗複雜頭痛難耐,令人卻步)
- 評價:目前 4.2 顆星
- 實際使用經驗:其中一個功能竟然可以同時使用一組優惠價折扣碼和免運費折購碼。評價不錯,其中有兩個功能可以再確認一下,就是使用多組優惠碼
- 前往安裝:連結
因為看到其描述可以使用多組優惠碼,所以想來測試一下:
- Discount stacking: The ability to combine multiple discounts in a single cart
- Cart promotion code field: Allow customers to enter (multiple) promotion codes on the cart with our custom discount field
重要功能測試:Stack promotions and Shopify discount codes at checkout(官方文件:Checkout discount field、Stacking Discount Ninja promotions and Shopify discount codes)
但可惜的是,這款也跟 Shopify App — Sales Rocket 衝突,導致使用時 Cart page 的新增 Coupon 欄位無限迴圈,無法正常使用!意思是:
這款 Shopify App — Discount Ninja 的確可以符合多組優惠碼的使用,但,要注意是否會跟其他功能類似的 Shopify App 相衝突!只能二擇一的意思囉!
注意事項
- 是否與安裝的版型(Shopify Theme)相容?若不相容,則需要手動安裝或請官方幫忙安裝程式碼,有免費和付費方式。
- 這款跟 Shopify App — Sales Rocket 衝突,無法同時運作(之後再找時間驗證一次)
Shopify App:Discounts Combine
- 評價:這款 App 或許能解決,但評價不高,目前平均才三顆星,且近期負評很多。
- 實際使用後:限制的確不少
- 前往安裝:連結
實際使用後:限制的確不少
- 必須在 cart page 執行,且不能在 checkout page 運作
- 此優惠碼在 Shopify 本身建立時必須設定不被限制使用一次
- 這款跟 Shopify App — Sales Rocket 衝突,無法同時運作
如何針對不同語系的網頁分別設定最佳字體?
一般我們想將網站例如 Shopify 或 WordPress 等建立多國語系,會想要針對不同國家設定適合該語言最適合的字體,才會獲得在網頁上的最佳顯示。例如繁體中文使用 Noto Sans TC,簡體中文用 Noso Sans SC,英文或許就用 Roboto 等之類的設定。
設定方式
但實際執行會面臨到一些問題,以下兩種情況列出解法:
- 若是每個語系分別建一個站,那就分別設定字體即可,沒什麼大問題。
- 若是一個網站透過 Shpoify App、外掛或純程式撰寫的方式建立的多國語系,則會需要一些語法幫助執行。以 Shopify App — Translate My Store 為例,安裝完之後的確可以設定多國語系,但似乎大部分這類的翻譯 App 都沒有這個功能:「針對不同語系設定不同的字體」。若你在使用的時候發現是這種狀況,則可以透過 CSS 語法針對多國語系的網頁分別進行客製化設定。
網頁中的標籤 html 若有屬性 lang,則可以執行,通常安裝完多語系 App 就會出現(若沒有的話,就…要再想想了),範例語法如下所示:
/* 針對 US 美國頁面設定 CSS */
:lang(en-US){
font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif
}/* 針對 TW 台灣頁面設定 CSS */
:lang(en-TW){
font-family: "Noto Sans TC", "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang TC", "Helvetica Neue", Helvetica, Arial, sans-serif;
}/* 針對 CN 中國頁面設定 CSS */
:lang(zh-CN){
font-family: "Noto Sans SC", "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", Helvetica, Arial, sans-serif;
SVG 圖片檔禁止上傳到 Shopify 使用,該怎麼辦?(現在已經可以直接上傳 SVG 檔了)
Shopify 真的禁止 SVG 圖片「直接上傳」到網頁中。首先為何有些圖片會想使用 SVG 圖檔格式,而非使用 JPG 或 PNG 檔?通常攝影照片就直接用 JPG,而有透明背景的素材則用 PNG,但像是向量圖示等無論有無透明背景,用 SVG 格式可以保證邊緣不模糊。
下圖中看得出左右哪一張圖比較清晰嗎?
解法一
將 SVG 先上傳到 Shopify 主機中(Settings > Files),就會產生圖片連結,然後再到網頁中的編輯程式碼模式編輯 html,將該連結寫在 <img> 標籤中即可。Shopify 的 Page 或 Blog posts,只能使用編輯程式碼模式 編輯 html 才能設定完成,無法直接透過工具列上的置入圖片(Insert Image)。但若用 Shopify App 頁面編輯器如 PageFly Landing Page Builder 中,倒是支援直接上傳 SVG 圖檔。
解法二
將 SVG 丟到 Chrome 瀏覽器中,然後右鍵開啟「檢視原始碼」,將原始碼整個複製起來貼到 Shopify 頁面的「程式碼模式 Show HTML」中即可。但要調整其圖片位置與尺寸,須加入一點 CSS 語法 style=”width: 100%;”,這樣在行動版網頁瀏覽時圖片不會超出兩邊,而是等比例縮小(當圖片很大時,例如超過 500px 以上就有可能切到,端看每個人的手機解析度大小而定);若要置中,再加上 text-align: center; 即可。
注意事項
- 此方法若若寫點 CSS 語法會更容易編排圖片位置與尺寸。
- 儘管這方式好用,但因為一張圖的 SVG 語法又臭又長(如下圖),將其語法直接貼入程式碼頁面中,容易造成編輯程式碼時小小的不便。
備註:若未來有發現或有人分享更好的設定 SVG 圖片,會再分享出來。附帶一提,在 WordPress 中可以安裝外掛即可解決,不用複製語法到程式碼編輯器中處理。
如何移除 Shopify 的快速結帳按鈕 (Express Checkout Buttons)?
說明:需求是不想在 Shopify 網站上顯示快速結帳 (Express Checkout) 功能,亦即「動態結帳按鈕」(Dynamic checkout buttons),例如不想使其出現在產品頁或結帳頁面 (Checkout page),在設定過程中會有一定的限制與注意事項。
執行
注意事項:記得在執行過程中,要確認是否生效,要用 Chrome 無痕式視窗進行確認,亦即不要在登入 Shopfiy 帳號的情況下進行驗證,才能看到真正使用者看到的「畫面」
1. 隱藏產品頁的快速結帳按鈕
作法:通常透過所安裝的版型內可以隱藏,取消勾選即可,看在自訂版型中有沒有類似 show dynamic checkout button 或 express checkout 之類的選項。
2. 隱藏結帳頁的快速結帳按鈕
說明:設定比較麻煩,因為一般 Shopify 方案是無法編輯與設定結帳頁 (checkout page) 的,除非你購買的是 Shopfiy Plus 方案 (每個月月費 2,000 美金起),不然大部分的商家是無法自行改變 checkout page 內容。
作法一:在 Shopify 的「付款設定」中不設定任何快速結帳例如 PayPal,若已安裝那直接停用或移除。此方法乾淨利落、簡單明瞭。參考資料:動態結帳按鈕 – Shopify 說明中心
作法二:若不想移除快速結帳如 PayPal,則須透過一些語法解決。但此語法儘管能隱藏快速按鈕在結帳頁 (Checkout page),但使用者在購買過程中沒有經過購物車頁 (Cart page),則結帳頁還是會出現。
此方法僅在客戶直接從購物車頁面結帳時才有效(啟用購物車抽屜或購物車模式,或通過外部鏈接結帳不能保證此方法有效)
語法參考
/* hide express checkout button on checkout page */
<style>
.additional-checkout-buttons {
display: none;
}
</style>
{% if additional_checkout_buttons %}
<div class="additional-checkout-buttons">
{{ content_for_additional_checkout_buttons }}
</div>
{% endif %}
/* END - hide express checkout button on checkout page */
參考資料
- Remove The Express Checkout Buttons From First Checkout Page (PayPal, Apple Pay, Google Pay) – Shopify Community
- How to remove Express Checkout button from checkout page on Shopify basic plan?
可否在 Shopify 電商網站銷售產品,且只使用 Amazon 的 FBA,但不在 Amazon 網店上架產品?
官方客服回應是可以的:You can use Amazon FBA even if you are not selling on Amazon, as in just for the fulfilment? Sure! 參考文件:Fulfillment by Amazon。
只使用 Amazon 的倉儲和物流但不上架產品到 Amazon 網站上,可用 Amazon 的 MCF(Multi-Channel fulfillment)
*若有名詞使用錯誤的地方歡迎跟我說喔!感恩!
*亞馬遜物流 Fulfillment by Amazon,簡稱 FBA
架設在美國的 Shopify 網站,可否在網站後台設定一個在美國以外的倉庫是手動出貨,第二個倉庫是使用 Amazon FBA?
情境:若購買者是美國當地的消費者,則由位在美國的 Amazon FBA 出貨;若購買者是美國本土以外的消費者,則由位在其他國家的某自有倉庫自行手動出貨
答:待研究……
已更新 Shopify 網頁內容,但到頁面瀏覽時卻還是舊的內容
Shopify 網站會有快取(Cache)功能,若發現剛編輯完頁面內容並儲存後,結果回到網頁上發現內容沒有變,那可以使用 Command + Shift + R 清除快取刷新頁面(Windows 使用者:Ctrl + Shift + R),一兩次以上測試看看,應該就沒問題。
此方法適用於一般網站,例如有裝快取外掛的 WordPress 網站或使用有預設快取功能的網站主機架站。
如何提高 Shopify 網站的安全性?
若網站業績越來越好、消費者資料也越來越多,應該會開始很怕網站被駭?至少可以考慮「開啟雙重驗證」當作最登入帳號的基本防護。可以使用不同方式擷取登入時所用的驗證碼:
- 啟用簡訊雙重驗證
- 啟用驗證器應用程式雙重驗證
- 啟用安全金鑰雙重驗證
例如主要驗證方式選擇「應用程式驗證」,備用驗證方式選擇「以簡訊傳送至備用手機」,設定過程相當快速。讓網站安全再提升!
其他網站防護相關的 Shopify App 文章參考:5 Ways to Secure Your Shopify Store、The Best Shopify Security Apps — 6 Apps To Ensure Your Store Is Secure
更多的問題持續整理中…有想了解的主題也歡迎留言、訂閱或寄信給我,我會再找時間研究看看囉!(最近爆忙,但會繼續分享我的實戰經驗!大家一起學習吧!衝一發!)
Shopify 有趣的特色功能(挖掘中…)
詐騙分析
說明:Shopify 有個滿有趣的功能!(其他架站平台應該沒有?!)後台每一筆訂單頁面右下方有個「詐騙分析」的資訊欄位。訂單的完整分析資料會列出所有指標。這些指標會以綠色、紅色或灰色圖示標示,藉此幫助您辨別不同的行為類型。
可查閱官方文件說明:詐騙分析,竟然還有很多防詐騙的 Shopify App 可以安裝使用。
若你身邊的朋友也想要學習 Shopify 架站或網站設計,歡迎分享此篇文章給他們呦!讓更多人熟悉 Shopify 強大的生態系,逐步在臺灣發展更成熟!
若你是平面設計想轉職網頁設計師或從未熟悉網站開發程式的行銷人員,想了解網頁程式開發是怎麼一回事,極度推薦六角學院的線上課程:使用 HTML、CSS 開發一個網站,上完之後會有初步的概念,不僅可以開始看懂網頁的基本語法,有助於執行網頁設計介面時的實際作法,更能提升與工程師的溝通效率,而不致於完全雞同鴨講。若是完整的基礎學習則可以再修此兩門課:一變應萬變:RWD 響應式網頁設計、使用 jQuery 打造互動性網頁動畫效果
針對 SEO 初學者、初入門的人,可參考 Hahow 的線上課程:SEO 白話文:不懂程式也能學會的 SEO 秘密,上完後在知識與觀念上扎實打下基礎,接著進階的是了解整合 SEO 搜尋引擎優化和 Google Ads 關鍵字廣告的行銷策略:客戶主動找上門!全面佈局的搜尋引擎行銷策略,然後學習網站分析工具 Google Analytics 課程:GA4 新手完全攻略!用數據分析下商業決策,從做中學優化網站 SEO,學習效率倍增!有興趣的話再加入 Line 社群一起討論:SEO 資源彙整 / 學習,歡迎蒐藏並分享給你的同事們我持續更新的「SEO 免費學習資源」、「爾文 SEO 觀察室」。閱讀書籍的部分則超級推薦:SEO 超入門:教你免費又有效的網站行銷好點子
Irving 爾文的網站內容為何定期汰舊換新?
- 因為要講清楚一個概念且面面俱到其實需要花一定的說明,漏掉一個都有可能「被誤用」,我這邊只能盡可能寫成文字,並同步更新在我的網站中,內容通常每個月會定期汰舊換新。
- 從 SEO 概念來經營內容,並結合「真實的使用者體驗」來優化內容。
- 我個人經驗是尋找一個問題時,繞了半天發現某篇文章不是最佳解,因為「已過時」,這就讓進行 Gogole 搜尋的使用者非得搜尋更多結果、進行篩選與過濾才會避開「為了 SEO 而 SEO 的文章」
- 別誤會唉,我沒有說為 SEO 而 SEO 不好,因應不同的產業、不同需求與策略就會有不同的作法。沒有絕對的對與錯,只有不斷地優化。
加入 Line 的學習社群
成為網頁設計師 | Irvinglab 爾文實驗室
- 簡介:邁向網頁設計師之路,了解網頁設計的基本概念與實作經驗交流與分享,無論是行銷人、工程師、平面設計師等想要了解更多「網頁設計」都歡迎加入討論。
- 網址:https://share.irvinglab.com/be-a-web-designer
Shopify 網站設計與架站學習交流 | Irvinglab 爾文實驗室
- 簡介:分享主題從網站規劃、設計到建立等相關內容,透過學習交流與經驗分享,讓彼此成長更加快速,主要以 Shopify 建立電商網站為主。
- 網址:https://share.irvinglab.com/shopify-line-group
WordPress 網站設計與架站學習|Irvinglab 爾文實驗室
- 簡介:學習 WordPress 網站設計與架站,分享實作經驗與交流。
- 品牌網址:https://share.irvinglab.com/wordpress-line-group
SEO 資源彙整與學習|Irvinglab 爾文實驗室
- 簡介:閱讀 SEO 就像喝水一樣,習慣建立與自然地吸收。
- 網址:https://share.irvinglab.com/seo-line-group
加入 WhatsApp 的學習頻道
Shopify eCommerce Web Design 網站設計學習交流|Irvinglab 爾文實驗室
- 簡介:分享主題從網站規劃、設計到建立等相關內容,透過學習交流與經驗分享,讓彼此成長更加快速,主要以 Shopify 建立電商網站為主。
- 品牌網址:https://share.irvinglab.com/shopify-whatsapp-channel
精選文章
Shopify
- Shopify 台灣金流、電子發票、物流與超商取貨解決方案
- 用兩個月打造 Shopify 客製化網站設計
- Shopify 網站設計流程與時間規劃
- 如何客製化 Shopify 網頁設計排版
- PageFly 初入門:快速建立 Shopify 網頁
- Shopify 版型升級或更換注意事項
SEO
WordPress
Web Design
Web Server
AI、設計與行銷工具
設計 Design
- Figma:UIUX 設計師和網頁設計師首選必用的線上設計協作軟體,若你是行銷人、專案管理、團隊主管、遠端協作等也都非常適用!大幅提升執行效率、降低溝通成本。最近發現一個很讚的 Figma Plugin,並且我已經購買:Table To Figma,可以串接資料庫大量建立圖片,例如串接 Google Sheets、Notion 等,而且是一次性付費!優惠不知道何時,可以去瀏覽一下。而 Musho AI 這款 Figma 外掛則是則是結合 AI 自動產生網頁設計圖,雖然很棒,但其實現存已經有爆多 Design Template 可以使用,而且更精緻,未來就看其能否推出殺手級的功能。
- Untitled UI:現成的 UI 套件,使用 Figma 的設計師一套即用,可以參考其架構與設定,多多觀摩!The world’s largest and most popular Figma UI kit. Kickstart any project, save thousands of hours, and level up as a designer.
- Fotor:線上 AI 影像修圖和去背是專攻的強項,平面設計與社群模板 Template 也都有,AI 系列工具強大內建,包含:Image Generator、Face Generator、Art Generator、Photo Effect Photo Enhance、Background Remover、Object Remover、Avatar Generato 等。我當時是想找 AI Mockup 產生器發現此款,完全被打中!
- Canva:線上完整的平面設計工具集錦,若團隊沒有設計師,那 Canva 真的是神助攻!解決行銷、社群、平面設計、簡報等需求,版型一應俱全
- Placid.app:競爭對手是 Canva,兩者提供近乎相似的線上設計工具 Automations for on-brand creatives
- Creative Market:這個平台是目前看過擁有許多種類高質感的設計素材商店,雖然 Canva 擁有的設計範本也不錯,但若說 Canva 是 80 分的素材,那 Creative Market 就是 90 分 High-quality Stock Photo, Graphics, Fonts, & Design Templates
- Envato Elements:只要訂閱之後,就可以無限下載所有的付費資源素材,包含圖片、影片、音樂、音效、平面設計、插圖、簡報模版等,當遇到緊急專案需求時或作為靈感來源都相當便利!Envato 終於推出 AI 生成式圖片了! AI ImageGen 簡介:使用 AI 和 Envato Elements 為專案打造令人驚歎的獨特視覺效果。獲得無盡的靈感,突破創意障礙。以任何可以想像的風格生成令人驚歎的圖像…只需一個提示即可!超棒的是 AI ImageGen 包含在 Envato Elements 中,無需額外費用。
- Themeforest:擁有豐富的 WordPress 和 Shopify 版型等資源,品質還不錯,強烈推薦!此外也是有販售設計素材、圖片、音樂音效等,但強項還是版型。
- Coolors:色彩靈感來源,快速建立色票與漸層的配色工具,上傳任一圖片擷取其色票、配色對比度確認、現成色卡一覽無遺直接使用等,The super fast color palettes generator!
- Iconfinder:8,400,000 多個免費和進階向量圖示、插圖和 3D 插圖。官網表示使用者知名的公司有 Google、Nike、Netflix、Adobe、Microsoft、Spotify、Amazon、Lego 等。我瀏覽了不少感覺相當有質感的 Icon 圖示庫,有各種檔案格式直接下載,也有免費的圖示們可以使用,官方也有 Figma 頁面可以直接複製!
網域註冊 Website Domain
- GoDaddy:選擇網域建議到全球最大最主流的 GoDaddy 平台購買,然後再串接到 Shopify、WordPress 或你用的架站平台。然後也不建議直接在架站平台本身購買網域,之後若要遷移網站或不想使用此平台時,網域會被綁定在平台中。所以網域和架站平台分開單獨選擇比較理想。若有網域選擇障礙或相關問題也歡迎寄信給我或透過社群傳訊息給我。
網站架站 Website Builder
- Super — Create Websites with Notion:若你是 Notion 的使用者或設計師,或想快速簡單且 No code 建立一個自己的網站或作品集,以 Notion 為主要編輯內容與排版,非常適合透過 Super 打造網頁頁面!。Super.so 是一款 No-Code 工具,專為創作者設計,讓使用者能夠輕鬆地將 Notion 資料庫轉換成美觀且功能豐富的網站。透過 Super.so,使用者無需技術背景即可自訂網站設計、調整樣式,並整合 SEO、行銷工具等功能。平台支持自定義域名、響應式設計,以及各種第三方工具,適合想要快速建立個人品牌或專案展示網站的創作者。
- Framer:輸入文字,數秒內即可生成網站的 AI 工具!這對設計師來說值得使用!Framer 是一個專為設計師和開發者打造的視覺網站設計工具,讓使用者能夠輕鬆設計、開發並發布網站。它提供了無需編碼的直觀介面,支持拖放式設計和即時預覽,還能與各種互動功能、動畫和第三方工具整合。Framer 適合用於創建高度自定義的網站,無論是個人項目還是商業用途,都能以快速、高效的方式完成網站開發與設計。
- Relume:有使用過的 AI 工具,整合 Figma 和 Webflow,用 AI prompts 指令秒速建立網站地圖、Wireframe,在提案、討論網站架構、靈感發想等效率大幅提升!Relume 是一款 AI 網站建置工具,讓設計師能以更快的速度設計和構建網站。使用 AI 作為設計輔助,非取代角色,用戶能在幾分鐘內輕鬆生成行銷網站的網站地圖與線框圖,提升設計效率。
- Siter.io:又一款免程式碼的網頁編輯器 No-code website builder,介面有點類似 Figma,Siter is a no code website builder for creatives. Create fully responsive portfolios and landing pages directly in the browser.
- Webflow:這款應該是相當多設計師知道的,Webflow 是一款強大的 No-Code 網站設計和新潮的架站平台,打造客製化品牌官網或作品集網站都不是難事,有大量的 Webflow Template 版型可以直接套用,有免費和付費版。還有一個強項是動態設計、互動設計的功能設定,但用過之後深深覺得對「網站初學者」不友善,建議可以先使用免費方案操作後台體驗一下!Webflow 還提供強大的 CMS、電子商務功能和 SEO 工具,使其成為設計師、開發者和行銷團隊的全方位網站建置解決方案。後來整合了生成式 AI 功能,Webflow AI 賦予更強大的架站能力,幫助設計師執行效率提升。
- Readymag:發現有相對極少比例的國外頂尖設計師有在使用這個架站平台。Readymag 是一款基於網頁的設計工具,讓使用者無需編寫代碼即可輕鬆創建網站、線上雜誌、作品集和展示頁面。該平台提供直觀的拖放介面、豐富的排版和動畫選項,並支持響應式設計。使用者可以自訂設計、添加互動功能,並且能夠快速發布專業級的視覺作品,非常適合設計師、創意人和品牌建立富有創意的網頁內容。
- Ycode:它的出現主要是對戰 Webflow 和 Framer,除了提供價格相對優惠一些,功能面還不容小覷,綜合比較下主打的 CP 值!不過動態方面 Webflow 還是比較強。
一頁式網頁 Sales Landing Page
- Journey – engage, close, and onboard customers in one link:這軟體工具有質感!快速打造網頁,並透過單一連結就可以快速共享資源,讓內部銷售變得容易。講述更好的故事,贏得更多交易,創建一個旅程,將潛在客戶轉化為擁護者,並促成更多銷售。這工具很特別,不僅可以用來打造流暢的銷售頁,整合更多常用的第三方工具之外,還可以作為建立內外溝通的網頁、嵌入到各個網站中,簡單易用。
防止數位廣告惡意點擊 Click Fraud Protection & Detection
- ClickCease:點擊欺詐保護和檢測軟體 Click Fraud Protection & Detection Software。可以檢測並阻止您的 Google 廣告活動中的點擊欺詐。自動阻止競爭對手和機器人浪費點擊付費廣告預算。至少有 40% 的互聯網流量是非人類的。機器人無意轉化,只會浪費廣告預算。阻止虛假點擊可以提高流量品質,並可以帶來更多轉化。
生成式 AI 影像、圖片、影片創作 Generative AI for Creative AI Tools
- Leonardo AI:用 Leonardo AI 釋放創造力,以前所未有的品質、速度和風格一致性為專案創建高品質的視覺資產。比起依附 Discord 才能使用的 AI ,我還是偏好用直覺友善的網頁介面、良好的使用體驗作為長期使用的工具。AI Image Generator – Create Art, Images & Video
專案管理 Project Management
- ClickUp:我使用過很多套專案管理工具來統整團隊、任務執行規劃、內外部資源等,後來發現 ClickUp 之後,就不用 Asana 了!這家公司真的爆發力旺盛,立志要成為第一,動不動就在更新軟體,速度超快,很驚人!功能越來越強,而價格依然親民。One app to replace them all Get everyone working in a single platform designed to manage any type of work.
線上影片錄製 Online Screen Recorder
- Tella:全方位螢幕錄製工具,讓您在 Mac 和 Windows 上輕鬆創建精彩的產品演示、教程和課程,可以錄製完後直接分享連結,超級方便!尤其可以用在跟客戶或客服講解說明使用,省下不少另約會議時間,無論是團隊內部或外部溝通、錄製線上課程使用、線上簡報等都適用!
雲端儲存 Cloud Storage
- Dropbox:目前用最久也最愛的、主要在使用的雲端儲存軟體。經過了多年,新增了不少功能,其中一個最常用的就是其推出的螢幕錄影功能 Dropbox Capture,搭配鍵盤快捷鍵快速錄製影片,錄完就直接雲端了,速度超快,分享連結都自動產生,這成為我快速跟客戶與團隊成員溝通的最佳方式!
品牌標誌設計 Logo Design
- Looka:用 AI 產生無數個品牌 LOGO,有夠方便至極!平面設計師的工作再度受到挑戰…… 我自己因為有數個新品牌正在建立中,先免費試用,覺得有夠讚,後來我就選擇了付年費方案也不貴,直接取得整組 Brand Kit 素材,還可以隨時進後台編輯與修改!Design a Logo, make a website, and create a Brand Identity you’ll love with the power of Artificial Intelligence. 100% free to use.
網站分析 Web Analytics
- Fathom Analytics:非常需要這款網站數據分析工具,因為 Google Analytics 最多只能儲存十幾個月的數據,那我經營網站十年以上,不就一半以上的數據都沒了?!為了找一款可以儲存所有數據工具,比較多種多款之後選擇了這款,不僅將舊版 GA 也能將新版 GA 全部匯入進去,數據全部備份啦!興奮!歡迎前往免費試用 30 天!先用用看,好用再選付費方案即可。我是選了付費方案,年費可以省 17%。
- Plerdy:全方位的網站優化分析工具,目標為提供網站優化與轉換率,擁有如此多的功能費用也算平易近人,包含 Heatmap、Session Replay、NPS、Ecommerce Analytics、Event Tracking Tools、Funnel Analysis、SEO Checker、UX assistant、Ecommerce Analytics 等,而 AB Testing 完全免費!
- Hotjar:這個應該大家很熟悉,知名的網站分析工具,介面設計質感俱佳!Hotjar 是一款功能強大的網站分析工具,透過熱圖(Heatmaps)、錄影(Recordings)、調查(Surveys)和反饋(Feedback)等功能,幫助使用者深入了解網站流量背後的真實使用者行為,促進網站的優化和轉化率提升,並且對於數據安全性十分重視。Hotjar 提供多種工具,幫助使用者分析網站流量及使用者行為,而不僅是數字數據。該工具被全球超過 1,300,000 個網站使用,有助於提高使用者體驗和轉換率。Hotjar 的熱圖功能讓用戶直觀了解哪些網頁元素受到關注並能帶來銷售;支援與 Google Analytics、Unbounce、Zapier 等其他工具的整合,增強數據分析環境。 使用 Hotjar 進行調查可以直接了解使用者跳出原因,從而做出相應改進。
A/B Testing 測試(網站轉換率優化工具)
- VWO:這款是我夢寐以求的 AB Testing 主流軟體,其功能的專業程度與順暢度相當高!可以先用免費試用三十天,有提供免費版和付費版,免費版可以當作小試身手,若專注在網站轉換率搭配大量測試各種設計與文案版本測試則可以考慮升級為付費版本。官網著名客戶有 Disney、Amazon、iPROSPECT、SimilarWeb 等。VWO 是一款專為數位優化打造的全面性平台,提供企業使用 AB 測試和使用者行為分析來提升轉化率。透過實時數據、個性化體驗和跨裝置測試,VWO 幫助公司在網站和應用程式中找到提升用戶體驗的最佳策略。該平台支持無限次優化測試,與現有技術無縫整合,並採用 Google Cloud 平台保障數據安全與隱私。
- Mida:Mida 是一款輕量級且強大的 A/B 測試平台 Lightweight A/B Testing Tool,專為企業打造,能與 GA4 無縫整合,通過可視化編輯器和代碼編輯器進行無限測試。不會減慢網站速度,避免頁面載入時間過長,以免影響轉化率。同樣有可視化編輯器,設定容易上手。它提供快速設置並不影響網站性能,讓行銷人員不需依賴開發人員即可輕鬆優化網站轉換率。Mida 提供詳細報告,並支援多種工具整合,幫助企業基於即時數據精確決策,提升業務表現。
- Convert:這也是一款非常扎實、重量級的的 AB Testing 主流軟體,跟 VWO 時常被拿來比較,官網註明客戶有 Sony、Audi 等。Convert Experiences 是一款專業的 A/B 測試平台,提供全面實驗功能,包括網站與應用程式測試、目標設定及 API 整合。其輕量且直觀的設計,讓用戶能夠快速進行測試並提升轉換率。平台支援服務端實施,解決 cookie 問題,並提供詳細報告及隱私合規。Convert Experiences 適合跨團隊運作,支援企業成長。
- Plerdy:全方位的網站優化分析工具,其中 AB Testing 功能完全免費!太佛心!Plerdy 是一款強大的轉換率優化工具,結合 UX 和 SEO,幫助網站提升用戶行為分析並轉化訪客。透過 AI 技術強化的功能,如網站熱圖、使用行為錄製重播、彈出視窗和 NPS 調查,企業可以更深入了解用戶行為並優化網站性能。該工具提供簡便的安裝與即時報告,適合各種規模的企業使用。此外,Plerdy 支援多種平台和 API 整合,如 Zapier、MailChimp 和 Hubspot,讓網站優化變得更有效率。
- ABtesting AI:有用過 AB Testing 在優化網站嗎?來試試 AI 的 Testing,有免費方案可以測試
- ClickMagick:在找 AB Testing 工具時發現 ClickMagick,也看了其他 YouTuber 簡介,感覺相當易用,找時間實測
電商分析 Ecommerce Analytics
- Shulex:電商網站的競品分析工具很多,這款我試用了一下分析 Amazon 產品頁可以自動分析評論、產出該產品的人物誌、正面和負面評論的項目與比例等,讓我可以快速了解產品的使用者輪廓與痛點,滿推薦使用看看。
- PPSPY:Shopify Store Spy & Shopify Dropshipping Monitor Tool 發現這工具真是大開眼界,可以用 AI 尋找 10 倍利潤的熱賣產品,主要針對 Shopify 商店,包含快速監控對手、進行市場研究、熱銷產品研究找到利基市場、進行大量店舖主題設計參考等
音訊轉文字 / 文字轉語音 AI Voice / Text To Speech
- Murf AI:文字轉影音,聲音質感優質,有整合於 Canva 使用。AI Voice Generator – Versatile Text to Speech Software
- Rask.ai:AI 影音配音工具,告別昂貴的翻譯員。目標是用人工智能提供不亞於人類的配音和翻譯體驗。Translate video & audio Unlock Worldwide Potential with AI
- ElevenLabs:提供創新的 AI 音訊解決方案,專注於文本到語音、語音複製和配音等功能,旨在提高內容創作的可及性和自然性。AI 語音產生器可生成高品質的語音,適應不同語境和風格,並致力於消除語言障礙。該平台在多個創意應用中已獲得成功,例如提高有聲書銷售和創建 AI 輔助教學工具。此外,ElevenLabs 透過最新技術合作,推動創作流程的提升,並致力於安全和可靠的產品開發,促進全球的業務和創作人員。
- Speechify:頂尖的 AI 文本轉語音應用程式,支持多種平台,包括 Chrome、iOS、Android 和網頁應用,且擁有超過 250,000 則五顆星評價。它能將文本轉換為自然流暢的語音,使用者可以依自己的需求聽取內容,並且具備同步功能,方便隨時隨地收聽。該應用程式不僅能提高閱讀效率,還能幫助使用者克服學習障礙,如閱讀障礙和注意力不足等。Speechify 還提供多種功能,包括實時語音配音、語音複製及 AI 影片編輯,促進內容創作的便利性和多樣性。
AI ChatGPT
- Monica – ChatGPT AI Assistant | GPT-4o, Claude 3.5, Gemini 1.5:一站式 AI 助手 ChatGPT 中文版 Monica AI 是整合 ChatGPT 功能,針對台灣用戶打造的全能 AI 生產力助理。 AI 聊天,AI 製圖,AI 翻譯,AI 寫作,網頁/PDF文檔/視頻閱讀工具,搜索引擎助手,從工作到生活全方位賦能。Monica 是一款整合多功能的 AI 智慧助手,涵蓋聊天、寫作、翻譯、摘要以及 AI 繪圖功能,專為提升用戶效率而設計。它利用先進的 AI 模型,如 GPT-4 和 Gemini Pro,為用戶提供精準且即時的回應,滿足日常生活與專業需求。Monica 不僅支援多平台使用(如網頁、桌面、行動裝置),還具備強大的摘要功能,能從長篇文章或網頁內容中快速提取重點,幫助用戶節省時間並掌握關鍵資訊。無論是需要創作、翻譯多語言內容,或生成圖片,Monica 都能以高效與智慧的方式協助完成任務。
- Sider AI:第一次用就驚艷!良好體驗勝過直接用 OpenAI 的帳號介面,可以快速總結網頁頁面內容、選取片段文字快速翻譯、摘要 YouTube、直接嵌入在 Chrome 瀏覽器側邊欄、有提供 Mac 使用者快捷鍵呼叫、有行動應用程式可以下載、有桌面版應用程式直接使用、反應速度很快、可以切換不同 AI 工具如 OpenAI 的對手 Claude 和 Google 的 Gemini 等也有歷史記錄等,這些功能直接開啟直接使用,大推! 還有針對 YouTube 影片可以迅速總結文字和影片速覽,改用中文發音! ChatGPT Sidebar, GPT-4, Draw & Web accessMyMap AI
心智圖 AI
- MyMap AI:通過簡單的聊天介面將你的文字想法轉化為視覺化內容,如心智圖和演示文稿。非常適合學生、教師和專業人士使用,無需設計技能。節省時間的工具,用於輕鬆協作的視覺創作
SEO 搜尋引擎優化
- SearchAtlas:Search Atlas 是一個綜合的 SEO 工具平台,提供超過 40 種工具和報告,幫助解決各種行銷挑戰。其功能包括內容優化、AI 內容創作、排名追蹤、關鍵字研究、技術 SEO 檢查、反向鏈接分析、頁面 SEO 增強、外部鏈接機會識別、報告和競爭對手研究等。平台還支援項目管理和本地 SEO,旨在提升網站的可見性和優化流程,從而增進整體的搜尋引擎排名績效。其中值得注目的還有 OTTO SEO 是一款創新的 AI 搜尋引擎優化工具,旨在顛覆傳統 SEO 操作。透過Search Atlas,數位行銷機構可以簡化策略,提升工作效率,並迅速實現有機行銷的成功。該平台提供自動化的 SEO 最佳實踐、技術更新和內容生成,顯著提高了用戶的網站排名和流量。用戶報告顯示,使用 OTTO SEO 後,其 SEO 性能提升了 15% 至 20%,並在短時間內實現顯著成果。Search Atlas 不僅整合多種功能,還能協助機構減少對多個工具的依賴,進而降低成本和提升效果。
- Wincher:Wincher 是一個專門追蹤關鍵字排名的工具,旨在幫助用戶提升有機搜尋流量。其功能包括每天通報排名變化、識別和探索高流量的關鍵字、提供競爭對手的排名更新,並透過可自訂的報告幫助用戶做出明智的行銷決策。Wincher 還強調 SEO 的價值,幫助品牌和行銷機構找到優質流量,簡化複雜工具的使用,並為用戶提供利於業務增長的見解和資料。該平台目前已有超過10萬用戶,追蹤 165,000 個網站,並在發展中不斷擴展其服務範圍。用一用也是清爽的,提供免費版可以使用,免費版最多追蹤五個關鍵字,可以整合內建於主流的 WordPress 外掛 Yoast SEO 中
- SE Ranking:SE Ranking 是一個專為 SEO 專業人士設計的綜合性平台,自 2013 年以來已獲得超過100萬名用戶的信賴。該平台提供全面的 SEO 工具,包括關鍵字建議、競爭分析、反向鏈接檢查和 SERP 追蹤等,並透過先進的AI技術提供精確數據。SE Ranking 特別適合行銷機構,其靈活的定價方案滿足各類業務需求,並由使用者的反饋驅動持續創新。許多成功案例顯示,使用 SE Ranking 後的企業無論在流量還是排名上均有顯著提升。還有一個很特別的就是可以下載專屬的行動應用程式 Mobile App 下載,隨時隨地瀏覽 SEO 成效數據,相當便利!
- Pro Rank Tracker:另一款追蹤 SEO 成效的工具,介面簡約,瀏覽舒適,有 Mobile App 可以下載,提供免費試用 14 天,SEO Agency Rank Tracking & Reporting Tool
- AlsoAsked:People Also Ask keyword research tool 若要撰寫 SEO 文章,這是一款可以考慮使用的工具,輸入關鍵字後會自動產生樹狀圖表呈現內容延伸標題
- Surfer:SEO 工具,主要可用做 SEO 內容編輯者使用, AI 產生 SEO 文案、關鍵字推薦、SEO Audit 等功能,介面設計滿新穎的,賞心悅目!可以玩玩看,七天內可以退款。
文案 Copywriting AI
- Writesonic:快速創作部落格、廣告、電子郵件和網站所需的內容,並進行SEO優化,這是最令人期待的 AI 內容產生軟體!其中可以安裝 Chrome extension,然後快捷鍵可以直接呼叫輸入視窗,超級方便。即將推出 ChatSonic AI Bot for Businesses: Customer Support AI Chatbot,類似 Chatbase,這類線上客服 AI Chat 比以往的 Bot 還更人性化且反應不會過於機器人。
- Frase:彈指之間用 AI 協助搜尋、撰寫與優化 SEO 文章
網站客服 AI Chatbot
- Chatbase:利用您擁有的知識庫,打造一個AI聊天機器人,並輕鬆將其添加至您的網站中
學術文論研究 AI Academic Research – Read research papers faster
- Unriddle:研究人員喜歡使用 Unriddle,更快地閱讀研究論文,借助 AI 的強大功能,快速查找文件中的資訊、簡化複雜的主題、做筆記和寫作。 在下一篇論文上節省 4 個小時。簡化複雜文件,隨時提問並獲得即時回答 Simplify complex docs, ask questions and get answers instantly
網站多功能工具 Website Widgets
- Elfsight:跨平台各種功能多合一的 Widget,例如 Instagram Feed、Popup 跳出視窗、客製化 Google map 設計等,跟 Common Ninja 相似,但收費方式不同
- Common Ninja:跨平台各種功能多合一的 Widget,例如 Instagram Feed、Popup 跳出視窗、客製化 Google map 設計等
電子報訂閱 Newsletter
- Beehiiv:滿新穎的電子報訂閱工具,相當輕巧。時常被拿來跟 Substack 相比,近年很多國外新創公司、創作者等偏好使用,也是我主要使用的軟體,功能齊全之外,在撰寫內容時介面非常乾淨,相當適合文字創作者的書寫環境。
- Brevo (Sendinblue) – Email Marketing done right:最近剛使用這款,覺得用起來挺順暢的,後台介面簡潔、設定直覺不會混亂,目前用來搜集名單使用測試中,主要將會使用在未來新建立的品牌 WordPress 網站中
- Mailerlite – Create Email Marketing Your Audience Will Love:也是一款簡潔的、容易上手、小巧玲瓏的電子報訂閱軟體。
- ActiveCampaign:Email 行銷、電子報系統(MailChimp 的替代方案之ㄧ)
社群媒體管理平台 Social Media Management Platform
- SocialBee:越來越多社群媒體需要同時管理、排程貼文、觀看成效,若一次要管理五六個以上的渠道,那可以考慮這款,一站整合所有社群帳號在同一個介面,可以同時設定各個社群媒體的貼文內容、發布時間等,還可以整合 Canva 設計圖片、內建 AI 產生文案等功能 AI-Powered Social Media Management Tool – Schedule your social media content with ease, from one place, for all your profiles.
- Content Studio:是一個統一的社交媒體管理平台,讓你可以從一個儀表板管理所有社交媒體。計劃、排程、發現和分析你的社交媒體內容,使用 AI 將內容創建速度提高 10 倍 ,管理和發展社交管道的最簡單方法,使用簡單而強大的多合一社交媒體工具,適合代理商、品牌和行銷人員使用,在更短的時間內完成更多工作。
- Tailwind:一站整合社群媒體和電子郵件行銷,也有生成式 AI 文案、Pinterest 和 Instagram 的排程發佈工具等,跟 SocialBee 有點像,相比之前起跳方案較便宜些 Social Media & Email Marketing Tool
數位簽名 Electronic Singature
- SignWell:讓簽署檔變得如此簡單,從而將周轉時間縮短一半。 使用 SignWell 具有法律約束力的電子簽名解決方案,簡化文檔簽名流程並減少追簽名的時間。Make it so easy to sign your documents that it cuts turnaround time in half.
課堂會議 AI 即時筆記 AI Tutor
- Study Fetch:用 AI 輔助學習,我看到一個很強大的美國課堂實際 Demo 就是教授在台上講課,而這位實測者就打開筆電和 Study Fetch 直接錄音、即時語音轉錄文字,然後即時線上 AI 交談,可以問「剛剛教授在講什麼?」,Study Fetch 的交談回覆就會幫你摘要,太酷!我想這不僅可以用在學校課堂上,平時工作開會等相關場合都可以用的。Revolutionize Your Learning With Ai – Study Fetch transforms your powerpoints, lectures, class notes, and study guides into flashcards, quizzes, and tests with an AI tutor right by your side.
多合一行銷平台 Marketing Platform
- HubSpot | Software & Tools for your Business:國外主流多合一的行銷平台,值得使用看看。HubSpot 提供多種解決方案,旨在幫助企業增長,包括市場營銷、銷售、客戶服務、內容管理、運營以及 B2B 商務軟體。其 CRM 平台整合了各種工具,如市場營銷自動化、銷售管道管理、客戶支援和數據同步,便於用戶合理分配資源並提升業務效能。用戶讚揚 HubSpot 的易用性、訓練簡便及高自訂性,並認為該平台提高了資料透明度和數據驅動的決策能力,成為行銷和銷售的唯一真實來源。
- Simplified:是一款 AI 的 All-in-one 軟體,適合大小團隊的行銷團隊都適合使用並進行協作。提供數百萬張免費圖片、影片和音訊剪輯、數千個設計師版型、支持 30 多種語言的長篇和短篇內容寫作。內容日曆可用於安排和發布社交媒體貼文。有提供「永久免費」的版本,若需要更多的功能可以再升級付費方案即可!An Easy to Use All-In-One App For Modern Marketing Teams
- GetResponse:All-in-one 行銷平台,包含電子郵件行銷 Email marketing、登陸頁建立 Landing pages、行銷自動化 Marketing automation 等功能,可以先註冊帳號使用免費版,覺得需要未來再升級!這軟體類似 Hubspot
消費者研究 Customer Survey
- PickFu:PickFu 是美國消費者在線調研工具,可進行在線的測試、優化和即時消費者調研問卷,取代猜測。透過 PickFu,你可以立即獲取至多 500 條來自美國消費者的意見。通過尋求眾人的智慧,幫助你做出更好的商業決策
- SurveySparrow:全渠道顧客滿意度調查管理平台 Omnichannel Experience Management Platform
- Qwary:全渠道 CX 客戶體驗平台,可幫助企業獲取客戶反饋並通過設計精美的專業調查來衡量 NPS、CSAT 和 CES,以改善購物體驗和產品性能
- Zigpoll – Survey & Feedback Platform:透過調查、電子郵件擷取以及互動式民意調查和表單收集數據。無需程式碼即可在 Shopify、BigCommerce 和 WordPress 上設定。其還有推出 Shopify App 版本 是針對 Shopify 電商網站的使用者可以直接安裝。
市場趨勢 Market Trends
- Exploding Topics:在趨勢成為趨勢之前發現趨勢,發現新的機會。此軟體的共同創辦人兼 CEO 是我非常推崇的國外 SEO 專家 Brain Dean,立馬吸引我的注意力,其官網也有揭露使用此產品的有 Google、Apple、Netflix、Amazon、Samsung 等國際品牌公司。See new market opportunities, trending topics, emerging technology, hot startups and more on Exploding Topics.
表單測驗 Quiz & Survey
- Opinion Stage:建立免費的測驗、投票、表單等工具,視覺質感和功能運作不錯!也有提供付費方案,提高每個月的回應數
- Tally:這款表單提供爆多功能且是免費版就可以使用的,可以是 Typeform 的另一個選擇
- Typeform:質感優雅的線上表單
- NoteForms:專門整合 Notion 的表單建立,其官方網站首頁揭示使用者包含哈佛大學、耶魯大學、現代汽車等都有在用。因為我本身主要使用 Notion 管理專案,這大大方便多了,快速建立表單、蒐集回饋直接存到 Notion,節省不少切換軟體與資料轉移的人力
使用者研究 User Reserach
- UXPressia:快速創建專業的顧客旅程地圖 Customer Journey Map、人物誌 Persona 和影響地圖 Impact Map,還有各種模板可以直接套用。
雲端電話 Virtual Cloud Phone System – Call & Contact Center
- KrispCall:為現代企業提供的人工智慧驅動雲端電話服務。一個具有人工智慧的虛擬雲端電話系統,提供可靠的電話服務。從單一應用程式發送和接收國際及本地號碼的簡訊和 VoIP 通話。
線上客服 Online Chat
- Crisp:面向新創公司和中小企業的首選資訊傳遞軟體,為新創公司和中小型企業提供的資訊平台。在這個平台上,可以實現銷售、行銷和支援的一站式服務:Crisp。功能包含提供知識庫、團隊收件箱、聊天機器人、CRM及其他多種功能,幫助你打造獲得客戶成功的獨特方式。可以整合 Shopify、WordPress,且升級到最高方案還可以整合更多的其他交談軟體如 Line、Facebook Messenger、Instagram Message、WhatsApp、Twitter Message 等,Irvinglab 爾文實驗室官網右下角的線上交談工具就是使用 Crisp。Business Messaging Platform For Startups & SMBs
- Gorgias:借助 AI 驅動的 CX 實現增長,為了發展品牌,商家需要提供能夠建立忠誠度的體驗。線上購物應該像訪問最喜歡的商店一樣個人化和輕鬆。增長取決於創建個人化、準確和快速的客戶對話。可以整合 Shopify、WordPress + WooCommerce 等電商網站。Gorgias 是一個專為電子商務設計的客戶體驗平台,旨在提升品牌忠誠度並推動業務增長。該平台通過集中管理所有客戶對話及自動化 60% 的客戶支持工作,使企業能夠提高效率並專注於重要的客戶互動。此外,Gorgias 提供個性化的客戶回應,並透過 AI 工具支持品牌的獨特風聲與流程,有助於增加轉化率並提升客戶滿意度。用戶反饋顯示,Gorgias 幫助商店節省管理支持的時間及金錢,並轉變客戶服務為創造收入的團隊,已有超過 15,000 家品牌信任並使用該平台。
- Help Scout:線上客服(Zendesk 的替代方案),Help Scout 是一個以客戶為中心的平台,旨在提供卓越的客戶支持及增強團隊效率。該平台特色在於其快速的回應時間,讓使用者在第一年內能提高對客戶消息的回應量 56%,並且客戶滿意度評分比行業平均高出 25%。Help Scout 須以人性化的支持為核心,雖然 AI 技術不斷進步,但團隊的角色在於撰寫更佳的回應並快速解答常見問題。。該平台的設計目的是確保客戶的需求始終受到重視,避免完全依賴 AI 技術,以維持良好的客戶關係。用戶可以輕易上手並在一天內學會使用這個工具。
- Tidio:設計優質的線上交談工具,Tidio 提供的 AI 客戶服務解決方案能夠在無需人力參與的情況下解決高達 70% 的客戶咨詢,從而加速業務增長並提高收入。Lyro AI Chatbot 聊天機器人以人類般的語言在 6 秒內回答客戶問題,並支持多語言溝通,讓企業能夠高效管理客戶服務。Tidio 的即時聊天和幫助台工具能實時與訪客對話,縮短回應時間,提高客戶滿意度。此外,該平台還提供自動化功能,幫助企業提高轉化率,促進銷售和客戶忠誠度。已有超過 30 萬家企業信賴 Tidio 以提升其客戶體驗和業務績效。
- Manychat – Chat Marketing Made Easy:Manychat 的 Instagram 行銷服務,幫助創作者和企業提高銷售和轉換率。透過自動化的對話功能,使用者可以 24/7 回應潛在客戶,並提高品牌曝光和互動。使用 Instagram DM 一對一溝通可以帶來顯著收益,並包含了一些客戶反饋,顯示 Manychat 在提高參與度和銷售方面的成功案例。
線上課程 Online Course
- LearnWorlds:創建與銷售線上課程網站平台
- Teachable:創建與銷售線上課程網站平台
線上社群 Online Community
- Circle – The all-in-one community platform for creators and brands:真的是多合一多功能的線上社群平台,包含討論區、舉辦線上活動、線上課程、線上即時群組對話、為您的社群和內容收費等,還有 AI 驅動的連接和學習 Community AI。比較了多款建立討論區的線上社群平台,Circle 的介面設計簡潔、耐看、聚焦內容與交流,相當推薦!
會員制 Membership
- Outseta – All-in-one membership software:支付、身份驗證、CRM、電子郵件——應有盡有。Outseta 為創始人提供了在幾分鐘內通過其網站、SaaS 產品或在線社區獲利的工具。可以串接 Webflow、Framer、WordPress、Discod、Notion 等。
網站軟體素材資源 Saas Resources
- AppSumo:限時優惠的一次性付費數位軟體販售平台(大幅降低成本)
- MotionElements:專業的影片素材、版型、外掛
- MotionVFX:專業的影片素材、版型、外掛
聯盟行銷 Affiliate Program / Referral Program
- Trackdesk:聯盟行銷追蹤軟體,輕鬆實現合作夥伴主導的成長。這款與市面上各種競品相較,看似擁有更多的優勢,可以研究看看。可以整合 Shopify、WooCommerce、Stripe、Magento 等,也可應用的產業有 Saas 軟體、電子商務、網紅行銷等領域。
- Partnero:市面上有許多建立聯盟行銷的關係管理平台,這款是我看過介面優質、申請註冊流程都相當順暢的一款軟體,可以用用看 The Ultimate Platform for Partnership Management
- Tolt:一個經濟實惠的解決方案,啟動自己的聯盟計劃。Tolt 幫助 SaaS 初創公司建立和運行自己的聯盟計劃。它與 Stripe、Paddle 和 Chargebee 兼容。Affiliate Marketing Software for SaaS Startups
一頁式個人網頁 Online Presence with Liinks
- Liinks:一頁式多連結網頁,整合多個社群、官網的一頁式網站
線上研討會 Online Webniar
- HeySummit:舉辦線上虛擬研討會
線上預約系統 Booking Appointment
- TidyCal:Lifetime deal – AppSumo,一次性付費,終生更新,來自 AppSumo 自行開發,在經營初期想先節省 Calendly 訂閱制費用長期下來的一定成本,可以考慮 AppSumo 這款,雖然在許多進階功能上還沒有追上,但很多基礎功能例如實用的預定月曆會議、整合 Google Calendar、Zoom、PayPal 等就滿實用的
- SavvyCal:這是一款現代的日程安排工具,功能強大、介面直觀且提供頂級客戶支援,適用於任何想要更好的外觀、感覺和更個人化的方式來安排見面時間的人
- SimplyBook:線上預約排程系統 及 App 預約軟體
自動化軟體 Automation
- CopyAI:行銷與銷售的 AI 自動化流程,原本只是單純的文案 AI 產生器,現在轉型為 Go-To-Market AI Platform。 AI Marketing OS frees marketers from low-value, repetitive tasks, giving you time to focus on strategy, creativity, and revenue generation.
- Bardeen AI:結合 AI 的自動化工作流程,整合各種常見 App
- Axiom ai:No code 自動執行網站操作和重複任務
- Repurpose.io:一個貼文自動發佈到多個社群平台,開始有這種需求,以往每次都要一個平台一個平台登入然後貼文 Repurposing content for social media the easy way
- Make:視覺化自動化工作流程,將數據串接等在各種軟體來回穿梭,提升工作效率
資訊圖表 Infographics
- Piktochart:資訊圖表設計工具
跨境收款 Online Payment
- Payoneer 派安盈:安全、快速,一站式跨境收款
- Wise:跨境帳戶,進行國際付款、收款
- Checkout Page:還頭一次看到這種概念,專門打造結帳頁面 Checkout page,但要串接 Stripe 帳號
- SamCart:打造線上快速收款方式,並且要大量模板可直接套用,這邊有 Demo 影片簡介,另外其還有推出線上課程建立的功能。Create an eCommerce storefront with SamCart to make it simple to sell digital products online with innovative checkout and conversion boosting features.
網路爬蟲 Web Crawler
- Apify:Full-stack web scraping and data extraction platform
線上互動產品 Demo 引導 – Interactive Demo Guide
- Guidde:透過 AI 將建立影片文件,滿神奇的!錄製影片後會自動拆解每個步驟,並為每個步驟自動產生標題與內文,然後還會自動產生影片講解投影片,選擇語音自動講解,這軟體用做大量需要錄製軟體操作教學文件滿便利的。Magically create video documentation with AI
- Arcade:線上建立產品互動式 Demo,使用者可以邊聽邊點擊畫面持續往下一個步驟畫面走,非常適用於軟體教學、操作指引,讓初步接觸的人可以有個印象、提升熟悉的效率,透過畫面切換直觀上更容易吸收理解,後台還有使用者的數據查看所建立的 Demo 互動指標 Create Interactive Product Demos – Arcade is an interactive demo platform that allows teams to create effortlessly beautiful demos in minutes.*
- Guideflow:可以製作線上互動式操作步驟產品 Demo 引導畫面,相比於瀏覽圖文教學的文章,互動式畫面切換更有沈浸感 The most advanced interactive product demo platform*
VPN
- Surfshark:Surfshark VPN 最近開始用,還滿好使用的!原本需求是想要瀏覽某些國外網站卻被強制自動轉址,所以用 VPN 解決此問題
Podcast
- Firstory:平台上架、贊助訂閱 與廣告盈利 最完整強大的 Podcast Hosting 省去所有繁瑣上架流程,我們將你錄好的音檔自動發佈到 KKBOX、Apple Podcasts、Spotify 和 Google Podcasts 等收聽平台
- Descript:錄製 Podcast 線上工具,包含影音剪輯、Podcast 錄製、螢幕錄影等功能。There are simple podcast & video editors and there are powerful ones. Only Descript is both & it features magical AI, so you can skip the hard part of editing. Get started for free
- Riverside.fm:專門針對錄製 Podcast 的 All-in-one 線上工具,包含錄製 4K 和剪輯影片。Record Podcasts And Videos From Anywhere
- Podcastle:錄製 Podcast 的線上工具,包含影片和聲音剪輯、聲音轉文字等功能。Podcastle is the simplest way to create professional-quality podcasts. Record, edit, transcribe, and export your content with the power of AI, in an intuitive web-based platform.
手機應用程式開發 Mobile App Development
- FlutterFlow:這個滿強大的,可以直接拖拉式介面建立手機應用程式,直接發佈在 iOS 和 Android,有點像是用 WordPress 打造網站的後台。FlutterFlow lets you build apps incredibly fast in your browser. Build fully functional apps with Firebase integration, API support, animations, and more. Export your code or even easier deploy directly to the app stores!
- AppMySite:這個令人振奮!因為我已經有網站,所以相當有此需求。其主打的功能是將你現有的網站打造成手機應用程式 mobile app,例如將你的 WordPress 或 Shopify 進行轉換(Shopify 即將推出),後來也推出直接客製化 mobile app,有點像 FlutterFlow,估計是相對適合初入門使用者。AppMySite’s no-code DIY mobile app creator powers you to make premium native apps for Android & iOS.
網站開發 Web Development
- CSS Scan 3.0:在進行網站開發時,檢查、複製和編輯 CSS 的最快速、最簡單的方式,跟「檢查元素」說再見——透過滑鼠懸停於任何元素上,即可立即檢查其 CSS,並透過一個點擊複製其所有規則。
- ShipFast – 快速發布你的 App,創辦人在官網闡述自己的故事:我意識到我一遍又一遍地做同樣的事情:設置 DNS 記錄、監聽 Stripe webhook、設計定價部分……因此,我出於 3 個原因建立了 ShipFast:1. 節省時間,專注於重要的事情:建立業務、2.避免令人頭疼的問題,例如以垃圾郵件結尾的電子郵件或等待 3 天才能獲得 Google 批准、3. 快速盈利 – 發貨越多,學到的越多,賺的就越多。The NextJS boilerplate with all you need to build your SaaS, AI tool, or any other web app and make your first $ online fast.
全球隱私法的數據隱私合規解決方案 Compliance Solution
- Termly:全球隱私法的數據隱私合規解決方案,需要合規解決方案,但又不想花費數千美元的法律費用?Termly 的合規套件可以説明您保持最新狀態並遵守隱私法律,例如 GDPR、CCPA、PIPEDA、電子隱私法規等——免費。 Data Privacy Compliance Solution for Global Privacy Laws
購物回饋金 Shopping Rewards
- ShopBack:常常網購的人一定要申請的啦!我時常在 Apple 官網購買 iPhone、MacBook,還有博客來買一堆書、PCHome 買 3C 產品、Hahow 熱門線上課程等,其他還有超爆多的線上商店如蝦皮 Shopee、Yahoo 購物中心、保健食品 iHerb、家樂福線上購物、Klook 旅遊、Booking.com 訂房等等都可以使用,並且累積回饋金後至少 200 元新台幣,就可以轉帳到自己指定的銀行帳戶,超方便!
陸續蒐藏與研究……
有任何想問的問題,歡迎填寫表單留言或寄信給我 irving@irvinglab.com、FB 粉絲團或直接線上交談,我們一起交流、成長!附上我的網頁設計作品,可以來逛逛喔!歡迎加入 Shopify 網站設計與架站學習交流:Line 社群 一起交流與學習!但在美國的用戶無法加入台灣的 Line 社群,所以我也另外建立了 Telegram 社群,兩邊珍貴的經驗會同步分享與整理,或加入專接收資訊非討論的 WhatsApp 頻道。若想進一步了解服務內容,可以加入 Irvinglab 爾文實驗室的 Line@ 官方帳號留下訊息給我們。