AMP là gì? Hướng dẫn cài đặt Google AMP chi tiết trên WordPress

Bạn đã biết AMP là gì chưa? Và đang tìm cách cài đặt Google AMP trên WordPress?

AMP có thực sự giúp website bạn load nhanh như “Ánh Sáng” trên thiết bị di động không?

Trong bài viết này mình sẽ giải thích cụ thể AMP là gì?

Những lợi ích mà nó mang lại và cách cài đặt AMP trên WordPress.

hướng dẫn cài đặt AMP trên WordPress

AMP là gì?

AMP hay Accelerated Mobile Pages là một free open-source framework, cho phép website tải gần như ngay lập tức trên thiết bị di động.

Trên blog Google từng chia sẻ “Chúng tôi muốn các website có nội dung phong phú như video, animations, graphics hoạt động tốt với các nội dung quảng cáo và được tải ngay lập tức”.

Rất rõ ràng mục tiêu của Google với AMP là mang lại trải nghiệm tốt nhất trên các thiết bị di động.

Hiện Google AMP rất phổ biến nhiều thương hiệu lớn đã sử dụng như: Facebook, BBC News, The New York Times, Forbes…

AMP

Google AMP hoạt động như thế nào?

AMP vẫn sử dụng các công nghệ web hiện tại như HTML5, CSS3, Javascript.

Sau đó các nội dung được lưu trên Google AMP Cache (bộ nhớ đệm AMP của Google).

Bộ nhớ đệm AMP của Google sẽ hoạt động giống CDN, nhưng hoàn miễn phí với mọi người sử dụng.

Khi người dùng truy cập vào website » user sẽ được xem một phiên bản đã lưu trong bộ nhớ đệm của Google.

Bộ nhớ đệm sẽ được Google cập nhật liên tục » Nói các khác cốt lõi của AMP là Cache

Điều này khá tương tự như Facebook Instant Articles .

Tuy nhiên, Instant Articles bị giới hạn chỉ trên nền tảng Facebook, cụ thể là đối với ứng dụng di động của họ.

AMP không quan trọng đó là nền tảng gì và có thể được sử dụng bởi bất cứ ứng dụng, trình duyệt hoặc web viewer nào.

Tại sạo AMP lại quan trọng ?

AMP quan trọng vì nó giúp website bạn tải nhanh hơn.

Nâng cao trải nghiệm người dùng, và sẽ kéo họ ở lại lâu hơn trên website bạn.

Và bạn cũng biết rằng, bây giờ là thởi buổi mobile-first-index (ưu tiên trên thiết bị di động trước).

Cho nên GG rất cọi trọng tốc độ tải trên thiết bị di động.

Biết đâu được nó sẽ là một yếu tố xếp hạng trong tương lai

Có nhất thiết phải sử dụng AMP không ?

Câu trả lời ở đây là: TÙY THUỘC VÀO BẠN!

Trước khi đưa ra câu trả lời có sử dụng AMP hay không ?

Hãy nhìn qua những ưu nhược điểm của việc sử dụng AMP.

Ưu điểm AMP

#1 Tăng tốc độ tải trang web

Điều này bạn có thể thấy ngay bằng mắt thường. Không có yếu tố thừa thãi nào trong AMP.

Phiên bản AMP rất gọn gàng, nhẹ nhàng và nhanh chóng.

Không một người dùng nào muốn phải chờ đợi.

Về cơ bản AMP sẽ giúp bạn có nhiều lượt truy cập hơn.

#2 Tăng thứ hạng trên Mobile

Mặc dù AMP không phải một trong yếu tố xếp hạng, nhưng nó lại có ảnh hưởng tích cực đến tốc độ tải trang trên thiết bị di động.

Và Google hiện đã ưu tiên hơn trên các thiết bị di động.

Cũng có khả năng GG sẽ quan tâm hơn đến AMP, và nó sẽ có tác dụng với kết quả tìm kiếm.

#3 Nâng cao hiệu suất server

Nếu bạn có rất rất nhiều lượt truy cập từ thiết bị di động.

AMP sẽ giảm tải và cải thiện hiệu suất của chúng (vì những bản cache này được lưu trên server GG).

Nhưng sẽ bạn sẽ bị một số nhược điểm ở đây ( đọc nhược điểm thứ 3)

Nhược điểm AMP

#1 Doanh thu từ quảng cáo bị giảm

