Brooklyn 的動態區段

此頁面列印時間為 Jan 18, 2021。如須最新版本，請至 https://help.shopify.com/zh-TW/manual/online-store/os/using-themes/themes-by-shopify/brooklyn/sections/home-sections。

Brooklyn 包含數種可用於自訂首頁版面配置的動態區段。您可以新增、重新排列，或移除動態區段建立頁面的版面配置。您可以在首頁上新增的動態區段，最多可達 25 個。

素材輪播

您可以建立首頁投影片輪播，並使用全寬度或配合系列中第一張圖片的高度。

建議您針對投影片使用高解析度圖片。使用 3840 x 2160 像素或更大的圖片，但請勿超過 Shopify 的上傳限制。

由於投影片的尺寸和形狀取決於客戶裝置的尺寸和形狀，因此您的素材輪播圖片在某些螢幕上將會遭到裁剪。請嘗試使用焦點位於中心部位的圖片，以保持每張圖片的重要部分可見。

若要深入瞭解素材輪播圖片的最佳作法，請參閱「上傳圖片」。

素材輪播區段包括下列設定：

  • 自動輪流播放投影片 - 將素材輪播設為自動播放。
  • 變更投影片的頻率 - 選擇變更投影片的頻率。
  • 圖片 - 將圖片投影片新增至素材輪播。
  • 疊加層 - 在圖片投影片上添加一層顏色。疊加層顏色可讓素材輪播文字便於閱讀。
  • 不透明度 - 設定疊加層的不透明度。
  • 副標題文字 - 為投影片新增副標題。副標題會在標題之前顯示。
  • 標題文字 - 為投影片新增標題。
  • 按鈕文字 - 為投影片新增含有文字標籤的按鈕。
  • 投影片連結 - 將您的投影片連結至線上商店的其他部分。
  • 配合第一張圖片 - 將素材輪播的高度設為配合第一張圖片的高度。
  • 圖片位置 - 選擇圖片中最重要的區域，當作投影片的焦點。
  • 文字對齊 - 對齊投影片的文字。
  • 素材輪播和文字的顏色挑選器。

自訂素材輪播

  1. 在 Shopify 管理員中，前往「線上商店」 > 「佈景主題」。
  2. 點擊 的動態區段 旁邊的「自訂」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 按一下「新增區段」。
  2. 點擊「素材輪播」，然後點擊「選取」。
  3. 使用設定來自訂素材輪播
  4. 點擊「儲存」。

部落格文章

您可以在首頁上展示最多三篇部落格貼文。

秘訣：若要瞭解如何建立部落格，請參閱《為線上商店新增部落格》。

部落格貼文區段包括下列設定：

  • 標題 - 為部落格貼文區段加上標題。
  • 部落格 - 設定要展示其貼文的來源部落格。
  • 貼文 - 設定要展示的部落格貼文數。
  • 顯示日期 - 顯示發佈部落格貼文的日期。
  • 顯示作者 - 顯示部落格貼文的作者。
  • 顯示封面圖片 - 顯示部落格貼文的封面圖片。
  • 顯示摘要 - 顯示部落格貼文的簡短摘要。
  • 顯示「查看全部」按鈕 - 新增連結至線上商店部落格頁面的按鈕。

將部落格貼文新增至首頁

  1. 在 Shopify 管理員中，前往「線上商店」 > 「佈景主題」。
  2. 點擊 的動態區段 旁邊的「自訂」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 按一下「新增區段」。
  2. 點擊「部落格文章」，然後點擊「選取」。
  3. 使用設定來自訂首頁部落格區段。
  4. 點擊「儲存」。

商品系列清單

您可以在首頁上展示最多九個商品系列。

商品系列清單區段包括下列設定：

  • 標題 - 為商品系列清單加上標題。
  • 系列商品 - 設定您想展示的商品系列。

