Blocksy 教學 – 如何使用「自訂內容、勾點 (Custom Content/Hooks)」類型的內容區塊

對於站長來說，可以在網站中的任何位置插入特定的內容、可以有一個集中管理的地方而不需要進入到每一個頁面、文章中修改、可以自由的替換插入的內容素材，這會是網站行銷上能夠協助網站績效成長的工具，而這類的工具在過去往往都是需要額外付費的外掛才有提供。

Blocksy Pro 提供了「自訂內容、勾點」類型的內容區塊，不僅可以將自訂內容插入任何指定的勾點位置，透過「條件編輯器」功能更能進一步的決定內容區塊顯示的頁面種類與時機。

這篇文章將與大家分享如何使用「自訂內容、勾點 (Custom Content/Hooks)」類型的內容區塊，只需要使用 Blocksy 佈景主題編輯器就能製作出輕量、能夠滿足各種需求用途的內容區塊。文章內容將涵蓋：

• 「自訂內容、勾點」類型內容區塊的應用情景介紹。
• 透過 Blocksy 佈景主題編輯器，利用 Blocksy Pro 中 Custom Content/Hooks 類別的 Content Blocks，搭配條件編輯器與頁面勾點功能，決定彈出視窗出現的位置與時間。

提醒：這是一篇關於 Blocksy「自訂內容、勾點」類型內容區塊的教學文章，內容較長。

應用情景

與 Popup 類型的內容區塊不同，彈出視窗會由所謂的觸發條件來決定內容區塊出現的時機，而 Blocksy Pro 中「自訂內容、勾點」類型的內容區塊除了可以由勾點來決定內容區塊的位置之外，也提供「短代碼」讓使用者可以自由插入頁面、文章中的任意位置。

文章回顧 – 「Blocksy 教學 – 使用強大的內容區塊製作「彈出視窗 (Popup Window)」」

那麼，什麼樣的「內容」適合用「自訂內容、勾點」類型的內容區塊來製作、管理呢？

• 需放置於特定 (勾點) 位置
• 使用次數高
• 內容重複性高

像是 SaaS 廠商的服務價格表、一般網站中的註冊表單、聯盟行銷的行動呼籲 CTA，或是我們之前介紹的文章目錄、內容大綱等，都是適合使用「自訂內容、勾點」類型的內容區塊製作的例子。

也就是說，使用 Blocksy Pro「自訂內容、勾點」類型的內容區塊 (Content Blocks) 我們可以滿足以下應用情景的需求：

• 服務價格表
  一般會重複出現在網站中特定頁面、推廣文章中，由內容區塊來製作、管理價格表，未來當服務價格調整的時候可以直接在內容區塊中修改即可，不需要到相關頁面、推廣文章中一一修改。
• 註冊表單
  搭配 Email行銷工具外掛 (例如：Brevo 或 MailPoet) 或表單外掛 (例如：Fluent Forms 或 Kadence 的表單區塊)，可以做出邀請訪客加入訂閱電子報或成為網站會員的註冊表單。
• 行銷活動、行動呼籲 CTA
  • 搭配區塊編輯器 (例如：Kadence Blocks)、設計能力，可以做出吸引人的行銷訴求。
  • 搭配提供倒數計時區塊的外掛 (例如：Kadence 的 Countdown 區塊)，就能做出「錯失恐懼」的行銷規劃。
• 系列文章中的重複內容
  在撰寫某個產品或主題的系列文章時，如果有某部分內容需要在每一篇文章中重複提到時也可以使用這個類型的內容區塊。
• 特別應用一
  搭配提供文章目錄 (Table of Contents) 的外掛 (例如：Kadence 或 RankMath SEO 的文章目錄區塊) 以及 Blocksy Pro「自訂內容、勾點」類型的內容區塊，可以做出適合電腦、手機閱讀的文章目錄。
• 特別應用二
  取代程式碼片段 Code Snippets 外掛，插入程式碼！
  在編輯內容區塊時，使用 Code Editor 區塊加入程式碼，搭配條件編輯器即可做到大多數程式碼片段的功能。

文章回顧：
-「Table of Contents – 使用 Blocksy 與 Kadence Blocks 輕鬆建立文章目錄、內容大綱」
-「如何製作適合手機閱讀的文章目錄、內容大綱？」

搭配條件編輯器，決定彈出視窗出現的頁面種類，更可以按照以下與「時間」相關的條件設定顯示內容區塊與否：

• 固定日期、時間區間內
• 固定每周幾的特定時段

善加運用這些條件功能，以及對網站頁面勾點位置的了解，就能在網站上的各個角落，按照規劃的時間顯示內容區塊。

Blocksy 佈景主題編輯器

在這篇文章中我們會使用 Blocksy Pro 付費版的 Content Blocks 功能，讓我們從安裝佈景主題與外掛開始！

安裝 Blocksy 佈景主題

首先，到 WordPress 後台的外觀 > 佈景主題，點選「安裝佈景主題」後搜尋 Blocksy。

並點擊「安裝」。

安裝 Blocksy Companion 外掛

因為接下來介紹的 Content Blocks 是需要購買 Blocksy Pro 才會有的 Pro Extensions 專業版擴充功能，所以直接登入 Blocksy 帳號下載最新版的 Blocksy Companion。

接著按照安裝外掛的方式在 WordPress 後台上傳、安裝即可。

如果想先使用免費版的人，可以到外掛 > 安裝外掛搜尋 Blocksy Companion。

