วิธีแก้ไขปัญหา AMP ทั่วไปใน WordPress
เผยแพร่แล้ว: 2023-07-18คุณติดตั้ง AMP บนเว็บไซต์ของคุณแล้วหรือยัง และกำลังประสบปัญหาบางอย่างอยู่หรือไม่ หากคุณอ่านบทความนี้ต่อไป ที่นี่ เราจะแสดง วิธีแก้ปัญหา AMP ทั่วไปใน WordPress และปรับปรุงประสบการณ์ผู้ใช้
ก่อนจะไปกันต่อ เรามาดูกันว่า AMP คืออะไร
แอมป์คืออะไร?
Accelerated Mobile Pages (AMP) เป็นความคิดริเริ่มโอเพ่นซอร์สที่ออกแบบมาเพื่อเพิ่มประสิทธิภาพการทำงานของหน้าเว็บบนมือถือ Twitter และ Google สนับสนุนโครงการนี้ AMP ใช้เทคโนโลยีเพื่อโหลดหน้าเว็บที่มีน้ำหนักเบาอย่างรวดเร็วสำหรับสมาร์ทโฟนและแท็บเล็ต
AMP ใช้ HTML เวอร์ชันที่เรียบง่ายเพื่อปรับปรุงประสิทธิภาพและฟังก์ชันการทำงานของหน้าเว็บบนอุปกรณ์เคลื่อนที่ แท็กบางแท็กที่ใช้กับโค้ดของหน้าเว็บทั่วไปไม่สามารถใช้ร่วมกับ AMP ได้ จำเป็นต้องใช้เวอร์ชัน CSS ที่มีน้ำหนักเบา รูปภาพจะโหลดเมื่อผู้ใช้เลื่อนไปยังตำแหน่งเท่านั้น และไม่สนับสนุนแบบฟอร์ม AMP มาพร้อมกับไลบรารี JavaScript ที่จำกัด
Google แคชหน้า AMP ส่วนใหญ่ แต่บุคคลที่สามและผู้เผยแพร่สามารถรักษาหน้าเหล่านั้นได้ จากข้อมูลของ Google หน้า AMP ที่แสดงในการค้นหาของ Google ใช้ข้อมูลหนึ่งในสิบของหน้าปกติ และโดยทั่วไปจะโหลดในเวลาน้อยกว่าหนึ่งวินาที
ตอนนี้คุณรู้แล้วว่า AMP คืออะไร ต่อไป มาดูกันว่าเหตุใดการใช้ AMP บนไซต์ WordPress ของคุณจึงดี
ทำไมคุณควรใช้ AMP
มีหลายเหตุผลที่ควรใช้ AMP ข้อดีที่สำคัญบางประการของ AMP คือ:
- ประสบการณ์ผู้ใช้: AMP มอบประสบการณ์การใช้งานที่ราบรื่นและรวดเร็วยิ่งขึ้นบนอุปกรณ์เคลื่อนที่ เนื่องจากช่วยลดเวลาในการโหลดหน้าเว็บ ผู้ใช้จะยังคงมีส่วนร่วมและพึงพอใจกับเนื้อหาของคุณ ซึ่งจะนำไปสู่อัตราตีกลับที่ลดลงและการรักษาผู้ใช้ที่เพิ่มขึ้น
- อันดับและการเข้าชมที่ดีขึ้น: Google ให้ความสำคัญกับ AMPs ในเครื่องมือค้นหาของตน เนื่องจากเวลาที่ใช้ในการโหลดหน้าเว็บทั้งหมดเป็นองค์ประกอบสำคัญในการกำหนดผลลัพธ์ สิ่งนี้ส่งผลดีต่อการจัดอันดับเว็บไซต์
- ความเร็วของหน้า: AMP ใช้ HTML, CSS และ JavaScript เวอร์ชันลดขนาดลง พร้อมด้วยความสามารถในการแคช เวอร์ชันเหล่านี้ช่วยให้เว็บไซต์โหลดเร็วขึ้น
- การเพิ่มประสิทธิภาพมือถือ: เมื่อการใช้งานมือถือเพิ่มขึ้น การตรวจสอบให้แน่ใจว่าเว็บไซต์ของคุณเป็นมิตรกับมือถือเป็นสิ่งสำคัญ AMP เพิ่มประสิทธิภาพหน้าเว็บของคุณสำหรับขนาดหน้าจอและอุปกรณ์ต่างๆ และการเพิ่มประสิทธิภาพนี้มอบประสบการณ์ที่ราบรื่นและตอบสนองสำหรับผู้ใช้มือถือ
- การผสานรวมการวิเคราะห์: ด้วยตัวเลือกการผสานรวมการวิเคราะห์ AMP ช่วยให้คุณสามารถติดตามพฤติกรรมของผู้ใช้และวัดการมีส่วนร่วมได้ นอกจากนี้ยังช่วยให้คุณรวบรวมข้อมูลเชิงลึกอันมีค่าเกี่ยวกับประสิทธิภาพเว็บไซต์ของคุณ
- เพิ่มรายได้: HTML ที่เข้ารหัสด้วย AMP ช่วยเพิ่มอรรถประโยชน์โดยรวมของโฆษณาและรูปภาพ เนื่องจากอัตราการแสดงโฆษณาที่เพิ่มขึ้น ผู้เผยแพร่จึงสามารถสร้างรายได้จากเว็บไซต์ได้มากขึ้น
ส่วนถัดไปจะแสดงปัญหา AMP ยอดนิยมหกรายการและวิธีแก้ไข
วิธีแก้ไขปัญหา AMP ทั่วไปใน WordPress
มีข้อผิดพลาด AMP ต่างๆ ที่คุณพบได้ขณะสร้างเว็บไซต์ ตอนนี้เราจะพูดถึงข้อผิดพลาด AMP ต่างๆ และวิธีแก้ไขปัญหา AMP ทั่วไปใน WordPress ปัญหาที่คนส่วนใหญ่เผชิญในเว็บไซต์ที่เปิดใช้งาน AMP คือ:
- URL ที่ส่งคืนข้อผิดพลาด 404
- หน้าว่าง
- ไม่มีไอคอน favicon
- ปัญหาแอตทริบิวต์ HTML
- ข้อผิดพลาด JS
- เนื้อหาไม่ตรงกัน
ด้านล่างเราจะอธิบายวิธีการแก้ไขอย่างถูกต้อง
ดังนั้นไม่ต้องกังวลใจอีกต่อไป เรามาแก้ปัญหาทุกอย่างกันเถอะ
1) ข้อผิดพลาด 404
หากทุกอย่างเป็นไปด้วยดีหลังจากติดตั้งปลั๊กอิน AMP คุณจะเข้าชมโพสต์/เพจต่างๆ ได้ทันทีโดยเพิ่มส่วนขยาย AMP ใน URL ของโพสต์ในเบราว์เซอร์บนอุปกรณ์เคลื่อนที่
ตัวอย่างเช่น หาก URL เป็น https://example.com/sample-post ให้ใช้ URL นี้บนเบราว์เซอร์ของคุณ: https://example.com/sample-post/amp/
บางครั้ง URLS จะส่งคืนข้อผิดพลาด 404 ไม่ใช่ปัญหาใหญ่ และคุณสามารถแก้ไขได้อย่างรวดเร็ว สิ่งที่คุณต้องทำคือบันทึกลิงก์ถาวรของคุณอีกครั้ง
นี่คือวิธีที่คุณสามารถทำได้
ก่อนอื่น ไปที่ การตั้งค่าลิงก์ถาวร คุณสามารถดูได้ใน ส่วนการตั้งค่า WordPress
อย่าเปลี่ยนแปลงสิ่งใดในการตั้งค่าลิงก์ถาวร และคลิกปุ่ม บันทึกการเปลี่ยนแปลง
เมื่อคุณรีเฟรชโครงสร้างลิงก์ถาวร ข้อผิดพลาด 404 จะได้รับการแก้ไข สำหรับบทช่วยสอนโดยละเอียด โปรดดูคำแนะนำเกี่ยวกับการแก้ไขลิงก์ถาวร
2) ข้อผิดพลาดหน้าว่าง
หน้าธนาคารสีขาวเป็นข้อผิดพลาดอื่นที่คุณเห็นหลังจากติดตั้งปลั๊กอิน
ข้อผิดพลาดนี้หมายความว่าเพจของคุณมีอยู่แต่ไม่สามารถแสดงได้ คุณสามารถแก้ไขข้อผิดพลาดนี้ได้โดยการรีเฟรชลิงก์ถาวรของคุณ ตรวจสอบการตั้งค่า AMP หากคุณยังคงประสบปัญหาหลังจากแก้ไขลิงก์ถาวร
ไปที่การตั้งค่าขั้นสูงแล้วคลิกเทมเพลตที่รองรับ เลือก หน้า และ ให้บริการเทมเพลตทั้งหมดเป็น AMP แล้วกดปุ่ม บันทึก
ตรวจสอบว่าปัญหาได้รับการแก้ไขแล้วหรือไม่โดยไปที่บล็อกหรือเพจของคุณ
3) ข้อผิดพลาด “ต้องระบุค่าสำหรับฟิลด์โลโก้”
นี่เป็นหนึ่งในข้อผิดพลาด WordPress ที่เกี่ยวข้องกับ AMP ที่พบบ่อยที่สุด หากคุณได้รับข้อผิดพลาดนี้ในรายงาน AMP แสดงว่าเว็บไซต์ของคุณไม่มีไอคอน Favicon
หลังจากสร้าง favicon โดยใช้เครื่องมือออนไลน์หรือ Adobe Illustrator แล้ว ให้ไปที่ลักษณะที่ปรากฏ แล้วคลิกปรับแต่ง
ค้นหาเอกลักษณ์ของไซต์และคลิก เลือกรูปภาพ
หลังจากเลือกภาพแล้ว ให้คลิก เผยแพร่
จากนี้ไป คุณจะไม่พบปัญหา "ต้องระบุค่าสำหรับฟิลด์โลโก้" ข้อผิดพลาด
4) URL ไม่ถูกต้องสำหรับแอตทริบิวต์ HTML 'href' ในข้อผิดพลาดแท็ก 'A'
เมื่อคุณได้รับรายงานข้อผิดพลาด เช่น URL ไม่ถูกต้องสำหรับแอตทริบิวต์ HTML 'href' ในองค์ประกอบ '<a>' แสดงว่าเว็บไซต์ของคุณมีลิงก์ที่ชี้ไปยังหน้าเว็บที่ไม่มีอยู่จริง
ในการแก้ปัญหา ให้ตรวจสอบว่า URL อยู่ในรูปแบบที่ถูกต้องและสะกดถูกต้อง สิ่งที่น่าสังเกตอีกอย่างคือเพื่อให้แน่ใจว่าคุณใช้โปรโตคอลที่ถูกต้อง (HTTP หรือ HTTPS) คุณสามารถใช้เครื่องมือออนไลน์ใดก็ได้ในการสแกนหาลิงก์เสีย หากคุณใช้ WordPress เป็น CMS ให้ใช้ปลั๊กอินอย่าง Broken Link Checker
หลังจากแก้ปัญหา URL แล้ว ข้อผิดพลาด AMP จะหายไป
5) ข้อผิดพลาด “แท็ก ' *********.js Script' ปรากฏมากกว่าหนึ่งครั้งในเอกสาร”
หากคุณเพิ่มไฟล์ JavaScrpt เดียวกันลงในหน้าเว็บสองครั้งขึ้นไป หน้าเว็บจะสร้างข้อผิดพลาดนี้ วิธีที่ดีที่สุดในการแก้ไขปัญหานี้คือการลบไฟล์ที่ซ้ำกัน เมื่อไฟล์ JS ถูกเรียกใช้สองครั้ง อันดับของเว็บไซต์และประสบการณ์ของผู้ใช้อาจได้รับผลกระทบ คุณสามารถดูหน้าต้นฉบับและสแกนหน้า HTML
คุณพร้อมดำเนินการต่อเมื่อคุณลบรายการที่ซ้ำกันทั้งหมดแล้ว
6) เนื้อหาไม่ตรงกันใน AMP
เมื่อหน้าเว็บเวอร์ชัน AMP และเวอร์ชัน Canonical แสดงเนื้อหาที่แตกต่างกัน คุณจะได้รับเนื้อหาที่ไม่ตรงกันใน AMP ในรายงาน Google Search Console ในการแก้ไขปัญหานี้ ขั้นแรก คุณต้องระบุสาเหตุที่ทำให้เกิดความไม่ตรงกันนี้ คุณสามารถเปรียบเทียบทั้งสองเวอร์ชันและวิเคราะห์ข้อความ รูปภาพ สื่ออื่นๆ และอื่นๆ
เมื่อคุณพบปัญหาแล้ว โปรดแก้ไข หลังจากนั้น คุณจะใช้เครื่องมือตรวจสอบความถูกต้องของ AMP เพื่อยืนยันการแก้ไขได้ คุณสามารถตรวจสอบรายงานคอนโซลค้นหาสำหรับข้อมูลเพิ่มเติม
เมื่อคุณส่ง URL อีกครั้งในพร็อพเพอร์ตี้ Search Console อาจใช้เวลา 2 ถึง 4 วันในการรวบรวมข้อมูลหน้าอีกครั้ง
ธีม WordPress พร้อม AMP ที่ดีที่สุด
ต่อไปนี้เป็นธีม WordPress พร้อม AMP ที่ดีที่สุดห้ารายการที่คุณสามารถใช้ได้:
- จันนาห์
- โตมร
- นูร์
- โซเลดัด
- บท
ด้านล่างนี้ เราจะแสดงรายการสิ่งที่ทำให้แต่ละธีมมีความพิเศษ เลือกตัวเลือกตามความต้องการของคุณ
1) ยานนาห์
Jannah เป็นธีม AMP ที่พร้อมสำหรับจอประสาทตาและตอบสนอง ซึ่งเปิดโลกแห่งโอกาสให้กับคุณ ธีมนี้เป็นที่นิยมสำหรับการออกแบบที่หลากหลายและเต็มไปด้วยฟีเจอร์ เหมาะสำหรับเว็บไซต์ต่างๆ รวมถึงข่าว นิตยสาร บล็อก และเว็บไซต์เผยแพร่ คุณได้รับมากกว่าธีม WordPress ที่ออกแบบมาสำหรับบล็อกและนิตยสารออนไลน์ Jannah ช่วยคุณได้ ไม่ว่าคุณจะต้องการเปิดตัวนิตยสารยอดนิยม บล็อกส่วนตัว หรือพอร์ตโฟลิโอออนไลน์ที่มั่นคง
ธีมนี้มีการสาธิตที่พร้อมใช้งานมากกว่า 20 รายการซึ่งช่วยเร่งกระบวนการสร้างเว็บไซต์ Jannah เป็นธีม AMP ที่เข้ากันได้อย่างสมบูรณ์ สิ่งนี้ทำให้มั่นใจได้ว่าหน้าเว็บบนมือถือของเว็บไซต์ของคุณจะโหลดได้อย่างรวดเร็วและมอบประสบการณ์การใช้งานที่ดีที่สุดแก่ผู้ใช้ ด้วยการรวม AMP ผู้เผยแพร่สามารถสร้างเนื้อหาที่พร้อมใช้งานบนมือถือได้อย่างง่ายดาย
คุณสมบัติที่สำคัญ
- ความเข้ากันได้ของแอมป์
- ปรับให้เหมาะสมสำหรับความเร็ว
- ปรับแต่งได้สูง
- สร้างเพจที่เป็นมิตร
- เพิ่มประสิทธิภาพโฆษณา
ราคา
Jannah เป็น ธีมระดับพรีเมียม และมีค่าใช้จ่าย $59 (ค่าธรรมเนียมครั้งเดียว) สามารถซื้อผลิตภัณฑ์ได้จากตลาด ThemeForest
2) จีเวลลิน
ธีมนี้เป็นหนึ่งในธีม WordPress ที่พร้อมใช้งาน AMP ที่ดีที่สุด และจะมอบประสบการณ์ที่ยอดเยี่ยมแก่ผู้ใช้ไม่ว่าจะใช้อุปกรณ์ใดก็ตาม คุณสามารถใช้การสาธิตที่ยอดเยี่ยมกับธีมเมื่อคุณเริ่มใช้งาน สิ่งเหล่านี้ปรับแต่งได้ง่ายและคุณมั่นใจได้ว่าเว็บไซต์ของคุณจะดูดีและโหลดได้อย่างรวดเร็วในเวลาเพียงไม่กี่นาที
คุณสมบัติเด่นอีกอย่างของธีมคือเหมาะสำหรับ SEO คุณสามารถจัดอันดับเนื้อหาของคุณให้สูงขึ้นได้ด้วยธีม เนื่องจากโตมรพร้อมแปลภาษาแล้ว
คุณสมบัติที่สำคัญ
- รองรับแอมป์
- ปรับให้เหมาะสมสำหรับ SEO
- พร้อมแปล
- ไซต์สาธิตหลายแห่ง
- รหัสสะอาด
ราคา
Javelin เป็น ธีม WordPress ระดับพรีเมียม สามารถดาวน์โหลดธีมได้จากตลาด ThemeForest โดยเสียค่าใช้จ่าย $59 (ครั้งเดียว)
3) นูร์
Noor เป็นธีมที่ตอบสนอง หลากหลาย และเป็นมิตรกับ SEO พร้อมคุณสมบัติที่ยอดเยี่ยม นี่เป็นตัวเลือกที่ดีสำหรับผู้ใช้ที่ต้องการใช้ธีม AMP ที่มี 0 bloats คุณยังสามารถทำให้ไซต์ของคุณทำงานได้อย่างสมบูรณ์โดยใช้ปลั๊กอินพรีเมียม เช่น BuddyPress, WooCommerce, bbPress และ Event Calendar Pro ปลั๊กอินทั้งหมดนี้เข้ากันได้กับธีม Noor WordPress
คุณสามารถใช้ตัวสร้างการลากและวางเพื่อเพิ่มองค์ประกอบในหน้าของคุณ ทีมสนับสนุนก็ยอดเยี่ยมเช่นกัน หากต้องการความช่วยเหลือ คุณสามารถติดต่อฝ่ายสนับสนุนของ Noor พวกเขาจะช่วยคุณในทุกปัญหา
คุณสมบัติที่สำคัญ
- การสาธิตที่ยอดเยี่ยมหลายรายการ
- SEO เพิ่มประสิทธิภาพ
- รองรับแอมป์
- พร้อมแปลและรองรับภาษา RTL
ราคา
เป็น ธีมพรีเมี่ยม Noor มีค่าใช้จ่าย $59 (ตลอดชีพ) สามารถดาวน์โหลดธีมได้จากตลาด ThemeForest
4) โซเลดัด
Soledad เป็นธีมอเนกประสงค์ที่เหมาะสำหรับการใช้งานเว็บไซต์สำหรับผู้ใช้มือถือ ประกอบด้วยโมดูลตัวสร้างหน้า Visual Composer ซึ่งทำให้ง่ายต่อการปรับแต่งเว็บไซต์หรือบล็อก หากคุณต้องการให้เว็บไซต์ของคุณทำงานได้อย่างรวดเร็ว มีเทมเพลตสาธิตคุณภาพสูงจำนวนมาก (มากกว่า 2,000 รายการ) ที่คุณสามารถใช้เป็นจุดเริ่มต้นได้
ชุดรูปแบบนี้เข้ากันได้กับ WooCommerce ดังนั้นการเปิดร้านค้าออนไลน์จะไม่เป็นปัญหา ธีมนี้ออกแบบมาอย่างสมบูรณ์สำหรับเครื่องมือค้นหา และหากคุณใช้ปลั๊กอิน SEO และเทคโนโลยี AMP อื่นๆ คุณสามารถจัดอันดับเนื้อหาของคุณบน Google และเครื่องมือค้นหาอื่นๆ ได้อย่างรวดเร็ว
ชุดรูปแบบนี้ยังมีวิดเจ็ตที่ไม่ซ้ำกัน 11 รายการ แถบด้านข้างและเมนูที่เหนียวหนึบขนาดใหญ่ และคุณสมบัติอื่น ๆ ที่ทำให้ผู้ใช้สามารถเคลื่อนที่ไปรอบ ๆ ไซต์ของคุณได้ง่าย คุณยังสามารถใช้สไตล์การเก็บถาวรที่แตกต่างกันบนเว็บไซต์ของคุณ
คุณสมบัติที่สำคัญ
- ไซต์สาธิตมากกว่า 2,000 แห่ง
- รองรับแอมป์
- ปรับให้เหมาะสมสำหรับเดสก์ท็อปและอุปกรณ์พกพา
- พร้อมแปลและรองรับ RTL
ราคา
Soledad เป็น ธีม WordPress ระดับพรีเมียม คุณสามารถดาวน์โหลดได้จากตลาด ThemeForest ซึ่งมีค่าใช้จ่าย $59 (ค่าธรรมเนียมครั้งเดียว)
5) บท
Chap เป็นธีม WordPress พร้อม AMP ที่ดูดีและปรับแต่งได้สูง เหมาะสำหรับเว็บไซต์ประเภทต่างๆ รวมถึงบล็อก พอร์ตโฟลิโอ แลนดิ้งเพจ ร้านค้าอีคอมเมิร์ซ และธุรกิจต่างๆ คุณสามารถใช้แผงธีมเพื่อเปิดเว็บไซต์ของคุณได้อย่างรวดเร็ว Chap ยังมีการสาธิตมากมายเพื่อให้เว็บไซต์ของคุณใช้งานได้
ชุดรูปแบบยังสามารถปรับแต่งได้สูง คุณสามารถเปลี่ยนทุกตารางนิ้วผ่านเครื่องมือปรับแต่ง WordPress
ลักษณะเด่นอย่างหนึ่งของธีมคือรูปแบบเมนูที่ไม่ซ้ำกัน 10 รูปแบบ Chap จะปรับปรุงกระบวนการชำระเงิน WooCommerce ของคุณอย่างมากด้วยประสบการณ์ที่รวดเร็ว การออกแบบของธีมนั้นดีที่สุดสำหรับ AMP; ด้วยวิธีนี้ คุณจะได้รับผลการค้นหาที่ได้รับการปรับปรุง การเข้าชมที่ดีขึ้น และการมีส่วนร่วมกับเว็บไซต์ที่ดีขึ้น
คุณสมบัติที่สำคัญ
- ตัวเลือกการสาธิตหลายตัว
- ปรับให้เหมาะสมสำหรับ WooCommerce
- สร้างเพจที่เป็นมิตร
- เพิ่มประสิทธิภาพ AMP
- ปรับแต่งได้สูง
ราคา
Chap เป็น ธีมระดับพรีเมียม ใบอนุญาตปกติมีค่าใช้จ่าย $59 (ค่าธรรมเนียมครั้งเดียว) คุณสามารถดาวน์โหลดได้จากตลาด ThemeForest
บทสรุป
คุณอาจประสบปัญหาหลายอย่างเมื่อเปิดใช้งาน AMP บนเว็บไซต์ WordPress ของคุณ ปัญหาที่พบบ่อยที่สุดคือหน้าที่ส่งคืนข้อผิดพลาด 404 เนื้อหาไม่ตรงกัน URL ไม่ถูกต้องสำหรับแอตทริบิวต์ HTML เป็นต้น บทความนี้แสดงปัญหายอดนิยม 6 รายการที่คุณพบได้ในเว็บไซต์ AMP และวิธีแก้ไข
การแก้ไขทั้งหมดไม่จำเป็นต้องมีความรู้ทางเทคนิค และคุณสามารถแก้ปัญหาได้ด้วยการคลิกเมาส์เพียงไม่กี่ครั้ง
เราหวังว่าคุณจะพบว่าบทความนี้มีประโยชน์และสนุกกับการอ่าน หากคุณเคย โปรดพิจารณาแบ่งปันโพสต์นี้กับเพื่อนและเพื่อนบล็อกเกอร์ของคุณบนโซเชียลมีเดีย
คุณประสบปัญหาใดๆ หลังจากติดตั้ง AMP หรือไม่
แจ้งให้เราทราบในความคิดเห็น.
นอกจากนี้ ต่อไปนี้เป็นบทความบางส่วนที่คุณจะพบว่ามีประโยชน์:
- วิธีเพิ่มประสิทธิภาพ WordPress สำหรับอุปกรณ์มือถือ
- สุดยอดธีม WordPress ที่เหมาะกับมือถือ
- วิธีปิดใช้งานการคลิกขวาที่รูปภาพ WordPress