เครื่องมือสร้างเมตาแท็กออนไลน์: วิธีเขียนชื่อเรื่อง คำอธิบาย และ Open Graph รวมถึงการแทรกโค้ด

คำตอบสั้นๆ คือ: ในการสร้างเมตาแท็กออนไลน์ ให้เปิด เครื่องมือสร้างเมตาแท็ก PromoPilot ฟรี กรอกข้อมูลในช่องชื่อเรื่อง คำอธิบาย Canonical Robots Open Graph และ Twitter Card ตัวอย่างเนื้อหาของ Google และ Facebook จะปรากฏทางด้านขวา พร้อมกับโค้ด HTML ที่เสร็จสมบูรณ์อยู่ด้านล่าง เพียงแค่คัดลอกด้วยการคลิกเพียงครั้งเดียวแล้ววางลงใน <head> ของหน้าเว็บ คุณสามารถเริ่มต้นจากศูนย์หรือดาวน์โหลดแท็กปัจจุบันจากหน้าเว็บที่มีอยู่แล้วผ่านลิงก์และแก้ไขได้ ด้านล่างนี้คือวิธีการกรอกข้อมูลในแต่ละช่องและหลีกเลี่ยงข้อผิดพลาดทั่วไป

ฉันทำเว็บไซต์มา 12 ปีแล้ว และเมตาแท็กเป็นสิ่งแรกที่มักจะถูกมองข้ามไปเวลาแก้ไขเทมเพลต ตัวสร้างเมตาแท็กนี้ช่วยชีวิตฉันได้มากเลย เวลาฉันต้องการสร้างบล็อกที่เหมาะสมสำหรับหน้า Landing Page หรือ Homepage อย่างรวดเร็วโดยไม่ต้องจำไวยากรณ์ og: และ twitter: ให้ยุ่งยาก

เครื่องมือสร้างเมตาแท็กสร้างอะไรขึ้นมา?

เครื่องมือสร้างโค้ดนี้เป็นแบบฟอร์มที่มีคำแนะนำซึ่งจะแปลงข้อความของคุณให้เป็นโค้ดที่ถูกต้อง ต่อไปนี้คือช่องที่เครื่องมือนี้กรอกข้อมูลให้ และหน้าที่ของแต่ละช่อง

ด้านล่างช่องกรอกข้อมูลจะมีตัวนับจำนวนอักขระพร้อมช่วงที่แนะนำ ด้านขวาคือตัวอย่างการแสดงผลข้อความย่อของ Google และโพสต์ Facebook แบบเรียลไทม์ และด้านล่างสุดคือโค้ด HTML ที่สร้างขึ้น

วิธีสร้างเมตาแท็กออนไลน์?

1. เปิด ตัวสร้างเมตาแท็ก หากหน้าเว็บนั้นมีอยู่แล้ว ให้วางที่อยู่ของหน้าเว็บลงในช่องด้านบนแล้วคลิก "อัปโหลด" – แท็กปัจจุบันจะถูกแทรกเข้าไปในแบบฟอร์ม
2. เขียนชื่อเรื่องและคำอธิบายของคุณ โดยคอยสังเกตตัวนับจำนวนการเข้าชม แถบสีแดงแสดงว่าข้อความสั้นหรือยาวเกินกว่าปกติ
3. ระบุ canonical address - ที่อยู่หน้าเว็บแบบเต็มพร้อม https:// โดยไม่มีพารามิเตอร์
4. เลือก robots. สำหรับหน้าเว็บปกติ index, follow noindex ใช้ได้เฉพาะกับหน้าบริการ เช่น ตะกร้าสินค้า บัญชีส่วนตัว และผลการค้นหาของเว็บไซต์
5. กรอกข้อมูลใน Open Graph และ Twitter Card ให้ครบถ้วน: ใส่รูปภาพขนาด 1200×630 พิกเซล, ประเภท ( website สำหรับหน้าหลัก, article สำหรับบทความ, product สำหรับผลิตภัณฑ์) และภาษา เช่น ru_RU หรือ en_US
6. ตรวจสอบตัวอย่าง และคัดลอกโค้ด HTML โดยใช้ปุ่มคัดลอก

