高級 Shopify 定制開發如何創造更好的用戶體驗

對於高品質、創新和負責任生產的行李箱、箱包和其他旅行配件的賣家 Paravel 來說，定制功能是必須的。 他們生產和銷售的產品是獨一無二的，因此對他們來說，為客戶提供獨一無二的購物體驗是必要的。

Paravel 需要大量基本的電子商務功能才能通過其在線商店進行實際操作。 最初，它們建立在一個名為 Spree 的開源平台上，因為它是一個開源平台，所以它有很多追隨者和支持者。

與 Magento 等其他開源平台一樣，Spree 是高度可定制的。 它還可以與大量第三方插件和應用程序集成，具有高度可擴展性，並且展現出一定程度的 UI 直覺，使開發適合移動設備的界面變得更加容易。

雖然這只是 Spree 各種功能特性的快速快照，但其中一些特性的成本與其他開源平台相同。 它們的功能可能幾乎是無限的，但它們需要大量的開發時間，甚至需要更多的經驗才能完成。 如果沒有豐富的編碼經驗或開發背景，像 Spree 這樣的平台會很快耗盡資源。

Paravel 需要這種獨一無二的購物體驗，但他們也需要一種開箱即用的解決方案，為他們的電子商務商家提供很多東西。 對他們來說，問題是他們如何才能將他們已經精心設計和開發的電子商務商店從 Spree 轉移到一個更強大的平台？

徹底的遷移過程

在與我們的銷售團隊溝通後，Paravel 決定遷移到 Shopify Plus 就是答案——有一些規定。 除其他外，Paravel 不想體驗遷移帶來的任何負面影響，他們希望他們的新商店能夠提供 Spree 商店的所有功能，然後再提供一些功能。 為此，Paravel 需要的不僅僅是 Shopify Plus 合作夥伴——他們需要 Shopify Plus 專家。

雖然 Spree 提供了幾乎無限的定制選項，但 Shopify Plus 作為一個託管的電子商務 SaaS 平台，可以為他們提供更多。 在 1Digital ^Ⓡ等開發團隊的幫助下，Shopify Plus 可以為他們提供 Spree 提供的所有自定義設置等等。 Shopify Plus 還提供增強的安全功能、保證正常運行時間、快速的站點速度、與第三方應用程序和插件的類似兼容性、接受多種支付選項、巨大的可擴展性等等。 此時，Paravel 的任務是將他們現有的 Spree 商店及其設計和功能轉移到 Shopify Plus。

對於一些人來說，網站遷移的過程是令人痛苦的，但我們知道並非如此。 有數百個成功的遷移在後視和一個開發團隊支持我們的努力，我們知道它可以毫無困難地完成。 只是需要一個徹底的過程。

這個過程是密集的，但沒有什麼是^{1Digital Ⓡ} Agency 不能出色地執行的。 該項目需要遷移 32 個產品字段（包括名稱、描述、圖像、價格等）以及每個 4,000 多個客戶帳戶和訂單。 為此，我們設置了一個臨時 Linux 服務器並編寫了一個自定義腳本，以從其原始站點的 Spree 庫存中提取和分類這些信息。

為了將其轉移，我們創建了另一個自定義腳本以連接到 Shopify API，然後正確導入所有相關字段。 在此過程中和之後，數據被檢查以確保它正確地登陸新商店，這樣不僅不會丟失任何東西，而且會全部填充到它應該去的地方。

我們徹底的流程防止了數據丟失，但流量丟失怎麼辦？ 如果有一件事讓電子商務客戶對平台重構的前景感到失望（即使它會帶來巨大的好處），那就是擔心失去流量或域權限。

幸運的是，我們的遷移過程可以防止對 SEO 造成損害，因為它可以防止數據丟失。 使用 Paravel，就像我們對每個遷移項目所做的那樣，我們收集了與其網站關聯的所有 URL，然後設置 301 重定向到新 Shopify 網站上的關聯 URL。 不出所料，遷移完成後，Paravel 沒有遭受流量損失或排名波動。

支持——以防萬一

遷移到 Shopify 順利進行，Paravel 正在前往具有增強功能和更好用戶體驗的新 Shopify Plus 商店，但為了安全起見，我們在遷移項目中包含了 30 天的免費支持期. 任何擁有經過驗證的流程的 Shopify 移民機構都應該這樣做； 這只是成功遷移策略的一部分。

