Skill 設計

我把寫部落格這件事,做成了一個可以反覆使用的 Skill

作者想讓部落格能直接吃一份已編輯好、內建 Title、H tags、Descriptions 與 OG 圖的 HTML,於是把這件事做成 Skill。施工前先調查五件事:匯入機制、輸出形態、front-matter 與 metadata、圖片規則、特殊區塊的表示法;接著設計施工前詢問色票與語氣、什麼都不填也能上的自動退回、用 meta 標籤精準控制 SEO 欄位、FAQ 用 FAQPage JSON-LD 宣告,最後加上驗證器確保產出一致性,測試一次就成功。
我把寫部落格這件事,做成了一個可以反覆使用的 Skill:文章重點卡

我把寫部落格這件事,做成了一個可以反覆使用的 Skill

你將學到什麼

先搞清楚五件事

匯入機制、輸出形態、metadata 欄位、圖片規則、特殊區塊怎麼表示。

施工前先問偏好

詢問色票維持整站配色一致,可指定語氣風格,配圖方式也先問清楚。

自動退回機制

什麼都不填也能上:標題、描述、OG 圖、JSON-LD、sitemap 全自動。

精準控制與驗證

head 多寫幾行 meta 就能指定 SEO 欄位,驗證器把關產出一致性。

又有 Skill 新點子!雖然我會作 html,但這還是很花時間的一件事。我一開始的念頭是這樣:如果 blog 可以直接上傳已經編輯好的 html,而且內建好 Title / H tags / Descriptions / OG圖,然後我只要在 blog 上傳這個已經編輯好的 html,就自動變成一篇已經排好的文章?不用自己在那邊調 H1 H2 H3,那世界會變得更美好!這樣我只要把文章丟給 Skill,就可以自動產出一份可直接匯入的 html!多美!

怎麼開始作 Skill?

我需要先知道幾件事:

① 匯入機制

blog 是怎麼吃一篇文章的?貼 HTML 進編輯器、上傳檔案、走 API、還是讀某個資料夾裡的 Markdown / MDX。

② 輸出形態

要整頁自帶樣式的 HTML、只給 body 語意片段+套站台主題、還是Markdown/MDX。

如果是片段,要知道允許的 HTML 標籤與 class 以及文章區既有的 CSS class,例如內文、標題、圖說、callout、程式碼框各用什麼 class,讓 Skill 的交付物自動對齊,而不是自己另做一套。

③ front-matter & metadata

需要哪些欄位,比如 title、slug、description、tags、category、cover、date、author、canonical 之類?用 YAML 還是 JSON、欄位是怎麼命名的。

④ 圖片

圖片放在哪、引用路徑規則?是相對、絕對還是CDN?檔名規則、封面圖的尺寸比例、alt 要求。

因為部落格不適合 base64 內嵌,所以這塊要定清楚我才能決定「輸出成獨立圖檔+路徑」還是別的做法。

⑤ 特殊區塊

程式碼框、表格、callout、圖表在 blog 端各怎麼表示?有沒有現成的 shortcode 或 component 例如 <Callout>?程式碼要不要指定語言做 highlight?

搞清楚以上的限制之後,我才能開始規劃一篇文章的交付單位,是一個檔就好呢?還是一包文章檔+圖片資料夾?喔!還有檔名+slug 規則。

寫到這裡,前五個需要知道的事情已經調查完

然後想到要讓 skill 施工前先詢問色票,這樣才能維持整個網站配色的一致性;要可以指定語氣風格,讓一個人也可以有不同的面向呈現出來;要詢問是否要配圖,配圖由使用者上傳還是 Claude 自己生成?

然後要有自動退回,讓使用者即使什麼都不填也能上,<title> 變頁面標題與 og:title 描述從 answer 或內文自動擷取,OG 圖自動生成 1200×630 PNG,Article JSON-LD、麵包屑、sitemap 等都要全自動。

還要能夠精準控制,讓skill 在 <head> 多寫幾行 <meta name="OOOO"> 就能指定 seo-title、answer / AEO 答案摘要、topic、keywords、canonical、visibility。

FAQ 用標準 FAQPage JSON-LD 宣告,這樣就能同時變成頁面上的問答區塊+合法結構化資料。

然後設計一下驗證器,確保產出一致性

喔~這裡我不知道要講啥了,反正就是這樣那樣,然後測試看看有沒有要改的地方,但一次就成功了,所以就這樣囉!(我正在追劇)

本文原發表於 2026/08/04 的 Facebook 貼文,原文照登,僅調整網頁排版;文中提及的產品、價格與活動以當時為準。

繼續追蹤酒Ann想看更多 AI 系統、工具實測、品牌方法與生活觀察,歡迎前往 酒Ann 的 Facebook

延伸學習

把這篇文章分享給需要的人FacebookLINEThreadsX

常見問答

為什麼要把寫部落格做成 Skill?
作者會做 html 但很花時間,希望把文章丟給 Skill 就自動產出一份可直接匯入、排好版、內建 Title 與 H tags 的 HTML,不用自己調 H1 H2 H3。
開始做 Skill 之前要先調查什麼?
五件事:blog 的匯入機制、輸出形態、front-matter 與 metadata 欄位、圖片放哪與引用路徑規則、程式碼框與 callout 這類特殊區塊怎麼表示,搞清楚才能規劃交付單位。
使用者什麼都不填會怎麼樣?
有自動退回:title 變成頁面標題與 og:title,描述從 answer 或內文自動擷取,OG 圖自動生成 1200×630 PNG,Article JSON-LD、麵包屑、sitemap 都全自動。
FAQ 為什麼要用 FAQPage JSON-LD 宣告?
因為這樣一次宣告,就能同時變成頁面上的問答區塊與合法的結構化資料。