ผลลัพธ์จะมีลักษณะเหมือนบล็อกนี้ ซึ่งจะถูกแทรกเข้าไปใน <head>:

<title>Кожаные рюкзаки: 120 моделей, доставка за 2 дня | Nord</title> <meta name="description" content="120 кожаных рюкзаков в наличии, доставка по Европе за 2–4 дня, возврат 30 дней."> <link rel="canonical" href=" https://example.com/ryukzaki/"> <meta name="robots" content="index, follow"> <meta property="og:title" content="Кожаные рюкзаки Nord — 120 моделей"> <meta property="og:image" content=" https://example.com/img/og-ryukzaki.jpg"> <meta property="og:type" content="website"> <meta name="twitter:card" content="summary_large_image">

โปรดทราบ: og:title ไม่จำเป็นต้องเป็นสำเนาคำต่อคำของชื่อเรื่อง ในโซเชียลมีเดีย คำว่าแบรนด์และ "ซื้อ" ฟังดูไม่เหมาะสม ดังนั้นหัวข้อที่เกี่ยวข้องมากกว่าจึงเหมาะสมกว่า และชื่อเรื่องควรสะท้อนถึงคำค้นหา

นี่คือหน้าตาของพื้นที่ทำงาน: บรรทัดสำหรับโหลดแท็กผ่านลิงก์ แบบฟอร์มทางด้านซ้าย และตัวอย่างโฆษณา Google และ Facebook ทางด้านขวา

วิธีเขียนชื่อเรื่องและคำอธิบายที่ดึงดูดให้คลิก?

ตัวสร้างนี้ติดตามความยาว แต่ไม่ติดตามเนื้อหา ต่อไปนี้คือสูตรที่ฉันใช้สำหรับประเภทหน้าเว็บต่างๆ:

• หน้าหลัก: Что продаёте + для кого / где | Бренд — ตัวอย่างเช่น Мебель из массива дуба на заказ | Woodline
• หมวดหมู่: Категория + выбор/цена/доставка | Бренд — Кожаные рюкзаки: 120 моделей, доставка за 2 дня | Nord
• สินค้า: Название + ключевое свойство + действие - Рюкзак Nord 20 л из кожи — купить с гарантией 2 года
• บทความ: Вопрос или польза + уточнение - Как выбрать матрас для спины: 7 критериев и ошибки

เขียนคำอธิบายของคุณให้เป็นคำสัญญาที่สั้นกระชับ: ผู้คนจะได้รับอะไรจากหน้าเว็บนี้ และทำไมพวกเขาจึงควรคลิก ตัวอย่างที่ไม่ดี: "ยินดีต้อนรับสู่เว็บไซต์ของเรา! เรามีสินค้าหลากหลายประเภท..." ตัวอย่างที่ดี: "มีกระเป๋าเป้หนัง 120 ใบในสต็อก จัดส่งทั่วยุโรปภายใน 2-4 วัน คืนสินค้าได้ฟรีภายใน 30 วัน เลือกแบบตามขนาดและสีที่ต้องการ"

ข้อผิดพลาดในการเขียนโค้ดทั่วไปที่ตัวสร้างโค้ดช่วยหลีกเลี่ยง:

1. ในหน้าเว็บมีแท็กชื่อเรื่องอยู่สองแท็ก แท็กหนึ่งมาจากเทมเพลต อีกแท็กหนึ่งมาจากปลั๊กอิน หลังจากวางโค้ดแล้ว โปรดตรวจสอบให้แน่ใจว่าได้ลบแท็กเก่าออกแล้ว
2. ที่อยู่แบบสัมพัทธ์ใน og:image ( /img/cover.jpg) — เครือข่ายสังคมออนไลน์คาดหวังที่อยู่แบบเต็มที่มี https://
3. การใช้ Canonical บนหน้าแรก ของทุกหน้าเป็นข้อผิดพลาดของเทมเพลตที่พบบ่อย ซึ่งทำให้หน้าเว็บเหล่านั้นหลุดออกจากดัชนี
4. noindex เป็นคำสั่งที่ถูกลืมหลังจากพัฒนาเสร็จแล้ว - เว็บไซต์เปิดใช้งานแล้ว แต่เครื่องมือค้นหาไม่พบ

