Cài đặt AMP cho WordPress

Quảng cáo
Ads_ngang
Website dinhthuanit.com có bài Cài đặt AMP cho WordPress

AMP là gì?

Google đã ban bố AMP là một sáng kiến mã nguồn mở để cung cấp khả năng duyệt web di động nhanh hơn. Theo mô tả của TechCrunch, nhiều người coi AMP như 1 nỗ lực của Google để cạnh tranh tốt hơn với Facebook’s Instant Articles và ứng dụng di động của Facebook ngày càng cung cấp duyệt web nhanh hơn, được bố trí hợp lý hơn.

Các trang được tối ưu hóa với AMP sẽ xuất hiện khi duyệt web trên thiết bị di động ở đầu kết quả của Google Tìm kiếm, sau đó là các bài viết HTML truyền thống được xếp phía dưới. Và những trang AMP này sẽ tải gần như ngay lập tức.

Đây là một phiên bản HTML rất hạn chế, yêu cầu những thay đổi lớn đối với trang web của bạn và ảnh hưởng tới các quảng cáo nào bạn đang sử dụng.

Các plugin AMP WordPress miễn phí

Tin vui là WordPress đã tung ra một plugin AMP miễn phí giúp bạn tiến hành AMP cho WordPress mà không cần phát triển thêm. Tuy nhiên, nó có rất nhiều hạn chế. Thiết kế trang web của bạn bị hạn chế nhiều và có xung đột với những plugin WordPress khác, các kỹ thuật tối ưu hóa thông dụng và hơn thế nữa. AMP cũng sẽ trở thành gánh nặng bổ sung cho những nhà phát triển theme WordPress.

AMP đang ở giai đoạn mở đầu, và Google đã chọn tạo cấu trúc khung tận gốc mới tận dụng tối ưu hóa HTML5 để cấu hình mau hơn cách tải trang, tải gì trước và cách sắp xếp văn bản nhanh. Đây sẽ là 1 cách tiếp cận thú vị.

Trong hướng dẫn này, mình sẽ chỉ dẫn bạn cài đặt plugin AMP cho WordPress và Yoast SEO Glue cho plugin AMP, điều đó giúp bạn kiểm soát tốt hơn.

Cách dùng AMP với WordPress?

Dưới này là tỉ dụ về trang AMP so với trang HTML gốc. Bạn cũng đều có thể duyệt xem dạng động, và đối chiếu giữa bản gốc và phiên bản AMP. Chắc chắn, tải trang với AMP sẽ nhanh hơn nhiều.

Thẻ link sau được thêm nữa mọi trang trong phần , để nói cho công cụ kiếm tìm biết trang có phiên bản AMP.

   

Và có một liên kết khác định vị URL trang nguồn:

   

Tiếp theo, mình sẽ hướng dẫn các bạn kích hoạt AMP cho WordPress. Yêu cầu bạn tải & cài đặt các plugins ở dưới đây.

AMP WordPress Plugin

Tải plugin AMP WordPress. Hoặc cài đặt trực tiếp từ Bảng điều khiển WordPress. Bằng cách vào Plugin > Add New và kiếm tìm AMP. Sau đó, nhấp vào Install Now :

Sau khi kích hoạt, chỉ cần truy cập vào bất kỳ bài đăng nào trên blog WordPress của bạn bằng sự việc thêm /amp/ .

Glue for Yoast SEO & AMP Plugin

Plugin AMP từ WordPress cung cấp một số tùy chỉnh. SEO Yoast đã tạo nên một add-on cho plugin SEO thông dụng của họ, giúp tăng cường hỗ trợ AMP hơn nữa.

Bạn cũng có thể cài đặt Glue for Yoast SEO & AMP Plugin và kích hoạt, trong quản trị WordPress.

Chú ý: plugin Yoast SEO cần được cài trước đó.

Một menu AMP sẽ xuất hiện sau khi bạn kích hoạt plugin, ở dưới menu SEO.

Bạn sẽ thấy các cách khác nhau mà plugin Glue cấp phép bạn cải thiện tiến hành AMP của mình. Thứ nhất, Yoast cấp phép bạn mở rộng chức năng AMP cho các trang và các loại trang WordPress khác. AMP theo mặc định chỉ thay đổi các bài đăng về thời gian — bài đăng chủ yếu được thiết kế cho các bài viết tin tức:

Lưu ý: Nếu bạn gặp lỗi các chuẩn bị trống, hãy chắc chắn bạn có cập nhật lại plugin Yoast SEO gốc và nó sẽ khắc phục lỗi này.

Yoast cung cấp vài cách giúp bạn tùy chỉnh thương hiệu, thiết kế và phối màu cho giao diện AMP:

May mắn, Glue có cung cấp cách đặt mã Analytics theo kiểu AMP. Lưu ý Sử dụng đoạn mã dưới đây của mình để Analytics có thể hoạt động đúng:

Mình có trích dẫn mã gắn Google Analytics cho phiên bản AMP , chỉ cần thay đổi mã tài khoản của bạn:

        

Chắc chắn Yoast sẽ tiếp tục cập nhật plugin Glue của họ theo thời gian khi chức năng AMP được phát triển thêm.

Gỡ lỗi AMP

Mình có cài đặt AMP cùng một vài ngay sau đã thu được một email từ Google Search Console báo cáo 10 trang có lỗi. Nhưng trên thực tế, mọi bài đăng AMP trên trang web đều bị lỗi. Đăng nhập vào Google Search Console để duyệt các trang có lỗi và thấy điều này:

Khi bấm vào một trong những các trang:

Sau đó, mở trang và coi xét chi tiết các lỗi. Về cơ bản, bạn có thể thi hành vấn đề này theo cách thủ công bằng cách thêm /amp#development=1 vào URL, VD: http://yourdomain.com/2014/02/24/how-to-secure-your-mac-from-potential-theft/amp/#development=1 Và sau đó, mở Bảng điều khiển JavaScript trong trình duyệt của bạn:

Hóa ra mọi thứ các trang hỗ trợ AMP đã biết thành vi phạm do lỗi: “ The tag 'script' is disallowed except in specific forms “. Điều này yêu cầu sử dụng tính năng tùy chỉnh của W3 Total Cache để sửa lại một số tối ưu JavaScript. AMP không cấp phép đặt JS trước thẻ .

   

Suy nghĩ trước mắt là sẽ tắt tối ưu JS với một số đường dẫn như /amp/ hoặc tìm giải pháp khác. Việc đặt các tập lệnh này trở lại trong thẻ sẽ giảm Tốc độ trang Google. Điều thú vị là gần đây tôi cũng phát giác ra rằng việc sử dụng quảng cáo DFP của Google trên trang web của mình cũng phá tan Tốc độ trang của Google. Google là một bậc thầy kiếm tìm đầy thử thách và không đơn giản giúp bạn sử dụng tất cả các công nghệ của họ cùng nhau.

Kết luận

Về cơ bản, AMP là công nghệ cấp phép một trang web được tối ưu hóa có mức giá trị trong mắt Google bởi cộng đồng nguồn mở, trong lúc “Facebook’s Instant Articles (Bài viết tức thì của Facebook)” được khai mở tiên phong, dành riêng cho các hệ sinh thái Facebook.

Bài viết Cài đặt AMP cho WordPress được tổng hợp và biên tập bởi: dinhthuanit.com. Mọi ý kiến đóng góp và phản hồi vui lòng gửi Liên Hệ cho dinhthuanit.com để điều chỉnh. dinhthuanit.com xin cảm ơn.

Bài Viết Liên Quan


Bài Viết Khác


Quảng cáo
Ads_ngang