Plugin cài đặt AMP (Accelerated Mobile Pages) cho wordpress

Bài viết nằm thứ 2 trong 2 phần của series Cách onpage giúp tăng traffic cho website

Mình cũng không định viết bài hướng dẫn cụ thể cho việc cài đặt AMP. Có quá nhiều thứ cần giải thích nhưng người đọc thì không nhiều. Nếu có lỗi AMP thì sẽ nhiều người chú ý hơn. Nhưng mà có người quen muốn cài đặt AMP for wordpress nhưng trước đó gặp quá nhiều lỗi (thông báo từ Google Search Console) nên nhờ mình hướng dẫn. Thế nên bài viết này sẽ bàn về cách cài đặt và sử dụng plugin AMP đang dùng trên EvergreenAMP for WP – Accelerated Mobile Pages. How to Setup Google AMP in WordPress? (Chỉnh sửa 28/09/2019)

Bạn có thể muốn tìm hiểu: Sửa lỗi AMP

I. AMP

Trước kia, khi mới xuất hiện AMP, tất cả website wordpress muốn cài đặt đều cần phải cài môi trường do chính WordPress tạo ra. Đó là plugin AMP for WordPress. Lúc đó mình phải cài 2 plugin lận: AMP for WP – Accelerated Mobile Pages và AMP for WordPress. Đây là lý do chính khiến nó được nhiều người cài đặt nhất trên store (>200k+) chứ không phải do nó là thằng tốt nhất đâu. AMP for WordPress ổn nhưng không chất. Giao diện chưa tối ưu nhưng được cái dễ cài đặt và sử dụng. Đó là lý do ta cần đến Plugin được sử dụng nhiều thứ 2: AMP for WP – Accelerated Mobile Pages.

II. Plugin AMP for WP – Accelerated Mobile Pages

#1 AMP Plugin: AMP for WP – Accelerated Mobile Pages

1. Giới thiệu

Không phải tự nhiên AMP for WP – Accelerated Mobile Pages được nhiều người tự cài đặt nhất trên WordPress (>652 reviews). Nó có những điều mà người sử dụng cần.

Ưu điểm

  • Giao diện thân thiện: Hình ảnh ok, chữ viết đẹp, dễ nhìn
  • Load nhanh
  • Có thể tối ưu SEO onpage tốt: Link nội bộ, nút chia sẻ MXH Facebook, Google+, Twitter,…
  • Khá nhiều tùy chỉnh: Menu, Ads,…

Nhược điểm

  • Nếu muốn giao diện đẹp 1 chút cần customize kha khá
  • Cài đặt phức tạp: Nhiều chức năng nên khá khó để tối ưu tốt cho người mới sử dụng
  • Bản free còn thiếu 1 vài chức năng nhưng cơ bản là ok

2. Hướng dẫn cài đặt

Hướng dẫn cách cài đặt Plugin AMP for WP – Accelerated Mobile Pages

Bước 1: Truy cập cửa hàng plugin

wp-admin / Plugins / Add new

Tiếng Việt: wp-admin / Gói mở rộng / Cài mới

Bước 2: Tìm kiếm và cài đặt

Ở góc trên bên phải (Thanh tìm kiếm), search keyword “amp” và chờ 1 chút.

Sau khi các Plugins hiện ra, chọn và Cài Đặt (Install Now) plugin AMP for WP – Accelerated Mobile Pages (By Ahmed Kaludi, Mohammed Kaludi)

Lưu ý: Bạn có thể truy cập ngay qua url: https://vi.wordpress.org/plugins/accelerated-mobile-pages/

3. Hướng dẫn sử dụng

Update: Version 0.9.98.13

Đây là phần quan trọng nhất của bài viết đây. Truy cập đường dẫn để thiết lập cài đặt cho Plugin:

wp-admin / AMP

Lưu ý: Những dấu “?” nhỏ, mờ mờ phía sau các nội dung chính là chú giải của chúng. Nhớ di chuột qua để đọc nếu bạn không hiểu nha!

3.1. SETTINGS

