SyuanYu 1 月之前
父節點
當前提交
e5e6aa5fd9

+ 6 - 0
content/features/_index.md

@@ -0,0 +1,6 @@
+---
+title: "專題報導"
+description: "專訪、深度報導,帶你認識品牌與 AI 行銷的新趨勢"
+layout: "features"        # 指定用 layouts/features/list.html
+summary: ""
+---

二進制
content/features/jared-liang/image_1.jpeg


二進制
content/features/jared-liang/image_2.jpg


二進制
content/features/jared-liang/image_3.jpg


+ 132 - 0
content/features/jared-liang/index.md

@@ -0,0 +1,132 @@
+---
+title: "專訪:Jared Liang|AI 時代的行銷新戰場"
+date: "2025-09-05T00:00:00+08:00"  # 先給今天較早的時間,避免「未來」
+draft: false                        # 先發佈,確保會輸出
+type: "features"
+# layout: "features"                # 先拿掉(不影響網址;單篇會自動找 layouts/features/single.html)
+summary: ""
+image: "/features/jared-liang/image_1.jpeg"
+tags: ["專訪","AI","行銷"]
+url: "/features/jared-liang/"     # 建議先拿掉,避免和預設路徑衝突
+---
+
+_AI 時代下,品牌與中小企業如何被 AI 收錄與認識?_
+
+在生成式 AI 盛行的今天,消費者獲取資訊的方式正在被重新定義。  
+我們專訪了 **ChoozMo 的 Jared Liang**,一同探討品牌與中小企業,該如何在 AI 的浪潮中被「收錄」、被看見。
+
+ 
+
+{{< figure src="image_1.jpeg" alt="Jared 專訪形象照" class="float-right" >}}
+
+{{< box class="quote-accent" >}}
+「讓品牌進入 AI 的知識庫,就像是讓它出現在新的搜尋引擎世界裡。」-Jared
+{{< /box >}}
+
+Jared 提到,這已經不只是傳統行銷的延伸,而是一個新的必爭之地。  
+
+他以 **集仕多 (ChoozMo)** 為例:過去我們會思考怎麼在 Google 搜尋排名靠前,但現在更重要的是,**如何讓 AI 模型在回答時,能夠自然地提及並引用品牌**。  
+
+這意味著,中小企業不能再只依靠傳統廣告,而是要學會和 AI 的知識收錄機制 對話,才能真正被未來的消費者看見;做法其實很簡單:把每個主題改成一問一答,一開始先用一句話重點講清楚;接著列出 2~3 個關鍵重點,並附上來源或數字。整篇用清楚的標題與小標分段,並連到站內與外部可信資料。頁面放上簡短摘要與關鍵字,幫助系統與 AI 更快理解內容。記得固定更新、標上日期,讓讀者放心也提高被採信的機會。最後,整理成容易複製的重點卡或示範段落(附來源與授權說明),讓 AI 在回答相關問題時,能自然引用你並帶出品牌連結。
+
+### 為什麼「被 AI 收錄」等於新一代曝光?
+
+- **使用情境轉移**:使用者越來越習慣直接問 AI,而不是逐頁比對搜尋結果。  
+- **答案型分發**:AI 回覆會彙整重點並「引用可信來源」。能被引用,才有機會被看見。  
+- **內容結構化**:AI 需要清晰的知識節點與上下文連結,勝過單篇長文。
+
+> 重點:**符合 AI 可解析、可引用的內容結構**,是品牌必備能力。
+
+---
+
+## 數據分析的重要性  
+
+ChoozMo 提供各種數據分析工具,能精準判斷「哪些主題最適合被 GPT 收錄」,並幫助品牌決定 **該如何設計介紹內容**,讓資訊更容易被 AI 辨識與學習。  
+
+{{< figure src="image_2.jpg" alt="ChoozMo 系統圖片" >}}
+
+Jared 補充說:  
+> 「數據能讓我們知道市場正在討論什麼,  
+>  同時也能判斷哪些內容缺口值得填補。  
+>  把品牌放進這些缺口,就像是把旗幟插在一個新的領地上。」
+
+**Q:你們怎麼決定要寫什麼?**  
+**Jared:** 我們先看大家「真的在問什麼」。工具會把論壇、社群、客服紀錄、搜尋建議等問題彙整成一份清單,標出熱度與價值。接著挑出品牌最能回答、而市場又缺少好答案的題目,這些就是第一波要做的內容。
+
+**Q:內容要怎麼寫,AI 比較讀得懂?**  
+**Jared:** 一題一頁,開頭先用一句話講重點,下面放 2~3 個關鍵說明與數字,再加一個簡單的示範或表格。標題、小標清楚,彼此有連結;有參考來源就附上,方便被引用。這樣做,AI 會更容易抓到重點,人也看得快。
+
+**Q:怎麼判斷成效?**  
+**Jared:** 我們看三件事:  
+1) **有沒有被提到**——測問相關問題,AI 是否自然提到品牌;  
+2) **有沒有被引用**——AI 回答裡是否引用你的片段或數字;  
+3) **有沒有帶來行動**——從這些頁面進來的人,有沒有留下詢問、訂閱或試用。  
+如果沒有,我們會回頭調整題目、結構或示範。
+
+**Q:可以舉個實際例子嗎?**  
+**Jared:** 例如大家常問「某功能到底適不適合我的店?」我們就做一頁:「先看三件事」的快速檢查表,下面放兩個真實情境與數據範例,最後附上延伸閱讀。這種頁面很容易被引用,因為它直接回答了使用者的疑問。
+
+**ChoozMo 的分析報告會提供:**  
+- **主題熱度**:這題目前討論多不多、值得不值得做。  
+- **常見問句**:同一主題下,使用者最常怎麼問。  
+- **內容缺口**:別人沒回答好的點,你可以補。  
+- **參考來源建議**:可引用的研究或數字,寫文時直接用。
+
+> 「不要追求一次寫百科全書。先把 10 題最常被問到的問題寫好、寫清楚,通常就會看到變化。」-Jared
+
+---
+
+## 被 AI 收錄,等於進入新時代  
+
+在 AI 的知識體系裡被記住,不僅僅是 SEO 的下一步,更是一種「品牌新生態定位」。  
+
+這對中小企業尤其重要,因為他們可以藉由 **正確的主題策略**,快速與大型品牌站上同一個起跑點。  
+
+{{< figure src="image_3.jpg" alt="被 ChatGPT 收錄的 Google 搜尋結果" >}}
+
+被 AI 收錄,其實就是在新的資訊地圖上「佔一個座標」。當使用者問到你的領域,AI 是否會把你當成一個可靠的答案、案例或參考來源。Jared 說,傳統做法是拚關鍵字與廣告曝光;現在更有效的方法,是讓內容本身能被機器與人同時理解:**清楚提問、直接回答、附上可信依據**,並且持續更新。
+
+他把「被看見」拆成三種方式:**被引用、被推薦、被當成例子**。  
+- **被引用**:你提供的說法或數字,被直接帶入 AI 的回覆。  
+- **被推薦**:AI 把你列為可延伸閱讀的來源。  
+- **被當成例子**:你的做法成為示範情境,被拿來說明概念。  
+
+要做到這三點,Jared 建議先建立一小套「一頁一答」的知識庫,每頁聚焦一個問題,用一句話先講重點,再補上 2~3 個關鍵說明與真實案例。標題與小標要清楚直白,像是會被直接問出口的句子;內容裡要固定出現**一致的品牌名稱與簡短定位**(例如「Choozmo-專做 XXX 的數據工具」),讓系統更快把品牌與主題連結起來。
+
+對小型品牌來說,**窄題深挖**尤其關鍵。越是具體、越貼近使用情境的主題,越容易脫穎而出──例如「外送新店如何在 30 天內拿到第一批回頭客」這種題目,就比「餐飲行銷指南」更容易被採用。Jared 也強調要把**第一手素材**做成可引用的段落:訪談片段、實驗結果、操作步驟、前後對比數據,這些都是 AI 衷愛的內容格式。
+
+> 「先把你最擅長、最常被問到的 10 個問題寫好。讓人一看就懂、讓機器一掃就抓到重點,你就已經贏在起跑點。」-Jared
+
+最後,不要忘記用簡單的方式**量測與調整**:固定每週用常見問句測試 AI 的回答,有沒有提到你;觀察從這些答案頁進來的流量與詢問;沒被提到時,回頭檢視題目是否夠明確、內容是否有可引用的段落。當你持續補齊這些「知識座標」,就會在新時代的資訊地圖上,為品牌畫出一條清楚的路徑。
+
+---
+
+## 結語  
+
+AI 正在重塑行銷規則。而 Jared 與 ChoozMo 提供的策略,正是幫助品牌 **在 AI 世界裡被看見的關鍵**。  
+
+專訪最後,Jared 強調:  
+> 「未來的行銷工作,  
+>  不再是單純對人說話,  
+>  而是要同時對 AI 說話。」  
+
+換句話說,好的內容不只要打動讀者,還要能被系統快速讀懂、記住、引用。與其追求一次寫到百科全書,不如建立一個能持續長大的「小型知識庫」:每次解決一個真問題,留下清楚的答案、可驗證的數字、與簡短的示範。這些就像是座標,讓 AI 在回答時能找到你、提到你。
+
+**現在就能做的三件事:**  
+1. 列出你的受眾最常問的 **10 個問題**,每題寫成一頁、先給一句重點。  
+2. 在答案裡放 **2~3 個關鍵說明與數字**,並附上來源連結。  
+3. 每週檢查一次:AI 回答相關問題時,**是否提到你、是否引用你的段落**;若沒有,就回頭調整題目與內容結構。
+
+**衡量成效,看三個指標:**  
+- **被提及**:AI 回覆裡自然提到品牌或產品。  
+- **被引用**:你的關鍵段落、數字、範例被帶入回答。  
+- **帶來行動**:從這些答案頁進來的使用者,有沒有留下詢問、訂閱或試用。
+
+**常見的陷阱要避免:**  
+- 題目太大、內容太空;  
+- 沒有明確結論與數據;  
+- 很久沒更新、沒有標示時間。  
+
+把內容做小、做深、做持續,中小企業同樣能在新一代的資訊地圖上佔有一席之地。Jared 說,最重要的是開始行動:**從第一個問題開始,讓每一篇內容都成為能被引用的答案。**
+
+---

