Hướng dẫn cài đặt Google AMP cho blog WordPress miễn phí chi tiết từ A-Z

Google AMP là cách đơn giản nhất để bài viết của bạn ngay lập tức có tốc độ tải trang dưới một giây trên THIẾT BỊ DI ĐỘNG kể cả khi dùng hosting giá rẻ.

Rất rất nhiều blog đang phải chật vật với tối ưu tốc độ tải trang để ghi điểm với Google và tăng trải nghiệm người dùng mà quên mất AMP, một dạng server cache trên máy chủ Google giúp mọi trang web luôn load dưới 1 giây từ trang kết quả tìm kiếm của Google. Tương tự như Facebook Article Instant.

Google AMP không dễ để cài đặt bởi vì nó dùng cấu trúc riêng đặc biệt và đòi hỏi các loại script hạn chế cũng như giới hạn kích thước của CSS. Tương tự như cấu trúc Schema, AMP luôn khắt khe trong việc xác thực. Bất cứ xảy ra lỗi xác thực nào thì xem như Google sẽ từ chối cache trang đó.

Trong bài viết này, tôi sẽ hướng dẫn bạn cách đơn giản để tạo một blog chuẩn AMP không chỉ miễn phí mà còn có thể:

  1. Tăng doanh thu từ Google Adsense
  2. Tăng thứ hạng SEO
  3. Thiết kế đẹp

Cách Google AMP hoạt động và lợi ích của AMP

“AMP rất tệ cho website của bạn đặc biệt là lead”
“AMP làm giảm thu nhập từ Google AdSense”
“AMP gây khó cho thiết kế website”

Đây là những ý kiến trái chiều về AMP, nó đúng và không đúng trong nhiều trường hợp. Tôi chỉ có thể nói, riêng với blog thì nó sẽ sai, AMP hoàn toàn có thể giúp bạn tăng doanh thu, SEO và vẫn có thể giữ được thiết kế đẹp mong muốn. Đương nhiên với điều kiện bạn thiết lập AMP đúng.

AMP hoạt động nói đơn giản đó chính là lưu cache blog của bạn trên máy chủ Google với một định dạng tối giản giới hạn về HTML, CSS và JavaScript giúp người tìm kiếm mở trang bài viết của bạn với tốc độ tên lửa.

AMP sẽ đảm bảo trải nghiệm siêu mượt khi xem trang vì tinh giản mọi thứ, hạn chế hao tài nguyên máy chủ của bạn nhờ cache trên server Google và quan trọng nhất là MIỄN DỊCH với AdBlocker.

Bạn có thể bất ngờ, trong khi AMP rút gọn mọi thứ nhưng lại ưu tiên hiển thị mọi quảng cáo AMP Ads không chỉ riêng Google Adsense mà còn nhiều mạng lưới quảng cáo khác. Đây là lý do mà tôi nói AMP làm tăng doanh thu quảng cáo cho bạn.

Tử huyệt của Google Adsense là dễ bị chặn quảng cáo bởi trình duyệt và làm chậm blog. Tuy nhiên, với AMP hai điểm yếu này sẽ bị loại bỏ trên di động. Tuyệt vời không nào!

Cài đặt Google AMP cho blog WordPress như thế nào

Plugin hàng đầu để tạo một blog AMP là plugin trả phí AMPforWP, có thể nói là trùm cuối của AMP plugin vì có thể khai thác được toàn bộ tính năng của Google AMP.

Với nhu cầu cơ bản bạn sẽ không cần tới plugin đó, bạn có thể tạo một blog AMP miễn phí nhờ vào plugin miễn phí chính thức của WordPress là AMP plugin.

Cách làm như sau:

Cài đặt theme hỗ trợ AMP native (tuỳ chọn)

Theme hỗ trợ AMP thường khá mắc so với các theme không hỗ trợ.

May mắn là chúng ta có theme Astra miễn phí hỗ trợ đầy đủ AMP.

Tuy nhiên, với những bạn đang có blog sẵn và đổi sang theme Astra cũng không phải là một ý kiến hay. Cách tối ưu nhất là dùng giao diện AMP Reader. Nó sẽ tạo một theme AMP hoàn toàn khác theme bạn đang dùng để tránh lỗi và RẤT HOÀN HẢO để dùng.

Tóm lại bạn có 2 lựa chọn và nếu bạn chọn cái nào cũng ổn cả

  1. Dùng theme Astra miễn phí. Tùy biến theme AMP sẽ tốt hơn nghĩa là điều hướng và thiết kế dễ hơn nhiều.
  2. Dùng giao diện AMP reader. Sẽ không gây ảnh hưởng tới theme hiện tại của bạn và nó rất dễ áp dụng.

Hướng dẫn này tôi sẽ thiên về AMP Reader hơn bởi vì ai cũng có thể làm được bất kể là đang dùng theme gì.

Cài đặt và cấu hình AMP plugin

AMP plugin được tạo bởi Automattic và miễn phí hoàn toàn, được cập nhật lên bản 2.0 gần đây với cách tân về chức năng. Ổn định hơn và làm việc hiệu quả hơn.

Bạn chỉ đơn giản download plugin AMP về trong WordPress Repo và kích hoạt.

Sau khi cài đặt xong, bạn cấu hình như sau:

