เชื่อมต่อ Webflow API เพื่อสร้างแดชบอร์ดอันเป็นเอกลักษณ์: ดึงข้อมูลจาก Collections/Items อย่างปลอดภัย, ใช้คีย์/แคชเพื่อลด rate limit, รวม GA4/Search Console, กำหนด pipeline รายชั่วโมง, ส่งออก BigQuery/Sheets และวัด KPI หลักทั้งหมดในที่เดียว.

Webflow API → Custom Dashboard สำหรับทีมการตลาด/ผู้บริหาร (อัปเดต 2025)

ภาพรวม เป้าหมายคือรวม “ข้อมูลจาก Webflow CMS + สัญญาณทราฟฟิก/คอนเวอร์ชัน” ไว้ในแดชบอร์ดเดียวที่ผู้บริหารดูรู้เรื่อง ทีมคอนเทนต์ปรับทันที และฝ่ายเทคนิคดูแลได้ง่าย

สถาปัตยกรรมข้อมูล (แนวทาง)

โค้ดตัวอย่าง: ดึงรายการจาก Webflow CMS (Node.js)

// ใช้ Node 18+ (มี fetch ในตัว). ตั้งค่า env: WEBFLOW_TOKEN, COLLECTION_ID
const API = 'https://api.webflow.com/v2';
const headers = {
  'Authorization': `Bearer ${process.env.WEBFLOW_TOKEN}`,
  'accept': 'application/json'
};

async function listItems(collectionId, limit = 100) {
  const res = await fetch(`${API}/collections/${collectionId}/items?limit=${limit}`, { headers });
  if (!res.ok) throw new Error(`Webflow API error: ${res.status}`);
  const json = await res.json();
  return json?.items ?? [];
}

(async () => {
  const items = await listItems(process.env.COLLECTION_ID);
  // TODO: map fields → KPI และบันทึกลง BigQuery/Sheets
  console.log(`Items: ${items.length}`);
})();

หมายเหตุ: ตรวจเอกสาร Authentication/Scopes/Rate Limits จาก Webflow Developers ก่อนขึ้นโปรดักชัน และอย่าลืมจัดการ Error/Retry/Backoff

ตัวชี้วัด (KPI) ที่นิยมใช้บนแดชบอร์ด