+ 1 - 0
news_templates/layouts/shortcodes/box.html

@@ -0,0 +1 @@
+<div class='{{ .Get "class" }}'>{{ .Inner | markdownify }}</div>

+ 3 - 2
news_templates/static/css/style.css

@@ -244,14 +244,15 @@ body {
 .blog-post.content h4 a:hover {
   color: #fff !important;
 }
-.blog-post.content .back-link {
+
+.back-link {
   color: #000;
   display: block;
   text-align: center;
   text-decoration: none;
   transition: all 0.3s;
 }
-.blog-post.content .back-link:hover {
+.back-link:hover {
   opacity: 0.7;
 }
 

文件差異過大導致無法顯示
+ 0 - 0
news_templates/static/css/style.css.map


+ 9 - 9
news_templates/static/css/style.scss

@@ -274,17 +274,17 @@ body {
       }
     }
   }
+}
 
-  .back-link {
-    color: #000;
-    display: block;
-    text-align: center;
-    text-decoration: none;
-    transition: all 0.3s;
+.back-link {
+  color: #000;
+  display: block;
+  text-align: center;
+  text-decoration: none;
+  transition: all 0.3s;
 
-    &:hover {
-      opacity: 0.7;
-    }
+  &:hover {
+    opacity: 0.7;
   }
 }
 

+ 5 - 3
news_templates/static/js/main.js

@@ -30,6 +30,8 @@ window.onscroll = () => {
     }
 };
 
