Google AMP là gì? Hướng dẫn cài đặt AMP html cho website WordPress
5 (11) votes

Xin chào! Hôm nay chúng ta sẽ tìm hiểu và cài đặt AMP cho website WordPress nhé. Có bạn nào đến bây giờ vẫn chưa hiểu Google AMP là gì? Thiết nghĩ bạn nào làm SEO chắc đều biết cả rồi vì nó rất quan trọng với website trong thời buổi bây giờ phải không nào :).

Google AMP

» Google AMP là gì?

AMP là cụm ký hiệu viết tắt của (Accelerated Mobile Pages) dân SEO người ta hay gọi nôm na nó là “Trang tăng tốc thiết bị di động”, là thuật ngữ dùng để mô tả các trang web thân thiện với thiết bị di động, cho phép tải nhanh hơn so với máy tính. Google AMP là một cách để tạo trang web nhẹ và tải nhanh, đặc biệt trên thiết bị di động. Cốt lõi của AMP là một phiên bản HTML bình thường đã được cắt giảm tối đa các thành phần không cần thiết, cho phép trình duyệt hiển thị tối giản thông tin cần thiết tới người dùng (thường chỉ hiển thị text và ảnh). Ảnh dưới là 1 ví dụ về bài viết được hiển thị dưới dạng AMP:

Bài viết được hiển thị dưới dạng AMP

Làm SEO hay đơn giản các bạn làm quản trị hoặc chủ sở hữu của 1 cái website thì ai chả mong muốn nó load nhanh, tối ưu với người dùng và đặc biệt là hiển thị tốt và rõ ràng trên thiết bị di động. Sở dĩ vậy bởi nó ảnh hưởng rất lớn tới hiệu quả mua hàng của khách tiềm năng, có ai bây giờ không dùng smartphone đâu, họ làm mọi thứ trên mobile và nếu website bạn không hướng đến điều này tôi cam đoan bạn nên bỏ luôn cái website đi và tìm kênh khác mà kinh doanh. Vậy nếu ngược lại thì sao? Chắc chắn bạn sẽ phải biến cái website của bạn thành các trang AMP hoặc tối thiểu cũng phải có hỗ trợ Responsive.

Ở trên mình có nói đến “Responsive” đây là cụm từ nói đến một Web được thiết kế phù hợp hiển thị được trên tất cả các thiết bị, mọi độ phân giải màn hình. Một website đẹp trên máy tính nhưng khi xem trên điện thoại bố cục lộn xộn, hình ảnh, bài viết không cân đối thì không thể gọi là Web Responsive. Nó khác với Google AMP ở chỗ sẽ hiển thị đầy đủ mọi thứ như xem trên Desktop chứ thường không được lược bớt thành phần nào. Hiện nay hầu hết các đơn vị thiết kế website đều coi Responsive là chuẩn vì thế gần như các website hiện nay đều có chức năng này. Để kiểm tra đơn giản bạn cứ mở trang website đó lên sau đó thu hẹp hết cỡ chiều ngang của trình duyệt lại, nếu nội dung co lại theo mà vẫn hiển thị đủ thông tin và rõ ràng thì là có Responsive, ngược lại bị vỡ; cắt xén hoặc quá nhỏ không nhìn thấy gì thì là chưa hỗ trợ hoặc chưa đúng chuẩn Responsive nhé. Ảnh ví dụ trang web có hỗ trợ Responsive:

Web Responsive

» Cách nhận biết và kiểm tra một website có hỗ trợ Google AMP hay chưa?

Cũng không có gì khó khăn lắm, google đã có hướng dẫn chi tiết và công cụ cho bạn kiểm tra nhanh chóng đây rồi: Đầu tiên hãy mở link test Google AMP này https://search.google.com/test/amp?hl=vi

Cách nhận biết và kiểm tra một website có hỗ trợ Google AMP hay chưa?

Hãy dán đường dẫn một bài viết bất kỳ đã viết trước đó ít ngày và có dạng (domain/url-bai-viet/amp) / (một số web có dạng domain/url-bai-viet?amp) vào box rồi nhấn nút chức năng kiểm tra để xem kết quả. Nếu xanh như hình bên trên tức là trang đó đã có hỗ trợ Google AMP, ngược lại là chữ “Không hợp lệ” xám xịt đó nhé :p (Tức là chưa có hỗ trợ AMP). Nào giờ ta quay ra dùng điện thoại tìm thử bài viết đó thông qua từ khóa mà bạn nghĩ nó sẽ có thứ hạng xem nó thế nào.

Kết quả hiển thị trang amp trên google

Bạn sẽ thấy kết quả tìm kiếm một trang Google AMP trên công cụ google sẽ có một chút khác so với thông thường đó là biểu tượng tia chớp như trong hình bên trên. Nhấp vào kết quả này bạn sẽ được đưa vào trang bài viết chỉ trong chưa đầy cái nháy mắt đó nhé, không bị kích thích mới lạ. Những website không hỗ trợ AMP thì không bao giờ thấy kết quả như trên bạn nhé. Chú ý nữa là nhiều khi bạn search mà không thấy giống như hình mặc dù đã cài đặt AMP và check thấy ngon lành, từ khóa top có kết quả trên top nhưng kết quả chỉ là kết quả bình thường. Đừng lo đó là trang AMP của bạn chưa được lập chỉ mục thôi cứ chờ ít ngày sẽ thấy nha 🙂