Mặc dù AMP có hỗ trợ ads (hiển thị quảng cáo). Nhưng số tiền bạn kiếm được từ ads, sẽ bị ảnh hưởng nghiêm trọng.

Và nó giới hạn chỉ hỗ trợ vài nền tảng quảng cáo.

#2 Analytic sẽ gặp khó khăn hơn

AMP có hỗ trợ Google Analytics, nhưng sẽ phải dùng một tag khác.

Nó sẽ phải được triển khai trên tất cả các trang có AMP.

Sẽ mất nhiều thời gian cho việc này đó,

#3 Tốc độ tuyệt vời này đạt được là nhờ bộ nhớ đệm

Sự thật mà nói, thì GG không sử dụng bất kỳ công nghệ đặc biệt nào để web bạn load nhanh hơn,

Những gì Google làm là, lưu lại các trang AMP trong bộ nhớ đệm.

Khi có người truy cập những trang đó.

Đơn giản nó show những gì đã được lưu lại.

AMP cho phép bạn tải nhanh hơn trên các thiết bị di động, UX tốt hơn.

Nhưng bạn sẽ phải hy sinh nhiều hiệu ứng, với một giao diện rất tối giản trên mobile.

Đôi khi nó làm website bạn trở nên đơn giản và kém hấp dẫn.

Nhưng có vài câu hỏi cần đặt ra trước khi bạn quyết định cài nó.

  • Bạn có đặt quảng cáo trên site không? Nếu có sẵn sàng giảm doanh thu vì AMP?
  • Nhớ là việc cài đặt GG Analytics trên AMP rất mất thời gian.
  • Giao diện sẽ bị lược bỏ đi một số phần.
  • Và cuối cùng là: Bạn có muốn phụ thuộc vào bộ nhớ đệm của GG

Cài đặt Google AMP trên WordPress

Bạn có thể cài đặt plugin miễn phí: AMP plugin.

Hoặc sử dụng plugin trả phí: WP AMP (Hiện đây là plugin AMP tốt nhất và bán chạy nhất nhé !)

WP AMP – Accelerated Mobile Pages for WordPress and WooCommerce

Mua WP AMP – Accelerated Mobile Pages for WordPress and WooCommerce

Tất nhiên là với WP AMP bạn sẽ có nhiều lựa chọn hơn với bản miễn phí. Và nó có hỗ trợ cả WooCommerce

Hãy tham khảo hướng dẫn từng bước của chúng tôi về cách cài đặt một WordPress plugin.

Xem video dưới để xem cách cài đặt AMP plugin free:

Cài đặt Google AMP với WP AMP

Mình giới thiệu một plugin AMP khác đó là WP AMP mình đang dùng.

Plugin này thì có khác biệt gì mới AMP Free kia.

Khác biệt là nó có rất nhiều tính năng xịn, để bạn có thể tùy biến trang AMP của mình đấy.

Đầu tiên các bạn cứ cài đặt plugin như bình thường, khi cài đặt thành công vào: Setting » WP AMP

Ở đây sẽ bảng điều khiển chính của plugin này:

wp amp settings

Ở tab General này bạn sẽ thấy:

  • Redirect Mobile Users – chuyển toàn bộ truy cập từ mobile sang phiên bản AMP
  • AMP Content Max-Width – độ rộng tối đa trên AMP
  • AMP Element Default Height – chiều cao mặc định cho các element
  • Post Types – coại post sẽ được hiển thị AMP
  • Archives – chọn các loại Archives
  • Compatibility Mode
  • Hide Forms – Ẩn form
  • Hide Contact Forms – Ẩn contact form
  • Enable RTL

Tiếp theo là tab Analytics, sẽ phép bạn cài những tag của GG Analytics, hay GG Tag Manager trên trang có AMP

wp amp analytics tab

Không lo mất dữ liệu từ nguồn truy cập từ AMP nhé.

Appreance

Tap này thì cho phép bạn thay đổi của rất nhiều phần trên trang như:

Page background, header background, text….

Appearance wp amp

Template

Tab này thì cho phép bạn, thay đổi bố cục của trang AMP theo ý bạn

template wp amp

Hỗ trợ nhiều post type nhé: Post, Page, Search, Blog Page, Archives, 404 Page

Ở dưới là các module bạn có thể tích vào để hiện hoặc bỏ tích để ẩn chúng.

Giữ và kéo thả các module này lên xuống theo ý bạn.