Setup AMP Features

3.1.1. General

Branding (Xây dựng thương hiệu)

  • Logo: Lấy logo của website cho vào thôi
  • Resize: Chỉnh lại cho phù hợp website
    • Resize Method: Chọn Flexible Width (Chiều rộng linh hoạt), bỏ qua Fixed Width (Chiều rộng cố định)
    • Resize Your Logo: Thay đổi theo %. Bạn nên dùng điện thoại để chỉnh cho chuẩn. Nhớ là mỗi lần thay đổi % ta lại bấm vào related posts để chuyển post khác (tại nó lưu cache css ko tự thay đổi).
  • AMP Support: Chọn những nơi mà bạn muốn dùng AMP thay Responsible
    • Posts: Tích. Chủ yếu cài đặt AMP vì nó mà
    • Pages: Tích. Như trên
    • HomePage: Không nên tích. Vì trang chủ là page được tối ưu tốt nhất trên website, là bộ mặt của trang web. AMP sẽ tối giản đối đa khiến nó hiển thị khá xấu xí. Tốt nhất giữ nguyên dạng responsible cho mobile.
    • Archives [Category & Tags]: Tích. Trước bị lỗi 404 khi xóa /category/ trong url wordpress, giờ có tùy chọn ở dưới rồi, tích thoải mái. Bạn nên chạy AMP trên Category và Tag vì chúng cũng chỉ hiện bài viết thôi nên không khác nhau mấy đâu.
    • Custom Post Types: Để mặc định là được.
    • Custom Taxonomies: Để mặc định là được.
    • AMP Takeover (Beta): Không tích. Tạo ra duy nhất 1 bản gốc (canonical) là AMP. Kể cả non-AMP và AMP đều có cùng 1 giao diện. Nguy hiểm lắm, bỏ qua đi.

Lưu ý: Bạn hoàn toàn có thể tắt AMP bất kỳ Post hay Page nào. Chỉ cần vào phần chỉnh sửa Post hay Page đó mà bỏ thôi.

Dành cho những ai xóa /category/ hoặc /tag/ base trong url wp

  • Để chạy AMP, ta chỉ cần tích vào Archives [Category & Tags]
  • Với những ai xóa category, tích vào Category base remove in AMP ở 3.1.15. Advance Settings
  • Với những ai xóa tag, tích vào Tag base remove in AMP ở 3.1.15. Advance Settings
  • Như vậy sẽ không bị lỗi 404 nữa. Tuy nhiên, trình duyệt lưu cache, bạn cần check ẩn danh hoặc xóa cache để xem sự thay đổi.
3.1.2. Advertisement

Tùy chọn kích thước và vị trí hiển thị quảng cáo (Google Adsense) trong bài viết, trang chủ, categories, tags,…

Bạn có thể chèn quảng cáo Google Adsense hoặc mạng qc khác ở những vị trí mong muốn:

  • AD #1 Below the Header (SiteWide) (Vị trí dưới Navigation hay Menu và trên Title hoặc bài viết): Cái này toàn website. Header bao gồm toàn bộ từ Menu lên phía trên của website
  • AD #2 Below the Footer (SiteWide) (Vị trí phía dưới comment và trên footer menu): Cái này toàn website.
  • AD #3 Above the Post Content (Vị trí phía dưới ảnh đại diện và trên nội dung bài viết): Cái này chỉ tồn tại ở post và page
    • Display on: Chọn Single và Page
  • AD #4 Below the Post Content (Single Post) (Vị trí phía dưới nội dung bài viết và trên modified date): Cái này chỉ tồn tại ở post và page
  • AD #5 Below The Title (Single Post) (Vị trí phía dưới Title và trên ảnh đại diện): Cái này chỉ tồn tại ở post và page
  • AD #6 Above the Related Posts (Single Post) (Vị trí phía dưới nút chia sẻ MXH và trên related posts): Cái này chỉ tồn tại ở post và page
  • Bạn nên sử dụng thêm mã auto chèn quảng cáo vào AMP để hiển thị bên trong bài viết nha.