-topBtn.addEventListener('click', () => {
-    document.documentElement.scrollTop = 0;
-}, false);
+if (topBtn) {
+    topBtn.addEventListener('click', () => {
+        document.documentElement.scrollTop = 0;
+    }, false);
+}

+ 1 - 1
news_templates/themes/hugo-bootstrap-5/layouts/partials/head.html

@@ -8,7 +8,7 @@
 <!-- Google Font -->
 <link rel="preconnect" href="https://fonts.googleapis.com">
 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;400;500&family=Roboto+Slab:wght@600&display=swap" rel="stylesheet">
+<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;400;500;600;700&family=Roboto+Slab:wght@600&display=swap" rel="stylesheet">
 
 {{ with .Site.Params.style }}
 <link href="{{ "/css/style" | relURL }}.{{ . }}.css" rel="stylesheet" id="theme-stylesheet">

+ 101 - 2
static/css/style.css

@@ -292,14 +292,15 @@ body {
 .blog-post.content h4 a:hover {
   color: #fff !important;
 }
-.blog-post.content .back-link {
+
+.back-link {
   color: #000;
   display: block;
   text-align: center;
   text-decoration: none;
   transition: all 0.3s;
 }
-.blog-post.content .back-link:hover {
+.back-link:hover {
   opacity: 0.7;
 }
 
@@ -541,4 +542,102 @@ body {
   .news-main .bottom-content {
     height: 50vw;
   }
+}
+
+.tags-list .cover-img {
+  height: 230px;
+  -o-object-fit: cover;
+     object-fit: cover;
+}
+
+.feature-article .float-right {
+  float: right;
+  max-width: 40%;
+  margin: 0 0 1rem 1.5rem;
+  border-radius: 12px;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+}
+.feature-article figure {
+  margin: 2rem 0;
+  text-align: center;
+}
+.feature-article figure img {
+  width: 100%;
+  height: auto;
+  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
+}
+.feature-article h1 {
+  font-size: 3.5rem;
+  margin: 3rem auto;
+}
+.feature-article h2 {
+  margin-bottom: 1rem;
+  position: relative;
+  display: inline-block;
+  line-height: 1.2;
+  isolation: isolate;
+}
+.feature-article h2::after {
+  content: "";
+  position: absolute;
+  left: -10px;
+  right: -2px;
+  bottom: -4px;
+  height: 20px;
+  background: rgba(255, 234, 0, 0.4);
+  transform: skewX(-30deg);
+  transform-origin: left bottom;
+  z-index: -1;
+  pointer-events: none;
+}
+.feature-article h3 {
+  margin: 3rem 0 1rem;
+}
+.feature-article hr {
+  margin: 3rem 0;
+}
+.feature-article p {
+  line-height: 1.8;
+  font-size: 1.05rem;
+  color: #222;
+}
+.feature-article em {
+  display: inline-block;
+  margin-bottom: 2rem;
+  padding: 0.5rem 1.5rem;
+  background-color: #f8f8f8;
+  border-left: 5px solid var(--sub-color);
+  border: 2px dotted #ccc;
+}
+.feature-article ul {
+  list-style: disc;
+}
+.feature-article ol {
+  list-style: auto;
+}
+.feature-article b,
+.feature-article strong {
+  font-weight: 700;
+}
+.feature-article .quote-accent {
+  display: flex;
+  align-items: flex-start;
+  gap: 0.5rem;
+  padding: 1rem 0;
+  margin-top: 1rem;
+  font-size: 2rem;
+  font-weight: 600;
+  border-top: 5px solid var(--sub-color);
+}
+.feature-article .quote-accent::before {
+  content: "“";
+  flex: 0 0 auto;
+  font-family: Georgia, "Times New Roman", serif;
+  font-size: 2.8em;
+  line-height: 0.6;
+  color: var(--sub-color);
+  margin-top: 0.1em;
+}
+.feature-article .quote-accent > p {
+  margin: 0;
 }/*# sourceMappingURL=style.css.map */

文件差異過大導致無法顯示
+ 0 - 0
static/css/style.css.map


+ 125 - 9
static/css/style.scss

@@ -329,17 +329,17 @@ body {
       }
     }
   }
+}
 
