Hướng dẫn cài đặt AMP cho WordPress 2017
Hướng dẫn cài đặt AMP cho WordPress 2017

Bài viết này mình sẽ hướng dẫn các bạn thủ thuật cài đặt AMP cho wordpress 2017 chuẩn nhất, hướng dẫn sửa các lỗi phát sinh khi cài đặt và sử dụng chức năng này.

Định nghĩa AMP là gì?

Xu hướng 2017 bắt đầu hướng về các trang di động và AMP (Accelerated Mobile Pages) đang được nhắm tới là đích đến của các website, blog wordpress nhằm tối ưu hóa tốc độ trên giao diện mobile.

Tốc độ tải trang của Google AMP nhanh hơn gấp 4 lần so với các trang web thông thường. Google đã tuyên bố nếu trang web của bạn tương thích với AMP thì sẽ được ưu tiên trên kết quả tìm kiếm. Bạn hãy test thử tốc độ bằng điện thoại 2 link dưới đây để tự trải nghiệm.

Không AMP: https://vuminhchien.com/tang-toc-wordpress-voi-wp-config-php/

Có AMP: https://vuminhchien.com/tang-toc-wordpress-voi-wp-config-php/amp/

Hướng dẫn cài đặt AMP cho wordpress 2017

Để cài đặt Google AMP cho WordPress đơn giản bạn chỉ cần tải và cài đặt các plugin hỗ trợ dưới đây nhằm tối ưu hóa tốt nhất cho trang AMP của bạn.

Lưu ý chỉ cài 1 trong 2 plugin Glue for Yoast SEO & AMP hoặc Facebook Instant Articles & Google AMP Pages by PageFrog là khá đủ điều kiện cho trang amp của bạn. nếu bạn cần thêm chức năng Facebook Instant Articles thì cài cả 2.

Sau khi cài xong 3 plugin trên thì cơ bản bạn đã tạo được trang AMP. Bạn có thể kiểm tra trang amp của một bài viết bất kỳ đã chuẩn chưa bằng cách sử dụng công cụ test amp chính thức của Google. Link trang amp bạn chỉ việc thêm /amp sau domain. VD: http://domain/amp

cai-dat-amp-cho-wordpress

Cài đặt nâng cao cho trang AMP của bạn

Sau khi trang bạn đã tạo thành công trang AMP thì bạn nên tùy chỉnh thêm 1 số thứ nữa với các plugin đã cài ở trên như sau.

#1 Với Plugin AMP

Plugin này cứ cài là được, không cần setting gì cả

#2 Với Plugin Yoast SEO & AMP

Bạn truy cập vào đường dẫn như ảnh để vào phần cài đặt.

cai-datt-amp-cho-website-wordpress

cai-dat-amp-cho-post
Cài đặt AMP cho post, lưu ý rằng không nên bật amp cho page và các tập tin đa phương tiện vì nó chưa được hỗ trợ và thường xảy ra rất nhiều lỗi.
cài đặt amp cho wordpress 2017
Chuyển sang mục design để tùy chỉnh trang amp của bạn theo ý thích.

Chức năng chính của mục này là:

  • Bổ sung tùy chỉnh logo và metadata logo.
  • Cho phép tùy chỉnh hiển thị ảnh đại diện cho bài post.
  • Cho phép tùy chỉnh hiển thị phần comment.
  • Cho phép tùy chỉnh AMP áp dụng với Woocommerce.
  • Thiết lập độ rộng mong muốn cho trang AMP.
  • Cài đặt Google Analytics.
  • Bổ sung CSS và HTML vào footer.

Cuối cùng bạn chuyển sang mục AMP Analytics và dán code theo dõi vào là xong.

#3 Với Plugin Facebook Instant Articles & Google AMP Pages by PageFrog

Plugin này giúp bạn tùy chỉnh trang amp của bạn tương tự plugin trên nhưng thêm 1 số cài đặt giúp tăng tốc website trên facebook là Facebook Instant Article

Để cài đặt bạn chỉ cần vào phần Mobile Formats trên giao diện điều khiển wordpress.

Facebook Instant Article và google ampFacebook Instant Article và google amp

  • Tag setup (được cài đặt theo mặc định, bạn không phải làm gì cả)
  • Tag styling giúp bạn tùy chỉnh trang amp có tác dụng như ở plugin trên.

Tag styling giúp bạn tùy chỉnh trang amp có tác dụng như ở plugin trên.

  • Mục Analytics: cài đặt thêm nếu có nhu cầu đặt mã theo dõi cho trang amp. Bạn chỉ cần bấm vào phần google analytics và login với tài khoản google. > Cấp quyền cho ứng dụng > chọn trang web cần theo dõi là xong.

Tag Analytics: cài đặt thêm nếu có nhu cầu đặt mã theo dõi cho trang amp. Bạn chỉ cần bấm vào phần google analytics và login với tài khoản google. > Cấp quyền cho ứng dụng > chọn trang web cần theo dõi là xong.

  • Mục ADs: dành cho các bạn kết nối với tài khoản google adsense và fb ads.
  • Mục Setting: đây là mục quan trọng nhất bạn cài đặt như hình dưới.

Facebook Instant Article và google amp setiing

google-amp-setting-plugin

Sau khi cài đặt xong bạn nhớ bấm lưu lại.

Một số lưu ý với trang AMP của bạn – Lỗi AMP và cách khắc phục

Chuẩn AMP là gì?

Bạn cần tuân thủ các yêu cầu sau để có được một trang chuẩn amp nhất:

  • Không dùng thẻ <form>  trên trang AMP.
  • Nghiêm cấm sử dụng thẻ < Script>  trên trang AMP, nói không với javascripts.
  • Iframes có thể được nhúng trên trang AMP, nhưng phải sửa <iframe> thành <amp-iframe> . ( VD: khi nhúng google map hoặc video từ nguồn khác.
  • Chuẩn AMP được sử dụng cho hầu hết các tag HTML và dùng theo chuẩn html.

Lỗi index AMP từ Google

Phần này sẽ không xảy ra nếu bạn setting Plugin Facebook Instant Articles & Google AMP Pages by PageFrog theo hướng dẫn phía trên. Nếu bạn gặp lỗi thì hãy tham khảo cài đặt Plugin này ngay.

  • Bạn đã hoàn thành việc cài đặt AMP cho wordpress, nếu có bất kỳ lỗi nào phát sinh thêm vui lòng để lại comment cho mình.
  • Về phần cài đặt Facebook Instant Articles cho WordPress sẽ được hướng dẫn ở bài sau. Cảm ơn bạn đã theo dõi bài viết.
Hướng dẫn cài đặt AMP cho WordPress 2017
5 (1) vote

3 COMMENTS

    • Mình cũng test nhiều cái rồi. Cái này tuy nó ít tùy biến nhưng tối ưu tốt cho google. Trước em có xài vài plugin khác thì lên webmaster tool nó báo lỗi amp liên tục. Sang anh này thì hết!

      • Ah thế ah, thảo nào trong webmaster của mình cũng báo rất nhiều lỗi cần phải sửa vậy. Để mình test thử xem thế nào. Thanks nhé

LEAVE A REPLY

Please enter your comment!
Please enter your name here