Lưu ý
  • Theo độ tối ưu mình đã test thì hãy chọn: AD #2, AD #3, AD #4 (có thể chọn AD #6)
  • Nếu bạn dùng AMP cho HomePage và Category/Tag thì có thể chọn AD #1 bỏ AD #3 nhưng AD#5 thì không nên chọn
  • AD size: Để trống (hoặc Select an item).  Nếu bạn đã chọn 1 kích thước cố định, hãy bấm dấu x ngay bên phải kích thước đó. Để quảng cáo tự động thay đổi theo thiết bị di động sẽ hay hơn.
  • Data AD Client: ca-pub-xxxxxxxxxxxxxxxx
  • Data AD Slot: Lấy trong mã GA hoặc mã quảng cáo
  • Responsive Ad unit: Tích vào để ads được tự động điều chỉnh phù hợp trên điện thoại
Ad Performance
  • Optimize For Viewability (Tối ưu hóa hiển thị trên mobile): Tích ngay thôi
General
  • Sponsorship Label (Hiện dòng chữ phía dưới quảng cáo): Tốt nhất là không nên tích, mất doanh doanh thu đấy.
    • Sponsorship Label Text: Điền dòng chữ như Quảng cáo, (Nhà) tài trợ, Sponsored, Ads, Advertisement, Advertising,…

3.1.3. SEO

General:

  • Meta Description: Tích ngay và luôn. Chắc chắn phải có phần miêu tả nội dung rồi.
  • Head Section: Với ai không có thẻ meta thì bỏ qua. Chỗ này điền meta cho web. Còn code html, script,… (VD code qc GA for AMP toàn trang) chèn vào Head thì điền ở Advance Settings.

SEO Plugin Integration:

  • Select SEO Plugin: Mình dùng Yoast SEO thì chọn Yoast. Còn ai dùng All in One SEO Pack, Rank Math SEO, Genesis, SEOPress, Bridge Qode SEO, The SEO Framework, Squirrly SEO thì chọn nó thôi.
    • Meta Tags from Yoast: Tích
    • Yoast Description in ld+json: Tích
    • Canonical from Yoast: Tích hay không cũng được
    • Schema from Yoast: Tích
  • Advanced Indexing
    • URL Inspection Tool Compatibility: Tích ngay để tăng khả năng tương thích với công cụ Kiểm tra URL. (Click link để tìm hiểu về nó)
3.1.4. Page Builder

Cái này là customize AMP cho từng page 1. Khá lằng nhằng và chỉ nên dùng cho 1 vài trang quan trọng thôi. Truy cập phần chỉnh sửa ở từng Post/Page. Nó ở ngay phía dưới cùng.

Những loại Builder được hỗ trợ:

  • AMPforWP PageBuilder: Đang dùng
  • WPBakery Page Builder
  • Divi Builder
  • Elementor
  • Avada(Fusion builder)
  • Avia(Enfold)

P/S: Bạn nào cần hướng dẫn thì để lại comment phía dưới. Mình sẽ viết 1 bài hướng dẫn cụ thể.

3.1.5. PWA

Evergreen đang dùng PWA for WP của plugin này hỗ trợ, thấy khá ổn. Xem hướng dẫn chi tiết tại đây.

3.1.6. Performance

Performance Enhancement (Cải thiện hiệu suất)

  • Minify: Đương nhiên phải tích rồi. Tác dụng của nó giống như Autoptimize plugin. Giúp nén dữ liệu để tăng tốc độ load và tải trang (page speed and loading time)
  • Leverage Browser Caching: Tích thôi. Tác dụng lưu cache trình duyệt
  • Optimize CSS (beta): Mới beta nên ta cứ bỏ qua đã
3.1.7. Analytics

Mình chỉ dùng Google Analytics nên chỉ add mã GA thôi.