Tính năng này khá hay cho phép bạn sắp xếp trang AMP.

(Vì mặc định trang AMP trong khá xấu)

Schema.org

Cái này sẽ cài đặt logo trên các trang AMP kể cả AMP Storie ( chỉ được ở định dạng jpg, png, gif thôi nhé)

schema wp amp

Troubleshooting

Đây trang có 1 loạt câu hỏi lỗi thường gặp khi sử dụng WP AMP

troubleshooting wp amp

Nếu bạn đang gặp lỗi nào hãy ghé qua đây để tìm hiểu thêm nhé.

Có hướng dẫn rõ ràng cho từng trường hợp đấy.

System Status

Tab này sẽ hiển thị một số thông số của hệ thống như: Server Info, PHP version, WP version…

Ads

Tab này chính là cứu cánh cho mấy bạn có đặt Ads, nhưng dùng AMP

Mặc định AMP sẽ không hiển thị Ads

Nhưng WP AMP có hỗ trợ những Ads Network sau:

Ads wp amp

Adsense, Doubleclick, và Other.

Bạn sẽ tùy chỉnh được layout, kích cỡ.

WooCommerce

Lại thêm 1 tính năng tuyệt vời nữa là hỗ trợ AMP cho WooCommerce

WooCommerce wp amp

Trong tab sẽ cho bạn chỉnh layout các trang như: Product Page, Shop Page, Product Archives, Cart, Add to Cart

Đầy đủ tính năng hiển thị cho một trang bán hàng nha.

Như show ảnh sản phẩm, button, title, sku, rating, add to cart block…

Trên là toàn bộ các tính năng của WP AMP – Accelerated Mobile Pages for WordPress and WooCommerce.

Không chỉ nhiều tính năng, mà nó còn hỗ trợ rất nhiều thứ trên AMP mặc định không có.

Kiểm tra xem Google AMP đã hoạt động chưa

Sau khi bạn cài đặt AMP hãy truy cập vào Google AMP Test Tool của GG để kiểm tra

Chỉ cần điền url vào và bấm Test URL

AMP Test Tool

*Lưu ý: Nhớ ghi đúng URL của trang AMP, thường URL sẽ có thêm đuôi /amp

Sau đó nó trả lại kết quả như này là thành công.

Kết quả kiểm tra AMP Test

Ở dưới nó sẽ gợi ý thêm các dự liệu cấu trúc bạn còn thiếu.

Bấm vào để xem cái nào thiếu thì bổ sung nhé.

(ở đây mình có thiếu dữ liệu về logo image).

Kết

Tóm lại thì Google AMP không thực sự tăng tốc website bạn.

Nó lưu một phiên bản rút gọn của website trên bộ nhớ đệm sau đó hiển thị cho người dùng.

Nhưng nó vẫn còn khá nhiều hạn chế trên một số website (ví dụ bán hàng).

Vì các website này đôi khi cần hiển thị khá nhiều các thông tin cho khách hàng.

Việc sử dụng GG AMP hay không sẽ tùy thuộc vào mục đích hãy cân nhắc nhé.

Chia sẻ lên:
Đăng ký
Thông báo về
guest
77 Bình Luận
Inline Feedbacks
View all comments

Vu Hai
05/07/2017 2:52 chiều

Tuyệt vời em đã cài thành công cho web:https://conquayspinner.com bác nào check thử xem đúng chưa giúp em với ạ, em tay ngang nhưng được cái cũng chịu mò 🙂

Diều Hâu
Quản trị viên
Trả lời  Vu Hai
05/07/2017 3:32 chiều

Hình như chưa được bác ơi. Mà web load lâu quá.

Zen
Zen
18/10/2017 3:53 chiều

MÌnh lại không thích dùng. Trước có bật, nhưng sau đó tắt đi vì nhiều lý do. Tiện thể, rảnh các bạn ủng hộ ghé qua thăm web mình nha: http://mtv.vn

Diều Hâu
Quản trị viên
Trả lời  Zen
18/10/2017 4:18 chiều

Cảm ơn bạn, mình cũng vừa xem qua website bạn rồi

Tuấn
Tuấn
Trả lời  Zen
07/02/2020 6:03 chiều

web gì mà còn chưa cài ssl nữa.

Diều Hâu
Quản trị viên
Trả lời  Tuấn
11/02/2020 11:20 chiều

Bạn có nhìn nhầm ko 😀

