วิธีเพิ่ม Breadcrumb Schema ให้เว็บไซต์

ขั้นที่ 1: กำหนดเส้นทางของแต่ละหน้า

ทุกหน้าต้องมีเส้นทางของตัวเอง เพราะระดับสุดท้ายคือหน้านั้นเอง บทความบล็อก สินค้า และหน้าติดต่อ จะมีเส้นทางต่างกัน จดระดับไว้ก่อน โดยใช้ป้ายเดียวกับเบรดครัมบ์ที่มองเห็น

ขั้นที่ 2: สร้างบล็อก

เครื่องมือสร้างแท็ก script ที่สมบูรณ์ซึ่งมี type="application/ld+json" ภายในมี BreadcrumbList และ ListItem ที่มีหมายเลข ไม่ต้องเพิ่มอะไรรอบๆ อีก

ขั้นที่ 3: วางลงในหน้า

มีตัวเลือกที่พบบ่อยหลายแบบ ขึ้นอยู่กับวิธีสร้างเว็บไซต์ของคุณ

• หน้าสแตติก: วางบล็อกลงใน HTML ของแต่ละหน้า
• เว็บไซต์แบบเทมเพลต: เพิ่ม script ในเทมเพลตกลาง แล้วเติมชื่อและ URL จากข้อมูลของหน้า โดยใช้ผลลัพธ์ที่สร้างเป็นแบบอย่าง
• ตัวแก้ไขแบบภาพ: มองหาช่องสำหรับโค้ดกำหนดเองใน head ของหน้า แล้ววางบล็อกที่นั่น

สร้างบล็อกหนึ่งครั้งเป็นต้นแบบ แล้วทำซ้ำรูปแบบเดียวกันสำหรับหน้าอื่นในเทมเพลต

ขั้นที่ 4: ตรวจสอบผลลัพธ์

หลังเผยแพร่ ให้ส่งหน้าเข้าเครื่องมือทดสอบและยืนยันว่าตรวจพบเบรดครัมบ์โดยไม่มีข้อผิดพลาด ปัญหาที่พบบ่อยคือ URL ที่ไม่มีโปรโตคอล ป้ายที่ไม่ตรงกับเส้นทางที่มองเห็น และการคัดลอกบล็อกเดียวไปทุกหน้าโดยไม่เปลี่ยนระดับสุดท้าย

การดูแลรักษา

ถ้าย้ายหน้าหรือเปลี่ยนชื่อหมวด ให้อัปเดตทั้งเบรดครัมบ์ที่มองเห็นและ schema มาร์กอัปเก่าที่ชี้ไปยัง URL เดิมแย่กว่าการไม่มีเลย

หนึ่งหน้าตั้งแต่ต้นจนจบ

สมมติคู่มือหนึ่งหน้าอยู่ที่ https://example.com/guides/setup/ เส้นทางที่มองเห็นคือ หน้าแรก, คู่มือ, การติดตั้ง กรอกสามบรรทัด หน้าแรกคู่กับ https://example.com/, คู่มือคู่กับ https://example.com/guides/ และการติดตั้งคู่กับ https://example.com/guides/setup/ ผลลัพธ์มีตำแหน่ง 1, 2 และ 3 สำหรับคู่มือถัดไปที่ https://example.com/guides/pricing/ ให้คัดลอกบล็อกเดิมแล้วเปลี่ยนเฉพาะชื่อและ URL สุดท้าย สองรายการแรกเหมือนเดิม เทมเพลตจึงนำกลับมาใช้ได้

ถ้าดูแลหลายหน้า ให้จดเส้นทางของแต่ละหน้าในสเปรดชีตแล้วสร้างทีละหน้า ตรวจรายการแรกและรายการสุดท้ายของทุกหน้า เพราะสองจุดนี้มักคัดลอกผิดบ่อยที่สุด