Primary Analytic Providers

  • Google Analytics
    • Tracking ID: Điển mã GA UA-xxxxxxxx-x
    • IP Anonymization (Ẩn IP): Tùy vào chính sách bảo mật từng quốc gia mà bạn có nên tích hay không. Nhưng ở VN thì không cần tích.
    • AMP Linker: Bấm ? bên cạnh để hiểu hơn
    • Advanced Google Analytics: Không tích nếu không dùng
  • Google Tag Manager: Không tích nếu không dùng

General Analytics Providers: Có rất nhiều nhà cung cấp công cụ phân tích khác ngoài GA cho bạn lựa chọn:

  • Facebook Pixel
  • Segment Analytics
  • Matomo (Piwik) Analytics
  • Quantcast Measurement
  • comScore
  • Effective Measure
  • StatCounter
  • Histats Analytics
  • Yandex Metrika
  • Chartbeat Analytics
  • Alexa Metrics
  • AFS Analytics
  • Clicky Analytics
3.1.8. Structured Data

Schema & Structured Data (Schema và dữ liệu có cấu trúc)

Bạn nên cài đặt Schema & Structured Data for WP của plugin này. Xem hướng dẫn chi tiết tại đây.

  • category: Chọn BlogPosting
3.1.9. Notice Bar & GDPR

Notice Bar (Cookie Consent): Thông báo hiện lên khi truy cập website

  • Notifications: Tích để hiển thị thông báo khi khách truy cập web
    • Notice Content (Nội dung thông báo)
    • Button Text: Chữ để bấm khi muốn tắt thông báo (Tắt, Đã hiểu, Đồng ý,…)
  • GDPR (General Data Protection Regulation)
    • GDPR Compliancy: Mình không phải ở Châu Âu nên bỏ qua luật của họ đi
3.1.10. Push Notifications

Push Notification Support (Thông báo đẩy) (Click url để xem hướng dẫn cài đặt)

  • OneSignal: Tích thôi
    • APP ID: Theo đường dẫn để lấy: wp-admin / OneSignal Push / Configuration / APP ID —> Copy và paste vào thôi.

Positioning (Vị trí hiển thị thông báo đẩy)

  • Below the Content (Phía dưới nội dung bài viết): Tích. Hiển thị ổn hơn cái dưới
  • Above the Content (Phía trên nội dung bài viết): Không tích

Translation (Phiên dịch)

  • Subscribe (Đăng ký): Đăng ký ngay!, Đăng ký!, Subscribe!, Theo dõi ngay!,…
  • Unsubsribe (Bỏ theo dõi): Bỏ đăng ký!, Bỏ theo dõi!, Ngừng theo dõi!, Ngừng đăng ký!, Không nhận thông báo!,…

Experimental

  • HTTP Site: Như mình khuyên ở bài hướng dẫn. Tốt nhất là không tích, dùng https là hợp lý hơn.
3.1.11. Contact Form

Muốn dùng Form đăng ký phải bỏ thêm $ mua extensions nha!

CF7 Compatibility

  • Contact Form 7 Support

Gravity Forms Compatibility

  • Gravity Forms Support

Ninja Forms Compatibility

  • Ninja Forms Support

3.1.12. Comments

Display (Hiển thị)

  • Display on Pages: Tùy vào mục đích
  • Display on Posts: Tích

Discussion (Bình luận)

WordPress Comments: Tích nếu dùng comment mặc định của WordPress

  • No of Comments: Số lượng comment hiển thị
  • Display on User Avatar (Hiện Avatar): Tích

Disqus: Lỗi liên tục tốt nhất không nên dùng cho website

Facebook Comments: Tích nếu dùng comment Facebook

  • No of Comments: Số lượng comment hiển thị
  • Language: vi hay en

Vuukle Comments: Bỏ qua

Spot.IM Conversation: Bỏ qua

3.1.13. Instant Articles

Bỏ qua nếu bạn chưa đủ sức cài Facebook IA

Facebook Instant Articles Setup

  • Facebook Instant Articles Feed URL: domain/instant_articles
3.1.14. Hide AMP Bulk Tools
  • Individual AMP Page (Bulk Edit): Show by Default
  • Select Categories to Hide AMP: Chọn ẩn AMP trên Category nào đó
  • Select Tags to Hide AMP: Chọn ẩn AMP trên Tag nào đó