Giải thích thêm là AMP plugin có 3 chế độ tất cả:

  1. Transitional Mode. Bạn chỉ lựa chọn khi bạn dùng theme hỗ trợ tùy chỉnh AMP như Astra.
  2. Standard Mode. Đây là chế độ đơn giản hơn khi tạo ra 2 URL khác nhau của cùng một trang. Tôi không thích chế độ này.
  3. Reader Mode. Dùng một theme AMP template khác tách biệt hoàn toàn theme đang dùng và chỉ dùng cùng một URL cho cả trang AMP và không AMP. Đây là chế độ tôi khuyên dùng.
Ba Che Do Amp Plugin
3 chế độ AMP
Lua Chon Amp Reader Theme
Một số theme AMP reader để bạn chọn lựa
2 Theme Cung Kich Hoat Trong Giao Dien Theme
Bạn có 2 theme cùng kích hoạt (trái là theme chính, phải là theme AMP)

Trong chế độ Reader Mode, bạn vẫn có thể thêm CSS vào AMP bằng cách chọn tùy chỉnh theme trong Additional CSS của theme bạn chọn như bình thường.

Cài đặt AMP Google Analytics

Google bạn dùng các plugin khác chèn trên blog sẽ không được chèn vào AMP bởi vì Google AMP dùng một mã track khác riêng biệt với blog bạn đang dùng.

Mã track của AMP có dạng như sau:

<amp-analytics type="googleanalytics">
  <script type="application/json">
  {
    "vars": {
      "account": "UA-XXXXX-Y"
    },
    "triggers": {
      "trackPageview": {
        "on": "visible",
        "request": "pageview"
      }
    }
  }
  </script>
</amp-analytics>
<script async custom-element="amp-analytics"    src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>

Tiện lợi ở chỗ là AMP plugin có sẵn chức năng chèn mã Google Analytics đơn giản chỉ bằng cách dán googleanalytics vào ô Vendor type.

Thêm Google Analytics

Tương tự với Facebook Pixel là facebookpixel hoặc gtag cho Google Tag Manager.

Cài đặt AMP Google Adsense

AMP Ads

Bạn có thể dùng plugin Ads Insert Plugin miễn phí, plugin này liên kết tự với tài khoản Google Adsense của bạn và có lựa chèn quảng cáo vào cả AMP post.

Cach Chen Google Adsense Amp
Dán 1 vào <head> tag và 2 vào <body> tag bằng Ads Insert Plugin
Chen Quang Cao Vao Amp
Ads Insert Plugin

Cài đặt AMP Schema Structure

SEOPress và Rankmath tương thích 100% với AMP nên khi bạn tạo schema cho blog thì bạn cũng tạo luôn cho AMP.

Nếu bạn dùng YoastSEO thì phải cài thêm plugin Schema có hỗ trợ AMP.

Kiểm tra AMP có hoạt động ổn hay chưa

Bạn có thể test nhanh AMP bằng công cụ Google AMP Test bằng cách dán đường link https://domaincuaban.com/bai-viet-thu/?amp vào để thử (Lưu ý có ?amp phía sau khi dùng AMP Reader Mode). Bạn sẽ kiểm tra cấu trúc Schema tại Google Schema Test.

Nếu bạn muốn xem giao diện AMP của bài viết mình trông như thế nào thì thêm ?amp vào cuối URL của bất cứ trang nào của bạn (áp dụng với AMP readmode), bạn sẽ thấy giao diện của bài viết đó ở dạng AMP.

Trong bảng điều khiển Google Search Console bạn cũng có thể dùng tính năng “Inspect Any URL” hay còn gọi là fetch as Google để kiểm tra có báo lỗi gì không.

Ngoài ra ngay trong WordPress Admin, bạn cũng thấy được Plugin AMP sẽ tự động báo lỗi cho bạn. Nếu plugin báo lỗi thì chắc chắn là lỗi, bạn phải sửa bằng cách xem pluin nào đang tạo markup lỗi và tắt nó khi chạy chế độ AMP.

Amp Bao Loi
AMP plugin báo lỗi tại thẻ Validated URLs
Amp Plugin Suppression
Cách sửa lỗi: Bạn chỉ cần “Suppressed” (tắt đi) plugin nào tạo lỗi

Tóm lại, tuyệt đối không được báo LỖI ĐỎ, nếu không AMP sẽ không được Google cache. Xem như vô dụng.

Lời kết…

Để không nhầm lẫn, xin nhắc lại một lần với bạn là AMP không giúp bạn tăng tốc blog trực tiếp khi cài đặt, mà là tăng siêu tốc tốc độ mở trang bài viết ở trang tìm kiếm kết quả cùa Google (SERP), là yếu tố ảnh hưởng tích cực đến SEO.

Google đã dành gần 5 năm liên tục phát triển AMP kể từ khi ra mắt vào tháng 10 năm 2015. Không phải tự nhiên mà Google bỏ nhiều tâm huyết cho công nghệ này.

Blogspot và Ghost CMS áp dụng AMP cực chuẩn cho SEO nên bạn cũng nên học hỏi hai nền tảng chuyên blog này.

Trong quá trình thực hiện nếu có khó khăn gì hãy để lại bình luận bên dưới để cùng thảo luận nhé

Bài viết liên quan

Để lại một bình luận

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *