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: http://tuduysale.com/tang-toc-wordpress-voi-wp-config-php/
Có AMP: http://tuduysale.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.
- AMP (Plugin tạo trang AMP của chính nhà sáng lập wordpress – Bắt buộc phải cài)
- Glue for Yoast SEO & AMP (Giúp Yoast SEO tương thích tốt hơn với AMP, hỗ trợ tùy chỉnh trang amp)
- Facebook Instant Articles & Google AMP Pages by PageFrog (Hỗ trợ google phân tích trang AMP của bạn, hỗ trợ thêm chức năng Facebook Instant Articles)
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
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.
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.
- 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.
- 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.
- 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.
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.