-  .back-link {
-    color: #000;
-    display: block;
-    text-align: center;
-    text-decoration: none;
-    transition: all 0.3s;
+.back-link {
+  color: #000;
+  display: block;
+  text-align: center;
+  text-decoration: none;
+  transition: all 0.3s;
 
-    &:hover {
-      opacity: 0.7;
-    }
+  &:hover {
+    opacity: 0.7;
   }
 }
 
@@ -701,4 +701,120 @@ body {
   //     }
   //   }
   // }
+}
+
+.tags-list {
+  .cover-img {
+    height: 230px;
+    object-fit: cover;
+  }
+}
+
+.feature-article {
+  .float-right {
+    float: right;
+    max-width: 40%;
+    margin: 0 0 1rem 1.5rem;
+    border-radius: 12px;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+  }
+
+  figure {
+    margin: 2rem 0;
+    text-align: center;
+  }
+
+  figure img {
+    width: 100%;
+    height: auto;
+    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
+  }
+
+  h1 {
+    font-size: 3.5rem;
+    margin: 3rem auto;
+  }
+
+  h2 {
+    margin-bottom: 1rem;
+    position: relative;
+    display: inline-block;
+    line-height: 1.2;
+    isolation: isolate;
+
+    &::after {
+      content: "";
+      position: absolute;
+      left: -10px;
+      right: -2px;
+      bottom: -4px;
+      height: 20px;
+      background: rgba(255, 234, 0, 0.4);
+      transform: skewX(-30deg);
+      transform-origin: left bottom;
+      z-index: -1;
+      pointer-events: none;
+    }
+  }
+
+  h3 {
+    margin: 3rem 0 1rem;
+  }
+
+  hr {
+    margin: 3rem 0;
+  }
+
+  p {
+    line-height: 1.8;
+    font-size: 1.05rem;
+    color: #222;
+  }
+
+  em {
+    display: inline-block;
+    margin-bottom: 2rem;
+    padding: .5rem 1.5rem;
+    background-color: #f8f8f8;
+    border-left: 5px solid var(--sub-color);
+    border: 2px dotted #ccc;
+  }
+
+  ul {
+    list-style: disc;
+  }
+
+  ol {
+    list-style: auto;
+  }
+
+  b,
+  strong {
+    font-weight: 700;
+  }
+
+  .quote-accent {
+    display: flex;
+    align-items: flex-start;
+    gap: .5rem;
+    padding: 1rem 0;
+    margin-top: 1rem;
+    font-size: 2rem;
+    font-weight: 600;
+    border-top: 5px solid var(--sub-color);
+
+    &::before {
+      content: "“";
+      flex: 0 0 auto;
+      font-family: Georgia, "Times New Roman", serif;
+      font-size: 2.8em;
+      line-height: .6;
+      color: var(--sub-color);
+      margin-top: .1em;
+    }
+
+    &>p {
+      margin: 0;
+    }
+  }
 }

+ 5 - 3
static/js/main.js

@@ -30,6 +30,8 @@ window.onscroll = () => {
     }
 };
 
