Brooklyn 的動態區段
Brooklyn 包含數種可用於自訂首頁版面配置的動態區段。您可以新增、重新排列或移除動態區段,建立頁面的版面配置。您可以在首頁上新增最多 25 個動態區段。
素材輪播
您可以建立首頁投影片輪播,並使用全寬度或配合系列中第一張圖片的高度。
建議您針對投影片使用高解析度圖片。使用 3840 x 2160 像素或更大的圖片,但請勿超過 Shopify 的上傳限制。
由於投影片的尺寸和形狀取決於客戶裝置的尺寸和形狀,因此您的素材輪播圖片在某些螢幕上將會遭到裁剪。請嘗試使用焦點位於中心部位的圖片,以保持每張圖片的重要部分可見。
若要深入瞭解素材輪播圖片的最佳做法,請參閱「上傳圖片」。
素材輪播區段設定
素材輪播區段包括下列設定:
- 投影片高度 - 選擇全螢幕或依圖片調整。
- 自動輪流播放投影片 - 將素材輪播設為自動播放。
- 變更投影片的頻率 - 使用範圍刻度來調整素材輪播的速度。
素材輪播區塊設定
素材輪播的每張投影片均包括下列設定:
- 圖片 - 將圖片新增至素材輪播。
- 圖片位置 - 選擇素材輪播圖片的顯示位置。預設選取中間置中。
- 顯示疊加層 - 在圖片投影片上加上一層顏色。疊加層顏色可讓素材輪播文字便於閱讀。
- 覆加層不透明度 - 使用範圍刻度來選取投影片疊加層的不透明度。
- 文字對齊方式 - 選擇靠左、置中 (預設) 或靠右。
- 標題 - 新增標題到投影片。
- 副標題 - 為投影片新增副標題。副標題會在標題之前顯示。
- 按鈕標籤 - 將含有文字標籤的按鈕新增到投影片。
- 按鈕連結 - 將您的按鈕連結至線上商店的其他部分。
- 素材輪播和文字的顏色挑選器。
自訂素材輪播
- 在 Shopify 管理介面,前往「線上商店」 > 「佈景主題」。
- 點擊 的動態區段 旁邊的「自訂」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 按一下「新增區段」。
- 點擊「素材輪播」,然後點擊「選取」。新的素材輪播區段會顯示在側邊欄,並新增兩張投影片。
- 點擊投影片以選取圖片,並調整投影片的相關設定。
- 點擊「儲存」。
部落格文章
您可以在首頁上展示最多三篇部落格貼文。
秘訣:若要瞭解如何建立網誌,請參閱「為網路商店新增網誌」。
部落格貼文區段包括下列設定:
- 標題 - 為部落格貼文區段加上標題。
- 部落格 - 設定要展示其貼文的來源部落格。
- 貼文 - 設定要展示的部落格貼文數。
- 顯示日期 - 顯示發佈部落格貼文的日期。
- 顯示作者 - 顯示部落格貼文的作者。
- 顯示封面圖片 - 顯示網誌文章的封面圖片。
- 顯示摘要 - 顯示網誌文章的簡短摘要。
- 顯示「查看全部」按鈕 - 新增連結至線上商店部落格頁面的按鈕。
將部落格貼文新增至首頁
- 在 Shopify 管理介面,前往「線上商店」 > 「佈景主題」。
- 點擊 的動態區段 旁邊的「自訂」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 按一下「新增區段」。
- 點擊「部落格文章」,然後點擊「選取」。
- 使用設定來自訂首頁部落格區段。
- 點擊「儲存」。
商品系列清單
您可以在首頁上展示最多九個商品系列。
商品系列清單區段包括下列設定:
- 標題 - 為商品系列清單加上標題。
- 系列商品 - 設定您想展示的商品系列。
將商品系列清單新增至首頁
- 在 Shopify 管理介面,前往「線上商店」 > 「佈景主題」。
- 點擊 的動態區段 旁邊的「自訂」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 按一下「新增區段」。
- 點擊「商品系列清單」,然後點擊「選取」。
- 使用設定來自訂商品系列清單區段。
- 點擊「儲存」。
精選商品系列
您可以在首頁展示來自其中一個商品系列的產品。
精選商品系列區段包括下列設定:
- 標題 - 為精選商品系列加上標題。
- 商品系列 - 設定要展示其產品的商品系列。
- 格狀樣式 - 設定您精選產品的版面配置。
將精選商品系列新增至首頁
- 在 Shopify 管理介面,前往「線上商店」 > 「佈景主題」。
- 點擊 的動態區段 旁邊的「自訂」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 按一下「新增區段」。
- 點擊「精選商品系列」,然後點擊「選取」。
- 使用設定來自訂精選商品系列區段。
- 點擊「儲存」。
附文字的圖片
您可以在首頁上展示圖片和自訂文字。
附文字圖片區段包括下列設定:
- 圖片 - 選擇要新增至區段的圖片。
- 圖片對齊 - 設定您要在頁面哪一側顯示圖片。
- 標題 - 為區段加上標題。
- 文字 - 為區段加上文字。
- 按鈕標籤 - 新增要顯示在按鈕上的文字。
- 按鈕連結 - 將您的按鈕連結至其他頁面或網站。
為首頁新增附文字的圖片
- 在 Shopify 管理介面,前往「線上商店」 > 「佈景主題」。
- 點擊 的動態區段 旁邊的「自訂」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 按一下「新增區段」。
- 點擊「附文字圖像」,然後點擊「選取」。
- 使用設定來自訂您的附文字圖片區段。
- 點擊「儲存」。
精選產品
您可以在首頁上展示商品。展示產品是宣傳新產品或促銷產品的好方式。
精選產品區段包括下列設定:
- 產品 - 選擇要在首頁上展示的產品。
- 顯示子類標籤 - 顯示產品子類標籤 (如「尺寸」和「顏色」)。
- 顯示廠商 - 顯示產品品牌或廠商。
- 文字 - 為精選產品新增文字。
- 按鈕文字 - 為精選產品新增含有文字標籤的按鈕。
- 按鈕連結 - 將您的按鈕連結至其他頁面或網站。
將精選產品添加到首頁
- 在 Shopify 管理介面,前往「線上商店」 > 「佈景主題」。
- 點擊 的動態區段 旁邊的「自訂」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 按一下「新增區段」。
- 點擊「精選產品」,然後點擊「選取」。
- 使用設定來自訂您的精選產品區段。
- 點擊「儲存」。
電子報
您可以將訂閱電子報加入首頁。您可以透過訂閱電子報來收集顧客的電子郵件地址,以供電子郵件行銷活動使用。在 Shopify 網誌上進一步瞭解電子郵件行銷。
將訂閱電子報新增至首頁
- 在 Shopify 管理介面,前往「線上商店」 > 「佈景主題」。
- 點擊 的動態區段 旁邊的「自訂」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
按一下「新增區段」。
點擊「電子報」,然後點擊「選取」。
輸入「訂閱電子報」的標題。
輸入訂閱電子報的副標題。
點擊「儲存」。
地圖
您可以將 Google 地圖新增至首頁,向客戶顯示您商家所在的位置。
秘訣:若要顯示地圖,您必須註冊 Google Maps API 金鑰。
地圖區段包括下列設定:
- 標題 - 為地圖區段加上標題。
- 地址和營業時間 - 為地圖區段加上商店的地址和營業時間。
- 地圖地址 - 設定地圖以顯示商店地點。
- 地圖連結標籤 - 新增連結至您在 Google Maps 上地點的按鈕。
- 顯示圖釘 - 在地圖上新增顯示您商店精確位置的圖釘。
- Google Maps API 金鑰 - 為地圖區段加上地圖的 API 金鑰。
- 圖片 - 新增在地圖未載入時要顯示的圖片。
- 圖片位置 - 設定圖片的位置。
將地圖新增至首頁
- 在 Shopify 管理介面,前往「線上商店」 > 「佈景主題」。
- 點擊 的動態區段 旁邊的「自訂」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 按一下「新增區段」。
- 點擊「地圖」,然後點擊「選取」。
- 使用設定來自訂您的地圖區段。
- 點擊「儲存」。
RTF 文字
使用「RTF 文字」區段提供您要在首頁上顯示的任何文字內容,或嵌入在 Shopify 管理介面建立的任何頁面。例如,您可以透過嵌入部落格頁面來展示即將舉辦的活動,或顯示包含以下內容的頁面:
- 來自您網路商店的嵌入式影片
- 包含商店位置的 Google 地圖
- 商店聯絡資訊。
RTF 文字區段包括下列設定:
寬螢幕 - 減少文字兩端的邊距。
標題 - 為 RTF 文字區段加上標題。
文字 - 新增自訂文字並設定其格式。 如果要展示商店中的精選頁面,請點擊「新增內容」,然後點擊「頁面」。從下拉式選單中選擇要展示作為首頁的頁面。
尺寸 - 設定文字尺寸。
將 RTF 文字新增至首頁
- 在 Shopify 管理介面,前往「線上商店」 > 「佈景主題」。
- 點擊 的動態區段 旁邊的「自訂」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
按一下「新增區段」。
點擊「RTF 文字」,然後點擊「選取」。
使用設定來自訂您的 RTF 文字區段。
點擊「儲存」。
影片
您可以將 YouTube 或 Vimeo 影片新增至首頁。影片可以吸引客戶,讓客戶對您的業務產生興趣。
若要新增影片,您必須找出影片的分享連結:
-
YouTube - Youtube 分享連結如下所示:
https://youtu.be/ZXWgHlnVVEY
。您可以在此 YouTube 說明文章中,瞭解如何複製 YouTube 影片的分享連結。 -
Vimeo - Vimeo 分享連結如下所示:
https://vimeo.com/123456789
。您可以在此 Vimeo 說明中心文章中,瞭解如何複製 Vimeo 影片的分享連結。
影片區段包括下列設定:
- 標題 - 為影片區段加上標題。
- 影片連結 - 為您的影片加上分享連結。
將影片新增至首頁
- 在 Shopify 管理介面,前往「線上商店」 > 「佈景主題」。
- 點擊 的動態區段 旁邊的「自訂」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 按一下「新增區段」。
- 點擊「影片」,然後點擊「選取」。
- 使用此設定來自訂您的影片區段。
- 點擊「儲存」。
自訂 HTML
您可以為首頁加上自訂內容。舉例來說,您可以透過 HTML 設定文字方塊的格式、建立表格,或內嵌來自其他網站的內容。
自訂 HTML 區段包括下列設定:
- HTML - 新增您想在首頁上顯示的 HTML 程式碼。
- 容器寬度 - 設定自訂 HTML 區段的寬度。
- 垂直對齊 - 設定此區段中內容的垂直位置。
將自訂 HTML 新增至首頁
- 在 Shopify 管理介面,前往「線上商店」 > 「佈景主題」。
- 點擊 的動態區段 旁邊的「自訂」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 在 Shopify 應用程式中,點一下「商店」。
- 在銷售管道畫面上,點一下「線上商店」。
- 點一下「管理佈景主題」。
- 在 的動態區段 旁,點選「自訂」。
- 點一下「編輯」。
- 按一下「新增區段」。
- 點擊「自訂 HTML」,然後點擊「選取」。
- 使用設定來自訂您的自訂 HTML 區段。
- 點擊「儲存」。