並點擊「立即安裝」。

提醒：如果有購買付費版，只需要安裝 Blocksy Companion (Premium) 即可，不需安裝免費版的外掛。

Blocksy 的 「自訂內容、勾點」類型內容區塊

我們接著來介紹今天的主題：Blocksy 的「自訂內容、勾點」類型內容區塊。

從 WordPress 的管理後台找到 Blocksy 的功能選單。

點擊 Content Blocks 進入內容區塊管理頁面。

新增內容區塊 (Content Blocks)

點擊 Add New 按鈕新增 Content Blocks。

選擇 Custom Content/Hooks 類型的 Content Blocks。

內容區塊的設計

在編輯頁面中任意地揮灑你的設計能力，使用編輯器 (我們是用 Kadence Blocks 區塊編輯器) 做出適合推廣、行銷目的的內容區塊。

以 Quants Note 網站「架站教學」選單中的「歡迎加入我們的社團」內容區塊來說，只需要 Kadence 的幾種基礎區塊組合搭配，就能做出這個漂亮的設計。

• Row Layout
• Section
• Text (Adv)
• Buttons (Adv)

題外話，在社團中有更多架站的討論與經驗交流，歡迎大家加入社團一起討論唷！

內容區塊中的「Blocksy 頁面設定」

在「Blocksy 頁面設定」中可以決定「自訂內容、勾點 (Custom Content/Hooks)」的顯示條件。

我們接著來說明相關的功能設定。

顯示條件

首先是決定這個內容區塊顯示條件的設定。

點擊「編輯條件」按鈕可以開啟條件編輯器。

Blocksy 的「內容區塊顯示條件 (Content Block Display Conditions)」中提供了相當豐富的各類條件規則，可以「包含」或「排除」這些條件，條件彼此間可以是「OR」或「AND」，條件類型則有：

• 整個網站
• 基本
  • All Singulars – 所有單頁。例如：頁面、文章等。
  • All Archives – 所有彙整頁面。例如：作者、類別、標籤等。
• 文章
  • 所有文章彙整
  • 文章分類
  • 文章標籤
  • 單一文章
• 頁面
  • 單一頁面
  • 404
  • 搜尋
  • 網誌
  • 首頁
  • Privacy Policy Page
  • Author Archive – 選擇特定作者
• Custom Post Type
  自動偵測網站目前使用的 CPT 類型
• 特定的
  • 文章 ID – 選擇特定文章
  • 頁面 ID – 選擇特定頁面
  • 自訂文章類型 ID – 選擇特定 CPT 頁面
  • 有分類法 ID 的文章 – 選擇特定文章分類或標籤
  • Post with Author ID – 選擇特定作者
  • 分類法 ID – 選擇特定頁面分類或標籤
• 使用者驗證
  • 使用者已登入
  • 使用者已登出
  • User Role – 選擇特定使用者角色
• Date & Time
  • Range Date/Time
    指定開始 (Start Date) 的日期、時間，以及結束 (Expiration Date) 的日期、時間。
  • Recurring Days
    選擇重複發生的每周幾，以及一天內的開始與結束的時間。
• Requests
  • Request Referer – Referer 的 domain 網址
  • Request Cookie – 選擇特定 Cookie 名稱
  • Request URL – 選擇特定的 (URL 中的) query string

舉例來說，假設我們需要這個彈出視窗在所有分類為「架站筆記」的文章中出現，並且出現時間為周一至周五的每天早上九點到晚上九點，顯示條件可以設定為：

結合「顯示條件」功能與「倒數計時」區塊，更可以做出「錯失恐懼」的行銷規劃。

讓潛在客戶看著有興趣的商品，而折扣、優惠的時間隨著倒數計時器一點一滴的流逝即將結束，在銷售季節 (例如：中國的雙十一、女神節，西方的黑五、網路星期一等) 使用這個功能可以獲得最大的效益。

勾點位置與優先順序

Location & Priority 可以決定此內容區塊要嵌入在文章頁面中的哪個部分。

透過 Blocksy 顯示勾點 (Show Hooks) 功能可以清楚的知道頁面中的每一個部分的勾點名稱。

例如，如果要嵌入在側邊欄的最上方，就要選擇 Sidebar Start 勾點；如果想要嵌入在文章內容的最上面，就要選擇單一文章的 Top Content 勾點。

內容區塊可見度

設定內容區塊的裝置可見度 (Visibility)。

如果需要為不同裝置個別製作內容區塊，可以善加利用這個功能。

結語

Blocksy Pro「自訂內容、勾點」類型的內容區塊功能複雜度雖然比不上 Popup 彈出視窗，但是搭配條件編輯器與頁面勾點位置功能，其應用情景的可能性完全取決於使用者的想像與創造能力了。

綜合以上的說明，我們知道了：

• 「自訂內容、勾點」類型內容區塊的應用情景介紹。
• 如何使用 Blocksy 佈景主題編輯器，利用 Blocksy Pro 中 Custom Content/Hooks 類別的 Content Blocks，搭配條件編輯器與頁面勾點功能，決定彈出視窗出現的位置與時間。

搭配「應用情景」章節中提到的各種應用的可能性，相信大家都會知道要如何運用 Blocksy 「自訂內容、勾點」類型的內容區塊來豐富網站的設計、便利網站的管理了。

如果有什麼心得、想法或建議，歡迎加入社團一起討論唷！