-topBtn.addEventListener('click', () => {
-    document.documentElement.scrollTop = 0;
-}, false);
+if (topBtn) {
+    topBtn.addEventListener('click', () => {
+        document.documentElement.scrollTop = 0;
+    }, false);
+}

+ 2 - 2
themes/hugo-bootstrap-5/layouts/_default/taxonomy.html

@@ -1,7 +1,7 @@
 {{ define "main" }}
 <div class="container my-5">
   <div class="row">
-    <div class="col-12 col-lg-8 col-xl-9">
+    <div class="col-12 col-lg-8 tags-list">
       <div class="row align-items-center">
         {{ range .Paginator.Pages }}
         <div class="col-12">
@@ -33,7 +33,7 @@
       </div>
     </div>
 
-    <div class="col-12 col-lg-4 col-xl-3">
+    <div class="col-12 col-lg-4">
       {{ partial "sidebar.html" . }}
     </div>
   </div>

+ 45 - 0
themes/hugo-bootstrap-5/layouts/features/list.html

@@ -0,0 +1,45 @@
+{{ define "main" }}
+<div class="container my-5">
+  <div class="row">
+    <div class="col-12 col-lg-8 tags-list">
+      <div class="row align-items-center">
+        {{ range .Paginator.Pages }}
+        <div class="col-12">
+          <div class="row">
+            <div class="col-12 col-md-6">
+              <a href="{{ .Permalink }}">
+                <img class="img-fluid cover-img" src="{{ .Params.image | relURL }}" alt="" />
+              </a>
+            </div>
+            <div class="col-12 col-md-6 d-flex">
+              <article class="my-auto">
+                <section class="news-info">
+                  {{ range (.GetTerms "categories") }}
+                  <a href="{{ .Permalink }}">{{ .LinkTitle }}</a>
+                  {{ end }}
+                  <small>{{ .Date | time.Format ":date_long" }}</small>
+                </section>
+                <h2 class="post-title">
+                  <a href="{{ .Params.url }}">{{ .Params.title }}</a>
+                </h2>
+              </article>
+            </div>
+            <span class="line line mb-2 mb-md-0">
+              <hr>
+            </span>
+          </div>
+        </div>
+        {{ end }}
+      </div>
+    </div>
+
+    <div class="col-12 col-lg-4">
+      {{ partial "sidebar.html" . }}
+    </div>
+  </div>
+<div class="py-3">
+  {{ template "_internal/pagination.html" . }}
+</div>
+</div>
+
+{{ end }}

