--- title: โค้ดและวิดเจ็ต: CSS และสคริปต์แบบกำหนดเอง description: วิธีการเพิ่ม CSS แบบกำหนดเอง โค้ดลงในส่วนหัวและส่วนเนื้อหา (ตัวนับ แชท พิกเซล) ข้อจำกัด และการรักษาความปลอดภัย section: account keywords: CSS แบบกำหนดเอง, โค้ดส่วนหัว, โค้ดส่วนเนื้อหา, ตัวนับ, Google Analytics, พิกเซล, วิดเจ็ตแชท updated: 2026-09-16 --- ส่วน "โค้ดและวิดเจ็ต" ในการตั้งค่า ช่วยให้คุณสามารถแทรกโค้ดของคุณเองลงในเว็บไซต์ได้ เช่น ตัวนับจำนวนผู้เข้าชม พิกเซลโฆษณา วิดเจ็ตแชท แบนเนอร์คุกกี้ รวมถึง CSS ของคุณเองเพื่อปรับแต่งรูปลักษณ์ให้สวยงามยิ่งขึ้น ![บล็อกโค้ดและวิดเจ็ต](/wiki/img/settings-code.webp "โค้ดในส่วนหัวและส่วนท้ายของเนื้อหา") ## โค้ดในส่วนหัวและส่วนลำตัว - **โค้ดส่วนหัว** — แทรกเข้าไปใน `` ของแต่ละหน้าเว็บไซต์ สำหรับ Google Analytics, Meta Pixel และเมตาแท็กสำหรับการตรวจสอบ - **โค้ดส่วนท้ายของเนื้อหา** จะถูกแทรกก่อน `` สำหรับวิดเจ็ตแชท แบนเนอร์คุกกี้ และสคริปต์ที่ต้องการโหลดหน้าเว็บ วางโค้ดทั้งหมดที่ได้รับจากบริการลงในช่องที่กำหนด แล้วคลิก "บันทึก" จำกัดจำนวนอักขระ 20,000 ตัวต่อช่อง โค้ดนี้ใช้ได้เฉพาะบนเว็บไซต์สาธารณะเท่านั้น ไม่สามารถใช้ในบัญชีของคุณได้ ตัวอย่าง: - Google Analytics 4 - ส่วนของ `gtag.js` ในส่วนหัว - Meta Pixel คือส่วนย่อยของพิกเซลในส่วนหัว - วิดเจ็ตแชท (Tawk, Crisp, JivoChat) - สคริปต์อยู่ในส่วนเนื้อหา - การตรวจสอบสิทธิ์ของ Google/Bing/Yandex ทำได้สะดวกยิ่งขึ้นผ่านส่วน SEO → “การตรวจสอบสิทธิ์” ## CSS แบบกำหนดเอง การเพิ่ม CSS แบบกำหนดเองทำได้ผ่านผู้ช่วย AI หรือแชท AI ที่เชื่อมต่ออยู่: "เพิ่ม CSS: ทำให้ปุ่มกลมสนิท" ผู้ช่วยจะตรวจสอบโค้ดและนำไปใช้กับเว็บไซต์ สำหรับการปรับแต่งที่แม่นยำยิ่งขึ้น ให้ใช้แอตทริบิวต์ขององค์ประกอบเว็บไซต์ เช่น `[data-asd="card"]` สำหรับการ์ด `[data-asd="header"]` สำหรับส่วนหัว และ `[data-asd="block-hero"]` สำหรับบล็อกฮีโร่ ผู้ช่วยจะแนะนำรายการต่างๆ ให้ ไฟล์ CSS ของคุณจะถูกจัดเก็บแยกต่างหากจากไฟล์ CSS ในแคตตาล็อก: เมื่อคุณเปลี่ยนแปลงสไตล์ การแก้ไขของคุณจะยังคงอยู่ ## ข้อจำกัดและความปลอดภัย - ใน CSS ของคุณ แท็กและนิพจน์ `