3.1.15. Advance Settings
  • Mobile Redirection (Khách sử dụng thiết bị di động sẽ tự động chuyển hướng sang AMP): Không tích. Nên nhớ AMP chỉ dành cho Google thôi. Khi search người dùng sẽ vào cho nhanh. Còn khi truy cập trực tiếp hay giới thiệu (click link) thì nên để dạng Responsible. Nó load không chậm mà đẹp nữa. Giữ chân người dùng tốt hơn nhiều.
  • Change Internal Links to AMP (Chuyển link nội bộ sang AMP): Không tích. Mình SEO link non-AMP chứ không SEO link AMP.
  • Smooth Scrolling For Links: Load liên tục, không nên chọn
  • Change End Point to ?amp: Không tích. Dạng “link/amp/” sẽ thân thiện hơn “link?amp
  • Enter HTML in Head: Chèn code, script, html,… vào thẻ Head. Lưu ý, css thêm ở Advanced, mục Global của phần DESIGN. VD: Script quảng cáo GA auto trên AMP
  • Enter HTML in Body (beginning of body tag): Chèn code, script, html,… vào đầu thẻ Body. VD: Mã quảng cáo GA auto trên AMP
  • Enter HTML in Footer: Chèn code, script, html,… vào cuối thẻ Body.
  • Auto Add AMP in Menu URL: Chèn link AMP vào menu
  • Category base remove in AMP: Xóa /category/ trong URL AMP
  • Tag base remove in AMP: Xóa /tag/ trong URL AMP
  • Featured Image from Custom Fields: Ảnh đại diện tùy chỉnh
  • Featured Image from The Content: Lấy ảnh đại diện trong nội dung
  • Duplicate Featured Image: Lặp lại ảnh đại diện
  • Retina Images: Tạo thêm ảnh Retina image. Nó sẽ làm nặng bộ nhớ do tạo thêm ảnh dành cho thiết bị sử dụng công nghệ màn hình Retina.
  • Show Metabox in Post Editor to: All users who can post hoặc Only to Admin
  • Dev Mode in AMP: Chế độ dành cho nhà phát triển AMP
  • Plugin Update Notification Bar: Thông báo cập nhật
  • Disable wptexturize: Bỏ qua tính năng chuyển đổi ký tự của wordpress
  • Role Based Access: Những ai có thể chỉnh sửa amp. Cho mặc định Adminstrator và Editor thôi
  • Delete Data on Uninstall?: Gỡ plugin này sẽ xóa sạch dự liệu đã cài đặt
3.1.16. E-Commerce

Tính năng trả phí, hỗ trợ WooCommerce và Easy Digital Downloads

3.1.17. Translation Panel

Đa số mình để tiếng Anh cho đơn giản. Cũng vì mình không cài AMP ở Homepage, Categories và Tags nên 1 vài từ không xuất hiện nên mình bỏ qua. Tuy nhiên, có 1 vài lưu ý bạn cần làm ngay:

  • Footer: Cần chèn nội dung của bạn
  • Previous (bài viết cũ hơn) và ago (trước với nghĩa thời gian. VD 3 ngày trước). Lưu ý, ago viết thường.

Phiên dịch ngôn ngữ sang tiếng Việt trong AMP

3.2. DESIGN

Customize Look & Feel

3.2.1. Themes

Có 4 themes miễn phí cho bạn lựa chọn

  • Design One
  • Design Two
  • Design Three
  • Swift

Trong những theme free mình thấy Design Two là ổn nhất.

3.2.2. Global

Color Scheme

  • Anchor Link Color: Tự chọn màu link phù hợp với bản trên máy tính (desktop) thôi

General

  • Infinite Scroll (Experimental): Load next page liên tục
  • Font Icon Library: Chọn Swift Icons hoặc Font Awesome Icons

Advanced

  • Custom CSS: Muốn thêm CSS gì thì thêm thôi
3.2.3. Header