免費支持期的長度根據項目的範圍而有所不同，但在 Paravel 遷移的情況下，我們分配了 30 天。 這讓他們有整整一個月的時間來調查他們的新網站並解決可能出現的任何遷移錯誤——我們將免費修復這些錯誤。

即使在那之後，我們也允許他們繼續保留，不要求他們交押金； 只需為免費網站支持期結束後他們將記錄的任何更改計費。 像這樣的小事情對確保良好的客戶服務大有幫助，我們的目標是確保遷移順利進行，即使所有內容都經過檢查、仔細檢查和再次檢查。

一個新開發的網站

但遷移並沒有結束。 Paravel 制定了與新網站提供的客戶體驗相關的遷移標準，為了確保這一點，我們必須為他們開發一個全新的 Shopify Plus 網站。

作為他們項目的一部分， ^{1Digital Ⓡ} Agency 的開發人員為他們製作了一個全新的主頁，該主頁更好地整合了品牌，並有助於以更理想的方式定位他們的產品。 它以更新的產品和背景圖像為特色，更好地符合目標市場的興趣和看法。 考慮一下新主頁的圓滑、精緻的印象，下面是舊主頁的靜止畫面。

對於他們主頁的訪問者來說，新的佈局立即引人注目，不僅因為其圖像的卓越美感，而且因為它盡最大努力將 Paravel 產品的價值置於首位和中心。 您還會注意到，新主頁佈局的頂部有一個菜單，這是以前設計中缺少的； 以前訪問他們的產品的方法是向下滾動頁面，找到一個標有“購買該系列”的按鈕。 如上所示，新頁面具有更好的站點導航功能。

向下滾動主頁，訪問者可以通過滑動橫幅查看評論，了解有關流行產品類別的更多信息，甚至可以通過社交媒體查看客戶如何使用產品，如下面的一些屏幕截圖所示。

除了主頁之外，1Digital Ⓡ 在其他幾個系統頁面之上還為^Paravel製作了一個新的類別頁面模板以及一個“我們的故事”頁面。 開發的頁麵包括購物車和結帳頁面、登錄頁面、禮券頁面和“謝謝”頁面。 最後，我們定制了一些內容頁面，包括他們的“FAQ”和“Terms”頁面。

高質量響應式網站設計的重要性對於當今的電子商務至關重要，作為項目的一部分， ^{1Digital Ⓡ}開發人員小心翼翼地為 Paravel 準備了一個更新的響應式網站。 為了提高 Paravel 的用戶體驗，1Digital ^Ⓡ的新響應式設計會自動適應較小的屏幕，並相應地調整文本大小和重新格式化。

高級開發 - 類別頁面功能

當 1Digital ^Ⓡ開發人員傳輸與 Paravel 產品類別相關的所有信息時，我們還添加了一些新功能，以便他們傳遞給客戶，從而改善客戶體驗。

我們在他們的類別頁面模板中安裝了元字段編輯器，以便 Paravel 可以快速更改出現在他們的類別頁面顯示上的一些徽章。 這使他們能夠編輯自定義字段，以便更突出地顯示與“新”、“暢銷書”或“特色”產品相關的促銷活動。

這個看似簡單的功能為 Paravel 的管理員提供了強大的功能，無需與開發人員合作即可快速輕鬆地更改其網站的顯示。 可以給男人一條魚或教授藝術，我們向 Paravel 提供了有關如何使用和管理該應用程序的詳細說明，以便他們即使在項目結束後也能輕鬆進行更改。

同樣，1Digital ^Ⓡ開發人員在 Paravel 的產品系列頁面上創建了產品樣本和快速查看功能。 我們為他們的 Shopify Plus 產品系列頁面創建了一個自定義腳本，該腳本能夠獲取並顯示所需的信息。

這些色板的腳本還確保當客戶單擊與感興趣的顏色相關的色板時，產品圖像將以該顏色顯示。 此外，它將顯示與更改相關的適用定價以及“個性化”的任何選項，或者，如有必要，“缺貨”消息。

高級開發——產品頁面功能

Paravel 非常重視客戶體驗，因此，他們需要在產品頁面模板之外提供大量附加功能，包括幫助個性化購物體驗的附加功能。

因此，作為該項目高級開發方面的一部分，1Digital ^Ⓡ幫助創建了一組新的更好的功能來個性化他們網站上的購物體驗，特別是在他們的產品頁面上。