+ 27 - 0
themes/hugo-bootstrap-5/layouts/features/single.html

@@ -0,0 +1,27 @@
+{{ define "main" }}
+<article class="container feature-article">
+  <div class="row justify-content-center">
+    <div class="col-8">
+
+      <header class="feature-hero">
+        <h1>{{ .Title }}</h1>
+        {{ with .Params.summary }}<p class="lead">{{ . }}</p>{{ end }}
+      </header>
+
+      <div class="feature-body">
+        {{ .Content }}
+      </div>
+    </div>
+
+    <a href="javascript:;" onclick="historyBack()" class="back-link mb-5">
+      <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-chevron-left mb-1"
+        viewBox="0 0 16 16">
+        <path fill-rule="evenodd"
+          d="M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z" />
+      </svg>
+      <span>回到上一頁</span>
+    </a>
+  </div>
+
+</article>
+{{ end }}

+ 1 - 1
themes/hugo-bootstrap-5/layouts/partials/head.html

@@ -20,7 +20,7 @@
 <!-- Google Font -->
 <link rel="preconnect" href="https://fonts.googleapis.com">
 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;400;500&family=Roboto+Slab:wght@600&display=swap" rel="stylesheet">
+<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;400;500;600;700&family=Roboto+Slab:wght@600&display=swap" rel="stylesheet">
 
 {{ with .Site.Params.style }}
 <link href="{{ "/css/style" | relURL }}.{{ . }}.css" rel="stylesheet" id="theme-stylesheet">

+ 3 - 0
themes/hugo-bootstrap-5/layouts/partials/header.html

@@ -44,6 +44,9 @@
                 </li>
                 <li class="nav-item">
                     <a href="/tags/esg/" class="nav-link" style="color: white;">ESG新聞</a>
+                </li>
+                 <li class="nav-item">
+                    <a href="/features/" class="nav-link" style="color: white;">專題報導</a>
                 </li>
                 <li class="nav-item">
                     <a href="/free-pr-service/" class="nav-link" style="color: white;">新聞發布服務</a>

+ 1 - 0
themes/hugo-bootstrap-5/layouts/shortcodes/box.html

@@ -0,0 +1 @@
+<div class='{{ .Get "class" }}'>{{ .Inner | markdownify }}</div>

部分文件因文件數量過多而無法顯示