Navigation Menu Design

  • Navigation Menu: Tích. Tự tạo Menu riêng tại link ngay dưới hoặc: wp-admin / Appearance / Menus
  • Menu Overlay Position: Chọn khi bấm vào Menu thì hiện lớp phủ bên trái (Left) hay phải (Right)

Header Settings

  • Call Now Button: Thêm số điện thoại ở trên Logo
  • Non-AMP link in Header: Tích. Link trang chủ non-AMP
  • Search: Thêm thanh search trên Logo

Header Design Options

  • Header Background: Màu background Menu
  • Header Elements Color: Màu của chữ trong nút Menu

Navigation Menu Design Options

  • Menu Background: Màu background Menu khi hiện lớp phủ
  • Menu Elements Background: Màu background từng phần trong Menu (ngăn cách bởi đường thẳng) khi hiện lớp phủ
  • Menu Elements Color: Màu chữ trong Menu khi hiện lớp phủ
  • Sub Menu Background
  • Menu Border Color
  • Menu Arrow Color
  • Close Button Color
  • Close Button Background
  • Close Button Hover color
3.2.4. HomePage

Đây là nơi chỉnh sửa giao diện của Trang chủ, Archives (Category, Tag), Taxonimies. Mình không dùng cơ mà vẫn hướng dẫn được.

General

  • Excerpt: Hiện nội dung được rút gọn
  • Excerpt Length: Độ dài đoạn rút gọn
  • Excerpt on Small Screens: Màn hình bé có hiện hay không?

Loop Display Controls (Điều khiển cách hiển thị)

  • Post Type in Loop: Hiện post chứ hiện gì nữa
  • Exclude Categories: Post thuộc category này sẽ không hiển thị
  • Read More Link: Có thêm chữ Read More ngay sau excerpt hay không. Xấu lắm, bỏ qua.
  • Change Image Size: Đổi kích cỡ ảnh đại diện post
  • Date in Loop: Hiện ngày tháng

3.2.5. Single
Single Elements
  • Breadcrumbs: Đường dẫn
    • Breadcrumb Type: Đường dẫn đến bài viết qua các category hay tag
    • Post title on Breadcrumb: Có hiện title ở Breadcrumb không. Diện tích trên mobile khá nhỏ nên bỏ qua đi
    • Breadcrumbs From Yoast: Lấy Breadcrumbs qua Yoast SEO
  • Categories: Hiện Category trên post
  • Tags: Hiện Tag trên post
  • Categories & Tags Links: Chèn link amp vào Tag và Category
  • Excerpt: Hiện đoạn rút gọn
  • Next-Previous Links: Bài viết trước và sau
    • Link to Non-AMP page: Link đến trang Responsible
  • Author Bio: Box tác giả dưới bài viết
    • Link to Author Pages: Chèn link vào box Author
  • Post Pagination: Liên tục tải bài viết tiếp theo khi kéo xuống đến footer
Related Post Settings
  • Related Posts: Tích chứ
    • Related Post by: Categories là hợp lý nhất (Nếu thích theo Tag thì tùy)
    • Image: Hiện ảnh cho đẹp
    • Excerpt: Phải cho thêm đôi dòng đoạn trích chứ
    • Excerpt Length: Độ dài đoạn trích
    • Excerpt on Small Screens: Hiện đoạn trích ở màn hình nhỏ
    • Read More Link: Có thêm chữ Read More ngay sau excerpt hay không. Xấu lắm, bỏ qua.
    • Link to Non-AMP: Mình vẫn đang suy nghĩ nên để như thế nào. Vì khách truy cập từ link AMP cache của Google. Đang load nhanh vù vù mà sang Responsible sẽ bị chậm đi rất nhiều. Vì vậy, tốt nhất không chọn cái này
    • Sort Related Posts Randomly: Cho random là hợp lý
    • Number of Related Post: Mình đang để 5
    • By Last X Days: Tùy ý thích nhưng mình cứ cho từ đầu nên không tích
  • In-Content Related Post: Related Post trong bài viết. Mình có related posts riêng ở trong mỗi bài viết rồi nên không cần. Tuy nhiên, ai dùng mình nhắc trước, nó xấu lắm nếu tích chọn hình ảnh.
    • In-content Related Post by: Lọc theo Categories hay Tags
    • Sort Related Posts Randomly: Cho random là hợp lý
    • Display No. of Related Posts: Như trên
    • Related Post Display: Số lượng ký tự/đoạn để hiện related posts sau đó
    • By Last X Days: Tùy ý thích