我們配置了他們的產品頁面模板，使其顯示類似於他們的舊 Spree 商店。 然後，我們創建了一個“添加到購物車”條，該條將保留在產品頁面顯示的底部。 那是容易的部分。

我們還為他們的產品頁面模板開發了一個工具，讓購物者能夠個性化他們的購物體驗並使其更加真實。 除了讓客戶能夠使用上述樣本功能查看給定包（或其他產品）的外觀外，Paravel 還讓客戶能夠個性化他們的產品。

Paravel 對現實工具的轉化促進功能感興趣，該工具可以讓客戶真正看到他們的產品在個性化後會是什麼樣子，因此我們創建了一個工具，讓他們能夠做到這一點。

我們為 Paravel 構建的工具會在客戶訪問產品頁面時顯示帶有“個性化”字樣的彈出窗口然後我們創建了一個工具，使客戶能夠根據字體的樣式和顏色個性化產品會標與他們的首字母。

該工具在客戶點擊“個性化”後在產品頁面上顯示為一個小部件，並且非常容易根據他們的喜好進行操作和定制。 為了確保產品能夠正確顯示個性化設置，我們必須創建一個自定義腳本，以便在產品的正確區域以客戶選擇的樣式準確顯示客戶輸入的字母，如圖所示在下圖中。 作為最後一層功能，我們創建了一個“尼龍模板”，使 Paravel 的客戶能夠使用刺繡字母而不是手繪字母或貼花來定制他們的產品。

我們為 Paravel 的產品頁面創建了更多自定義項，包括通過 HTML 編碼從他們的舊 Spree 商店的產品頁面中實現四個選項卡。 我們還從 Paravel 的 Spree 商店重新創建了“選擇你自己的冒險”功能，這使客戶能夠在其他一些定制的基礎上，通過貼花和手繪設計進一步個性化 Paravel 的產品，以保持出現的原始功能的完整性。他們的狂歡商店。

與關鍵應用程序集成

為了保護新 Shopify Plus 商店的功能並確保流暢、愉快的用戶體驗，1Digital ^Ⓡ Agency 必須將 Paravel 的新商店與其關鍵業務應用程序集成。

除其他外，Paravel 的客戶依賴於 Paravel 能夠通過 YotPo 繪製和展示的評論和推薦，我們確保為他們無縫集成。 Paravel 還嚴重依賴使用 Zaius 來進行客戶參與和 CRM，因此我們執行了該集成以及上述集成。

除此之外，Paravel 還利用了 RJ Metrics 和 Talkable 提供的功能。 這些應用程序為 Paravel 的管理員提供有價值的數據，並允許安全的推薦營銷計劃。

1Digital ^Ⓡ Agency 將所有這些應用程序與 Paravel 的新商店集成在一起，此外還編碼和開發了他們的新 Shopify Plus 網站。 我們完成了這個項目，範圍廣泛，需要遷移和高級定制開發，沒有任何問題。 也就是說，客戶沒有遇到業務過度中斷，沒有流量損失，並沒有出現任何問題，而是搬到了一家新開發的具有高級定制功能的商店。 要做到這一點需要經驗和全面的流程， ^{1Digital Ⓡ 將這}兩者都集成到我們的工作流程中。

完整的解決方案

一些供應商將他們的服務調整為一種或兩種高度專業化的服務，但我們知道電子商務商家面臨的問題是多種多樣的。 如果我們只能提供開發服務，我們將無法將 Paravel 從 Spree 遷移到 Shopify Plus，後者是在線商家的領先電子商務平台之一。 同樣，如果我們僅限於執行遷移，我們將無法按照他們想要的方式定制他們的新商店。

Shopify Plus 設計和開發服務，即使與我們的遷移服務相結合，也只是^{1Digital Ⓡ} Agency 所提供服務的一小部分。 除了我們的 Shopify 定制設計服務之外，我們還提供全面的數字營銷活動，包括極具競爭力、經過深入研究和有針對性的 SEO 和 PPC 活動。

這個成功故事取決於我們能夠將 Paravel 從 Spree 遷移到新開發的具有高級功能的 Shopify Plus 商店。 我們的許多其他電子商務案例研究都側重於其他電子商務平台，例如 BigCommerce 設計和開發、類似的 Magento 服務和數字營銷活動。 瀏覽我們的曲目，如果您想了解我們如何解決您的在線業務所面臨的問題，請致電 888-982-8269 聯繫我們。

下載PDF