Tuấn
Tuấn
Trả lời  Diều Hâu
12/02/2020 9:03 sáng

đang nói trang mtv chấm vn của ông kia cơ mà

Diều Hâu
Quản trị viên
Trả lời  Tuấn
12/02/2020 10:43 sáng

Cũng nhiều người mới họ không để ý đến ssl đâu.

Duong Mai
11/11/2017 4:41 chiều

Chào bạn. Mình kích hoạt amp cho toàn bộ bài viết nhưng chỉ một số là nó hiển thị đầy đủ, còn lại một số thì chỉ hiện tiêu đề và các nội dung còn lại chứ ko hề hiển thị nội dung bài viết. Bạn đã gặp lỗi đó bao giờ chưa, nếu có thì help mình vs. Đây là site của mình https://banghieudanang.net

Diều Hâu
Quản trị viên
Trả lời  Duong Mai
12/11/2017 2:33 chiều

Bạn lấy link của những trang và không hiển thị lỗi với AMP, sau đó cho link bên dưới để kiểm tra xem lỗi ở đâu nhé 🙂 Mình nghĩ nó không tương thích ở một số theme 🙂 https://search.google.com/test/amp

Kenny
12/11/2017 3:44 chiều

Bạn đánh giá giúp mình xem web đã chuẩn chưa với http://cordstrapvn.com

Diều Hâu
Quản trị viên
Trả lời  Kenny
13/11/2017 8:56 sáng

Mình thấy web bạn load cũng khá nhanh, mỗi tội chắc bạn sẽ còn phải chỉnh sửa lại nhiều cho đẹp hơn 😀

Hieu
16/04/2018 4:16 chiều

https://meganet.com.vn/ mình đã làm theo bước hướng dẫn và check lại lỗi 404 .AMP is not available for the page currently being previewed. Navigate to an AMP compatible page có phải web mình ko tương thích với AMP

Diều Hâu
Quản trị viên
Trả lời  Hieu
16/04/2018 4:22 chiều

Có thể theme của bạn đang dùng không tương thích với AMP rồi bạn

Thành Nam
Thành Nam
03/07/2018 9:13 chiều

Bạn ơi chèn alatics như vào amp như thế nào nhỉ.

Diều Hâu
Quản trị viên
Trả lời  Thành Nam
03/07/2018 9:36 chiều
Mẹ và Bé
09/07/2018 11:34 sáng

Mình đã setup thành công cho blog mẹ và bé https://mommybaby.net, nhưng ngặt nỗi không biết làm cách nào để chèn khung comment của Facebook vào bài viết trong trang AMP cả. Bạn nào biết chỉ giáo với!

duylink
23/07/2018 1:59 sáng

Cám ơn Ad thông tin rất hữu ích mình đã cài đặt thành công cho website của mình: https://hopnhua.vn/ mong ad ra nhiều bài viết để cộng đồng SEO được học hỏi

Diều Hâu
Quản trị viên
Trả lời  duylink
23/07/2018 6:59 sáng

Cảm ơn bạn đã theo dõi Diều Hâu. Mình sẽ cố ra thêm bài về SEO trong thời gian sắp tới, bạn nhớ đăng ký theo dõi Diều Hâu nhé !

Kim
Kim
01/08/2018 12:55 chiều

Mình trước đây có cài amp cho blog, nhưng sau đó m đổi qua theme nhẹ nên đã gỡ đi. Vậy nhưng khi vào blog trên điện thoại thì nhiều trang vẫn hiển thị dưới dạng amp, trong đó có index và 1 số post (không phải post nào cũng bị). Và index thì hiển thị amp nhưng responsive, còn post thì lại không tự điều chỉnh cho vừa màn hình. M đã thử xóa cache, xóa cả plugin tạo cache rồi cài lại mà vẫn không được. Bạn có thể kiểm tra giùm mình được không? blog của mình… Đọc thêm »

Diều Hâu
Quản trị viên
Trả lời  Kim
06/08/2018 9:08 chiều

Việc hiển thị AMP là do Google bạn nhé, nên sau khi bạn chuyển đổi phải đợi 1 thời gian, Google sẽ cập nhật lại. Bạn tham khảo bài viết dưới đây nha: https://developers.google.com/search/docs/guides/remove-amp

Lê
18/08/2018 6:30 chiều

web này của mình https://www.nobipet.vn có cần cài AMP ko bạn ơi?