Cài đặt thiết kế giao diện Single Post (bài viết) sử dụng AMP

General
  • Lightbox for Images: Hiệu ứng hộp đèn khi bấm vào ảnh
  • H1 – H6 Font Sizes: Chọn cỡ chữ từng thẻ H
  • Advanced Single Options
    • Underline on Links: Gạch chân links
Content Sneak Peek

Content Sneak Peek: Bỏ qua. Giấu content. Xem preview trên amp

3.2.6. Footer

General

  • Link to Non-AMP page in Footer: Nên có ít nhất 1 dòng từ AMP về non-AMP
  • Back to Top link: Đa số thiết bị di động đều có rồi nhưng thêm cũng không mất gì đâu
  • Make “View Non-AMP” link nofollow: Không nên tích. Đây cũng là internal link thôi, cứ để tự nhiên là được.

Footer Design Options

  • Footer Background Color: Màu background
  • Footer Heading Color: Màu Head
  • Footer Text Color: Màu chữ
  • Footer Link Color: Màu link
  • Footer Border Color: Màu viền
3.2.7. Page

General

  • Breadcrumbs: Không cần thiết lắm nhưng để đồng bộ thì tích tạo đường dẫn cũng được
  • Meta Information: Tích chứ
  • Subpages/ChildPages: Không tích nếu bạn không dùng
  • Social Icons: Tùy tâm
  • Sticky Social Icons: Ghim nó phía dưới màn hình mobile khá vướng mắt nên mình bỏ rồi.
3.2.8. Social Sharing

Social Settings

  • Social Share: Tích
    • Social Share links to AMP: Không tích
    • No Follow All Your Social Links: Tùy tâm

AddThis Share Buttons

  • Smart Sorting Share Buttons: Tích nếu dùng
    • Addthis Floating Share: Không cần thiết, vướng lắm
    • Addthis Inline Share: Tích cái này
    • Position: Tùy chọn vị trí hiển thị
    • Pub ID: Tự lấy ở addthis, không lấy luôn mặc định (không đo lường được)
    • Tool ID: Như trên

Sticky Social

  • Sticky Social Sharing bar: Không tích, khá vướng mắt

Social Sharing

  • Facebook Like Button: Nên có
    • Add Recommend Label: Tích nếu muốn hiện chữ Recommend thay Like
  • Facebook: Nên có
    • Facebook App ID: Nếu dùng comment Facebook thì phải tự tạo
  • Facebook Messenger: Tùy tâm
    • Facebook App ID: Nếu dùng thì phải tự tạo
  • Twitter: Nên có
  • Twitter Handle: Điền username. VD: ilovevergreen
  • Pretty Permalinks for Twitter Share?: Nên tích
  • GooglePlus: Đã bị Google diệt rồi, không tích
  • Email: Nên có
  • Pinterest: Nên có
  • LinkedIn: Nên có
  • WhatsApp
  • Line
  • VKontakte
  • Odnoklassniki
  • Reddit
  • Tumblr
  • Telegram
  • Digg
  • StumbleUpon
  • Wechat
  • Viber
  • Hatena Bookmarks
  • Pocket
  • Mewe
  • Flipboard
3.2.9. Date

General

  • Show Date As: Published Date (ngày đăng) hoặc Modified Date (ngày chỉnh sửa)
  • Date Format: Traditional view (đúng thời gian) hoặc Ago (x ngày trước)
  • Time: Tích
  • Date Notice: Hiện thời gian phía cuối bài viết
    • Notice Type: Hiện thời gian chỉnh sửa (Modified Date Notice) hoại thời gian đăng bài (Published Date Notice)
    • Time: Tích