將商品系列清單新增至首頁

  1. 在 Shopify 管理員中，前往「線上商店」 > 「佈景主題」。
  2. 點擊 的動態區段 旁邊的「自訂」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 按一下「新增區段」。
  2. 點擊「商品系列清單」，然後點擊「選取」。
  3. 使用設定來自訂商品系列清單區段。
  4. 點擊「儲存」。

精選商品系列

您可以在首頁展示來自其中一個商品系列的產品。

精選商品系列區段包括下列設定：

  • 標題 - 為精選商品系列加上標題。
  • 商品系列 - 設定要展示其產品的商品系列。
  • 格狀樣式 - 設定您精選產品的版面配置。

將精選商品系列新增至首頁

  1. 在 Shopify 管理員中，前往「線上商店」 > 「佈景主題」。
  2. 點擊 的動態區段 旁邊的「自訂」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 按一下「新增區段」。
  2. 點擊「精選商品系列」，然後點擊「選取」。
  3. 使用設定來自訂精選商品系列區段。
  4. 點擊「儲存」。

附文字的圖片

您可以在首頁上展示圖片和自訂文字。

附文字圖片區段包括下列設定：

  • 圖片 - 選擇要新增至區段的圖片。
  • 圖片對齊 - 設定您要在頁面哪一側顯示圖片。
  • 標題 - 為區段加上標題。
  • 文字 - 為區段加上文字。
  • 按鈕標籤 - 新增要顯示在按鈕上的文字。
  • 按鈕連結 - 將您的按鈕連結至其他頁面或網站。

為首頁新增附文字的圖片

  1. 在 Shopify 管理員中，前往「線上商店」 > 「佈景主題」。
  2. 點擊 的動態區段 旁邊的「自訂」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 按一下「新增區段」。
  2. 點擊「附文字圖像」，然後點擊「選取」。
  3. 使用設定來自訂您的附文字圖片區段。
  4. 點擊「儲存」。

精選產品

您可以在首頁上展示商品。展示產品是宣傳新產品或促銷產品的好方式。

精選產品區段包括下列設定：

  • 產品 - 選擇要在首頁上展示的產品。
  • 顯示子類選項標籤 - 顯示產品子類選項標籤 (如「尺寸」和「顏色」)。
  • 顯示廠商 - 顯示產品品牌或廠商。
  • 文字 - 為精選產品新增文字。
  • 按鈕文字 - 為精選產品新增含有文字標籤的按鈕。
  • 按鈕連結 - 將您的按鈕連結至其他頁面或網站。

將精選產品添加到首頁

  1. 在 Shopify 管理員中，前往「線上商店」 > 「佈景主題」。
  2. 點擊 的動態區段 旁邊的「自訂」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 按一下「新增區段」。
  2. 點擊「精選產品」，然後點擊「選取」。
  3. 使用設定來自訂您的精選產品區段。
  4. 點擊「儲存」。

電子報

您可以將訂閱電子報加入首頁。您可以透過訂閱電子報來收集客戶的電子郵件地址，以供電子郵件行銷使用。在 Shopify 部落格上進一步瞭解電子郵件行銷。

將訂閱電子報新增至首頁

  1. 在 Shopify 管理員中，前往「線上商店」 > 「佈景主題」。
  2. 點擊 的動態區段 旁邊的「自訂」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。

  1. 按一下「新增區段」。

  2. 點擊「電子報」，然後點擊「選取」。

  3. 輸入「訂閱電子報」的標題。

  4. 輸入訂閱電子報的副標題。

  5. 點擊「儲存」。

地圖

您可以將 Google 地圖新增至首頁，向客戶顯示您商家所在的位置。

秘訣：若要顯示地圖，您必須註冊 Google Maps API 金鑰。

地圖區段包括下列設定：

  • 標題 - 為地圖區段加上標題。
  • 地址和營業時間 - 為地圖區段加上商店的地址和營業時間。
  • 地圖地址 - 設定地圖以顯示商店地點。
  • 地圖連結標籤 - 新增連結至您在 Google Maps 上地點的按鈕。
  • 顯示圖釘 - 在地圖上新增顯示您商店精確位置的圖釘。
  • Google Maps API 金鑰 - 為地圖區段加上地圖的 API 金鑰。
  • 圖片 - 新增在地圖未載入時要顯示的圖片。
  • 圖片位置 - 設定圖片的位置。