ฉันควรวางโค้ดที่สร้างขึ้นที่ไหน?

โค้ดจะถูกแทรกเข้าไปใน <head> แต่ขึ้นอยู่กับเอนจิ้นที่ใช้ ในเว็บไซต์ที่สร้างเอง โค้ดจะถูกแทรกเข้าไปในเทมเพลต HTML ของหน้าโดยตรง ใน WordPress การหลีกเลี่ยงการวางโค้ดด้วยตนเองและนำเข้าข้อความจากตัวสร้างโค้ดไปยังช่องของปลั๊กอิน SEO (Yoast SEO หรือ Rank Math) จะง่ายกว่า ปลั๊กอินจะสร้างแท็กโดยอัตโนมัติและหลีกเลี่ยงการสร้างแท็กซ้ำ ในโปรแกรมสร้างเว็บไซต์ ให้มองหาส่วน "SEO" ในการตั้งค่าหน้าเว็บ

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

การเปรียบเทียบ: โปรแกรมสร้างเมตาแท็กและทางเลือกอื่นๆ

สรุป: หากเว็บไซต์ของคุณใช้ WordPress ให้กรอกข้อมูลในปลั๊กอิน SEO และใช้ตัวสร้างโค้ดเป็นแบบร่างพร้อมดูตัวอย่าง สำหรับเว็บไซต์ที่กำหนดเองหรือหน้า Landing Page แยกต่างหาก ตัวสร้างโค้ดจะสร้างโค้ดสำเร็จรูปได้เร็วที่สุด

นอกจากตัวสร้างโค้ดแล้ว PromoPilot ยังมี เครื่องมือ SEO ฟรีอีก 87 รายการ ตั้งแต่ตัวดีบัก Open Graph ไปจนถึงตัวสร้าง Schema markup

เครื่องมือสร้างเมตาแท็กมีข้อจำกัดอะไรบ้าง?

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

เมื่อไหร่ที่เครื่องมือฟรีจะไม่เพียงพอ?

โปรแกรมสร้างเอกสารนี้เหมาะสำหรับเอกสาร 5 หน้า หากต้องการใช้งานกับเอกสาร 500 หน้า ต้องใช้วิธีการที่แตกต่างออกไป และควรขอความช่วยเหลือจากผู้เชี่ยวชาญหาก:

• คุณมีแคตตาล็อกอยู่แล้ว และควรมีการกำหนดแท็กให้กับผลิตภัณฑ์ใหม่แต่ละรายการโดยอัตโนมัติ
• เว็บไซต์นี้รองรับหลายภาษา และจำเป็นต้องใส่แท็กในแต่ละภาษาให้ถูกต้องตามตำแหน่งที่ตั้ง
• คุณไม่รู้ว่าคำค้นหาแบบไหนที่จะดึงดูดผู้ซื้อ และชื่อเรื่องก็ถูกเขียนขึ้น "โดยไม่ได้วางแผนไว้ล่วงหน้า"
• หลังจากเปลี่ยนระบบจัดการเนื้อหา (CMS) แล้ว แท็กบางส่วนหายไปหรือเกิดการซ้ำซ้อน

ฉันสามารถช่วยอะไรเว็บไซต์ของคุณได้บ้าง?

ผมคือวาเลรี ดานยุก นักพัฒนาและผู้เชี่ยวชาญด้าน SEO ที่มีประสบการณ์ 12 ปี และลูกค้ากว่า 200 ราย ผมใส่เมตาแท็กในเทมเพลตตั้งแต่เริ่มต้น เพื่อให้เจ้าของเว็บไซต์ไม่ต้องกังวลเรื่องการใส่เมตาแท็กทุกครั้งที่เผยแพร่เว็บไซต์