3.2.10. Misc

Launch post builder

Chỉnh sửa bằng builder. Nên dùng cho biết và tùy chỉnh đẹp hơn đấy

General

  • RTL Support: Không tích. Kiểu chữ từ phải sang trái (Right to Left). VD mấy chữ Ả Rập ý
  • Sub-Categories under Category: Không nên tích. Hiện category con dưới category mẹ

3.3. EXTENSIONS

Toàn plugin trả phí thôi nhưng có 1 plugin miễn phí giúp bạn sửa lỗi AMP đấy. Cũng chả nhớ tại sao kiếm được luôn :v

3.3.1. AMP Plugins Manager

Tải về và cài đặt tại: https://ampforwp.com/plugins-manager/

Công dụng: Tắt những plugin bạn không muốn chạy trên AMP.

Cách sử dụng:

  • Truy cập đường dẫn: wp-admin / AMP / Plugins Manager
  • Kích hoạt AMP Plugins Manager, chọn plugin muốn tắt khi truy cập AMP và lưu lại là xong.

Đây chính là giải pháp cho sửa lỗi AMP do kk Star Ratings plugin gây ra và cả tawk.to nữa. Nếu bị lỗi trong GSC hãy click link để xem cách giải quyết.

Lưu ý: Bản update mới nhất đã sửa lỗi này.

3.4. FREE VS PRO

Những dòng pr moi tiền bạn :v

3.5. Appearance

Quên mất 1 tính năng ẩn khá quan trọng đó là chỉnh sửa giao diện bài viết (post) trên AMP với Appearance

Truy cập đường dẫn: wp-admin / Appearance / AMP

Tiếng Việt: wp-admin / Giao diện / AMP

Sau khi hiện ra trang chỉnh sửa giao diện quen thuộc thì click AMP / Design để truy cập Design Manager (có 1 đường dẫn thôi). Tại đây, bạn có thể thay đổi vị trí, bật tắt vài tính năng sao cho dễ nhìn nhất.

Lưu ý: Hãy thay đổi kích thước màn hình hiển thị (phía dưới cùng) liên tục để kiểm tra. Có 1 vài chức năng chỉ hiển thị trên desktop thôi.

III. Plugin Better AMP – WordPress Complete AMP

1. Cài đặt AMP

Xem hướng dẫn ở mục I. Tìm kiếm với từ khóa “better amp” hoặc link https://wordpress.org/plugins/better-amp/

2. Đánh giá

Mình không sử dụng plugin này nhưng có thể review 1 chút:

  • Giao diện thân thiện: Dù bạn không chuyên nhưng chỉ cần cài đặt là nó tự tối ưu khá đẹp ~ plugin AMP for WP – Accelerated Mobile Pages đã mất công tối ưu.
  • Load nhanh
  • Tối ưu SEO onpage tốt
  • Có 1 vài lỗi AMP cần chỉnh sửa khi cài đặt thêm plugin khác
  • Category + Tag chưa ổn lắm
  • Đó chỉ là bề nổi thôi. Hiện tại cấu trúc SEO onpage mới là qaun trọng trong SEO. Vì vậy, bạn vẫn cần tối ưu cho tốt.

 

Đây là 1 trong số ít bài viết mình hướng dẫn cho tiết từ a-z, những điều nhỏ nhất cũng không bỏ qua. Hi vọng mọi người đều có thể cài đặt AMP thành công mà không cần phải giải đáp thêm. Tuy nhiên, nếu có thắc mắc cũng như thay đổi đáng kể nào hãy comment phía dưới. Mình sẵn lòng giải đáp sớm nhất có thể. Chúc các bạn có thể SEO top trên Mobile nha! Bật mí chút là search Google trên điện thoại Evergreen có thứ hạng cao hơn máy tính đấy.

Xem bài tiếp theo trong Series

<< Tạo thông báo đẩy (Push Notifications) với OneSignal Push

Related Post