將地圖新增至首頁

  1. 在 Shopify 管理員中，前往「線上商店」 > 「佈景主題」。
  2. 點擊 的動態區段 旁邊的「自訂」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 按一下「新增區段」。
  2. 點擊「地圖」，然後點擊「選取」。
  3. 使用設定來自訂您的地圖區段。
  4. 點擊「儲存」。

RTF 文字

使用「RTF 文字」區段提供您要在首頁上顯示的任何文字內容，或嵌入在 Shopify 管理員中建立的任何頁面。例如，您可以透過嵌入部落格頁面來展示即將舉辦的活動，或顯示包含以下內容的頁面：

RTF 文字區段包括下列設定：

  • 寬螢幕 - 減少文字兩端的邊距。
  • 標題 - 為 RTF 文字區段加上標題。
  • 文字 - 新增自訂文字並設定其格式。 如果要展示商店中的精選頁面，請點擊「新增內容」，然後點擊「頁面」。從下拉式選單中選擇要展示作為首頁的頁面。
  • 尺寸 - 設定文字尺寸。

將 RTF 文字新增至首頁

  1. 在 Shopify 管理員中，前往「線上商店」 > 「佈景主題」。
  2. 點擊 的動態區段 旁邊的「自訂」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。

  1. 按一下「新增區段」。

  2. 點擊「RTF 文字」，然後點擊「選取」。

  3. 使用設定來自訂您的 RTF 文字區段。

  4. 點擊「儲存」。

影片

您可以將 YouTube 或 Vimeo 影片新增至首頁。影片可以吸引客戶，讓客戶對您的業務產生興趣。

若要新增影片，您必須找出影片的分享連結：

  • YouTube - Youtube 分享連結如下所示：https://youtu.be/Oc5v_ToKP7c。您可以在此 YouTube 說明文章中，瞭解如何複製 YouTube 影片的分享連結。
  • Vimeo - Vimeo 分享連結如下所示：https://vimeo.com/123456789。您可以在此 Vimeo 說明中心文章中，瞭解如何複製 Vimeo 影片的分享連結。

影片區段包括下列設定：

  • 標題 - 為影片區段加上標題。
  • 影片連結 - 為您的影片加上分享連結。

將影片新增至首頁

  1. 在 Shopify 管理員中，前往「線上商店」 > 「佈景主題」。
  2. 點擊 的動態區段 旁邊的「自訂」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 按一下「新增區段」。
  2. 點擊「影片」，然後點擊「選取」。
  3. 使用此設定來自訂您的影片區段。
  4. 點擊「儲存」。

自訂 HTML

您可以為首頁加上自訂內容。舉例來說，您可以透過 HTML 設定文字方塊的格式、建立表格，或內嵌來自其他網站的內容。

自訂 HTML 區段包括下列設定：

  • HTML - 新增您想在首頁上顯示的 HTML 程式碼。
  • 容器寬度 - 設定自訂 HTML 區段的寬度。
  • 垂直對齊 - 設定此區段中內容的垂直位置。

將自訂 HTML 新增至首頁

  1. 在 Shopify 管理員中，前往「線上商店」 > 「佈景主題」。
  2. 點擊 的動態區段 旁邊的「自訂」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 在 Shopify 應用程式中，點一下「商店」。
  2. 在銷售管道畫面上，點一下「線上商店」。
  3. 點一下「管理佈景主題」。
  4. 在 的動態區段 旁，點選「自訂」。
  5. 點一下「編輯」。
  1. 按一下「新增區段」。
  2. 點擊「自訂 HTML」，然後點擊「選取」。
  3. 使用設定來自訂您的自訂 HTML 區段。
  4. 點擊「儲存」。

準備好開始透過 Shopify 銷售商品了嗎？

免費試用