Diều Hâu
Quản trị viên
Trả lời 
20/08/2018 10:12 chiều

Có càng tốt nhé bạn.

Beo Beo
16/10/2018 5:10 chiều

Bài viết hướng dẫn vô cùng chi tiết, mình đã cài thành công AMP cho website Trà Thảo Mộc Giảm Cân

tạp chí cuộc sống
30/10/2018 12:38 sáng

Mình đã cài thành công nhưng mà không biết thêm menu cho nó thế nào admin? với lại sửa phần cuối trang nữa

Bá Sỹ Phạm
06/11/2018 11:32 chiều

Mình cài xong, test thì thấy nó đơn giản hóa bài viết 1 cách tối đa, css gần như mất hết. Menu, logo, bài viết liên quan, float element, footer ẩn sạch. Trong khi menu là thứ rất quan trọng để điều hướng. Cuối cùng lại phải tắt plugin này đi!

Diều Hâu
Quản trị viên
Trả lời  Bá Sỹ Phạm
07/11/2018 9:48 chiều

Thứ quan trọng nó mang lại nhất là NHANH, GỌN, TẬP TRUNG TRẢI NGHIỆM NGƯỜI DÙNG, chứ không phải để điều hướng 😀

Nguyễn Quyết
24/12/2018 12:25 sáng

Cho mình hỏi website có bán AMP Pro của theme Flatsome không ạ
Website mình https://www.comautaman.vn

Diều Hâu
Quản trị viên
Trả lời  Nguyễn Quyết
24/12/2018 8:46 sáng

Flatsome không có AMP sẵn nhé bạn. còn plugin AMP thì có.

Tư vấn luật
03/04/2019 11:29 sáng

Em đã cài cho web site https://luathungson.vn/ không biết đã được chưa ạ

Diều Hâu
Quản trị viên
Trả lời  Tư vấn luật
03/04/2019 1:59 chiều

bạn thêm đuối /amp ở đuôi URL nhé. Để xem hoặc vào đây: https://search.google.com/test/amp để kiểm tra nhé

Nguyễn Đình An
03/04/2019 1:13 chiều

Trang của mình https://lycocthuytinh.com cũng cài plugin Accelerated Mobile Pages cũng có AMP rồi nhưng lại thấy wmt báo lỗi site https://lycocthuytinh.com/coc-thuy-tinh/coc-thuy-tinh-lun “URL AMP được tham chiếu không phải là AMP” Có bạn nào biết cách khắc phục không ạ?

Thái Văn Dạng
19/04/2019 10:39 sáng

hi a.
e cũng cài amp vào blog, nhưng thấy nó bị lỗi hiển thị không đầy đủ nội dung,
đồng thời nó báo “URL AMP được tham chiếu không phải là AMP”.
có cách nào khắc phục không a?
e cảm ơn a.

Diều Hâu
Quản trị viên
Trả lời  Thái Văn Dạng
19/04/2019 10:54 sáng

Cài mà chưa được thì có thể theme hiện tại bạn không hỗ trợ hoặc tương thích rồi.

Hieu
23/05/2019 2:39 chiều

Bạn đánh giá giúp mình xem web đã chuẩn chưa với, https://beehousemientrung.vn/ . Thiết lập theo bài 🙂

Diều Hâu
Quản trị viên
Trả lời  Hieu
23/05/2019 2:56 chiều

Thành công rồi đó bạn 😀

Hiệp
24/05/2019 7:40 chiều

Bác xem giúp e website này với, e làm theo các bước mà điểm số trên di động chỉ loanh quanh 20-20 thôi ạ

Diều Hâu
Quản trị viên
Trả lời  Hiệp
24/05/2019 9:26 chiều

Bạn nên kiểm tra lại xem trang bạn check là amp hay ko. Trang đã có AMP sẽ có url:…. /amp

Quan Phan
Quan Phan
07/06/2019 10:40 sáng

Hey bro, plugin WP AMP cần có key để kích hoạt full chức năng post type product phải không nhỉ? mình có mua plugin WP AMP tại thedevkit khi cài xong chọn post type thì không thấy product chỉ có post, page. 🙁

Diều Hâu
Quản trị viên
Trả lời  Quan Phan
07/06/2019 10:42 sáng

Không cần nhé bạn. Dùng đầy đủ chức năng, vào update lên bản mới nhất xem. Cần gì cứ lên page chat trực tiếp mình support nhé