» Hướng dẫn cài đặt AMP html cho website WordPress:

Các bạn có lẽ cũng biết cái ông WordPress có phần plugin (modul chức năng) rất mạnh và đa dạng. Mỗi chức năng thường sẽ có không dưới 1,2 lựa chọn cài đặt cho bạn và Google AMP cũng không ngoại lệ. Nói thế để các bạn biết sẽ có nhiều plugin cùng hỗ trợ chức năng tạo trang AMP cho website wordpress của bạn tuy nhiên tùy bạn chọn cái nào hợp lý thôi, còn ở bài này mình sẽ hướng dẫn qua 2 plugin free nhiều người dùng nhất và có lẽ là tốt nhất cho đến hiện tại thôi nhé. 2 em này có tên: AMP for WordPress và AMP for WP – Accelerated Mobile Pages

Về căn bản 2 plugin trên cùng giúp tạo trang AMP cho wordpress và chỉ khác nhau ở chỗ: “AMP for WordPress” mới hỗ trợ cho tạo trang AMP với bài viết và trang bài viết còn “AMP for WP – Accelerated Mobile Pages” hỗ trợ mạnh hơn tạo được cho cả trang chủ và chuyên mục. Tùy vào nhu cầu của các bạn mà lựa chọn sử dụng cho hợp lý thôi, ví dụ ai muốn tạo AMP cho trang chủ thì phải dùng “AMP for WP – Accelerated Mobile Pages” nhưng thường trang chủ lại là nơi quan trọng nếu lược quá nhiều thì không đẹp lắm nên ít ai tạo AMP cho trang chủ, tất nhiên bạn có thể cài đặt tắt chức năng này. Còn với Hải Vũ mà cụ thể là website của mình đây thì lại dùng “AMP for WordPress” vì mình chỉ cần tạo cho trang và bài viết mà thôi. Tuy nhiên có một điều chú ý là plugin “AMP for WordPress” rất tương thích với “yoast seo” vì thế ai cài yoast seo trước đó thì nên dùng “AMP for WordPress” vì được nhà phát triển khuyến khích dùng bởi tính tương thích và sự hiệu quả. Mình sẽ ví dụ cài đặt “AMP for WordPress” luôn cho nóng nhé:

Chắc chắn khâu đầu tiên chúng ta sẽ tìm kiếm và cài đặt plugin này vào website phải không nhỉ? Để đỡ dài dòng, bạn nào biết rồi thì thôi, chưa biết có thể tha khảo bài viết sau cho tiện nhé “Hướng dẫn cài đặt plugin“.

Hãy cài 2 plugin: “AMP for WordPress” và một plugin phụ tích hợp vào “Yoast Seo” có tên là “Glue for Yoast SEO & AMP

Cài đặt plugin AMP cho WordPress

Nếu cài đủ 2 plugin như mình nói bạn sẽ thấy xuất hiện 3 vị trí vàng giống hình trong trang quản trị WordPress của bạn. Nào ta đi cài đặt nhé, đầu tiên nhấp vào điểm vàng 1 bạn sẽ thấy hình sau hãy làm giống hình và lưu lại. Như đã nói plugin này mới chỉ hỗ trợ cho bài viết và trang.

Cài đặt plugin AMP

Bây giờ ta nhấp vào điểm vàng 2, tức là cái mục AMP tích hợp trong “Yoast SEO”. Ở đây ta cài như hướng dẫn trong hình dưới để cài đặt cho 2 mục ‘Post types‘ và ‘Design‘ mục ‘Analytics’ để chèn mã theo dõi riêng nhưng hình như đang lỗi vì mình add vào nó không cập nhật, theo mình cũng chẳng cần làm gì 😛

Thiết lập cấu hình cho AMP

Cuối cùng bạn hãy vào điểm vàng 3, tức là cái ‘mục AMP’ trong Menu ‘Giao diện‘ để ta cấu hình giao diện cho trang AMp. Chỗ này kể cũng không cho phép sửa lắm, cụ thể ở đây bạn có thể chọn màu cho tiêu đề, nền sáng hay tối, màu chữ. Còn muốn tinh chỉnh hơn nữa chắc là bạn vào hẳn file code trong mục plucin AMP trên hosting để sửa (Chỉ dành cho ai hiểu biết về code) nhưng có lẽ chả cần thiết vì làm đủ mấy bước trên bạn đã có trang AMP ngon lành và tối ưu chức năng rồi. Không nhất thiết phải cầu toàn.

Cấu hình giao diện tùy chọn cho trang AMP

Ôi trời, sao mà bài nó lại dài thế này, tóm lại là xong rồi đó các bạn. Hãy đăng nhập vào Google Search Console Dashboard để kích hoạt chức năng trang AMP lên để hoàn tất nhé.

đăng nhập vào Google Search Console Dashboard để kích hoạt chức năng trang AMP

Yên tâm ban đầu sẽ cần ít ngày để WMT cập nhật nên bạn sẽ chưa thấy kết quả đâu. Còn sau đó nếu ok bạn bắt đầu thấy kết quả và cụ thể là các thông số giống của mình. Chúc may mắn và thành công!