SEO และการโปรโมท

• บริการตรวจสอบ SEO เว็บไซต์แบบครบวงจร: ฉันรวบรวมคีย์เวิร์ด เขียนเทมเพลตแท็กสำหรับทุกประเภทหน้าเว็บ และนำไปใช้ในโค้ด
• Autoblog ที่ใช้ AI เป็นทีมบรรณาธิการที่สร้างแท็กและตัวอย่างบทความแต่ละชิ้นโดยอัตโนมัติ

เว็บไซต์และร้านค้าออนไลน์

• เว็บไซต์ WordPress พร้อมผู้ช่วย AI ในราคา 299 ยูโร รวมปลั๊กอิน SEO ที่ตั้งค่าไว้แล้วและเทมเพลตแท็ก
• สร้างเว็บไซต์ในสไตล์เว็บไซต์ของคนอื่นที่คุณชื่นชอบได้ในไม่กี่นาที — ที่ 1001site ระบบจะตั้งค่าตัวอย่างสำหรับโซเชียลมีเดียและเค้าโครงเว็บไซต์ให้โดยอัตโนมัติ
• สร้างแคตตาล็อกสินค้า 300 รายการได้ในเวลาเพียงไม่กี่นาที พร้อมคำอธิบายและแท็กสำหรับแต่ละรายการโดยใช้ MCP และ Claude
• ย้ายร้านค้าของคุณจาก Instagram ไปยังเว็บไซต์ เพื่อให้สินค้าของคุณปรากฏในผลการค้นหา ไม่ใช่แค่ในฟีดของคุณเท่านั้น

ระบบ CRM และระบบอัตโนมัติ

• ระบบ ERP + เว็บไซต์ + บอท Telegram ที่ขับเคลื่อนด้วย AI สำหรับการรื้อถอนอัตโนมัติภายใน 6 วัน

ส่งที่อยู่เว็บไซต์ของคุณมา ทาง Telegram แล้วฉันจะแนะนำรูปแบบชื่อเรื่องสำหรับหน้าสำคัญๆ ของเว็บไซต์ของคุณให้

ผลลัพธ์

1. เครื่องมือสร้างเมตาแท็กออนไลน์จะประกอบส่วนหัวสำเร็จรูป ได้แก่ ชื่อเรื่อง คำอธิบาย คีย์หลัก บอท โอเพ่นกราฟ และทวิตเตอร์การ์ด พร้อมตัวอย่างการแสดงผล
2. ควรตั้งชื่อเรื่องให้มีความยาว 30-60 ตัวอักษร คำอธิบายให้มีความยาว 120-160 ตัวอักษร และใส่คำหลักและประโยชน์ไว้ข้างหน้าสุด
3. หลังจากวางโค้ดแล้ว ตรวจสอบว่าแท็กไม่ซ้ำกัน และระบุ og:image เป็นที่อยู่แบบเต็มแล้ว
4. สำหรับแคตตาล็อกและเว็บไซต์หลายภาษา จะมีการรวบรวมแท็กโดยใช้เทมเพลต หรือแพลตฟอร์มที่มีการดำเนินการนี้ไว้แล้ว เช่น 1001site

รวบรวมแท็กสำหรับหน้าแรกของคุณโดยใช้ เครื่องมือสร้างเมตาแท็กฟรี — ใช้เวลาน้อยกว่าการอ่านบทความนี้เสียอีก

แหล่งที่มา

• หน้าเครื่องมือสร้าง Meta Tag ของ PromoPilot - ฟิลด์ ช่วงค่าที่แนะนำ และคำถามที่พบบ่อย
• Open Graph Protocol (ogp.me) — คำอธิบายของแท็ก og:title, og:image, og:type, og:locale
• เอกสารแนะนำการใช้งานปลั๊กอิน Yoast SEO และ Rank Math สำหรับ WordPress