Vô hiệu hóa Google Fonts trên WordPress

Tại Sao Nên Vô Hiệu Hóa Google Fonts Trên WordPress?

Google Fonts là một dịch vụ tuyệt vời cung cấp hàng ngàn phông chữ miễn phí để sử dụng trên website của bạn. Tuy nhiên, việc sử dụng Google Fonts trực tiếp từ máy chủ của Google cũng có một số nhược điểm cần xem xét. Vô hiệu hóa Google Fonts và lưu trữ chúng trên máy chủ của bạn có thể mang lại nhiều lợi ích, đặc biệt là về hiệu suất và quyền riêng tư.

Hiệu Suất Website

Một trong những lý do chính để vô hiệu hóa Google Fonts là cải thiện tốc độ tải trang. Mỗi khi trình duyệt tải một trang web sử dụng Google Fonts, nó phải thực hiện một yêu cầu HTTP đến máy chủ của Google để tải xuống các tệp phông chữ. Điều này có thể làm chậm quá trình tải trang, đặc biệt là đối với người dùng có kết nối internet chậm. Bằng cách lưu trữ phông chữ cục bộ, bạn có thể loại bỏ yêu cầu HTTP bên ngoài này, giúp trang web tải nhanh hơn.

Quyền Riêng Tư của Người Dùng

Khi sử dụng Google Fonts trực tiếp từ máy chủ của Google, địa chỉ IP của khách truy cập trang web sẽ được gửi đến Google. Điều này có thể gây ra lo ngại về quyền riêng tư, đặc biệt là ở các quốc gia có quy định nghiêm ngặt về bảo vệ dữ liệu cá nhân như GDPR ở Châu Âu. Việc lưu trữ phông chữ cục bộ sẽ giúp bạn bảo vệ quyền riêng tư của người dùng bằng cách ngăn chặn việc chia sẻ dữ liệu của họ với Google.

Kiểm Soát Tốt Hơn

Khi bạn lưu trữ phông chữ cục bộ, bạn có toàn quyền kiểm soát các tệp phông chữ của mình. Bạn có thể dễ dàng cập nhật, thay đổi hoặc tối ưu hóa chúng để phù hợp với nhu cầu của mình. Bạn cũng không phải lo lắng về việc Google thay đổi các tệp phông chữ của họ, điều này có thể ảnh hưởng đến giao diện của trang web.

Các Phương Pháp Vô Hiệu Hóa Google Fonts Trên WordPress

Có nhiều cách khác nhau để vô hiệu hóa Google Fonts trên WordPress. Một số phương pháp đơn giản chỉ yêu cầu cài đặt một plugin, trong khi những phương pháp khác đòi hỏi một chút kiến thức về lập trình.

Sử Dụng Plugin WordPress

Đây là phương pháp đơn giản và phổ biến nhất để vô hiệu hóa Google Fonts. Có nhiều plugin WordPress miễn phí và trả phí có thể giúp bạn thực hiện việc này một cách dễ dàng. Một số plugin phổ biến bao gồm:

• Disable Google Fonts
• OMGF | Host Google Fonts Locally
• Asset CleanUp: Page Speed Booster

Các plugin này thường có giao diện trực quan, cho phép bạn vô hiệu hóa Google Fonts chỉ bằng một vài cú nhấp chuột. Một số plugin còn cung cấp các tính năng bổ sung, chẳng hạn như khả năng tải phông chữ cục bộ và tối ưu hóa chúng để có hiệu suất tốt hơn.

Sử Dụng Code (Cho Người Dùng Nâng Cao)

Nếu bạn có kiến thức về lập trình WordPress, bạn có thể vô hiệu hóa Google Fonts bằng cách thêm code vào file functions.php của theme hoặc bằng cách tạo một plugin tùy chỉnh. Phương pháp này đòi hỏi một chút kỹ năng lập trình, nhưng nó mang lại cho bạn sự kiểm soát hoàn toàn đối với quá trình vô hiệu hóa.

Ví dụ, bạn có thể sử dụng hàm wp_dequeue_style để loại bỏ các stylesheet chứa Google Fonts. Bạn cần xác định chính xác ID của các stylesheet này, thường có thể tìm thấy trong mã nguồn của trang web.

Một đoạn code ví dụ (có thể cần điều chỉnh tùy theo theme của bạn):

function remove_google_fonts() {
    wp_dequeue_style( 'your-theme-google-fonts' ); // Thay 'your-theme-google-fonts' bằng ID thực tế của stylesheet
}
add_action( 'wp_enqueue_scripts', 'remove_google_fonts', 100 );

Lưu ý: Sao lưu website của bạn trước khi thực hiện bất kỳ thay đổi nào vào file functions.php.

Sử Dụng Child Theme

Nếu bạn muốn chỉnh sửa code của theme, hãy sử dụng child theme. Điều này sẽ giúp bạn tránh mất các thay đổi của mình khi cập nhật theme chính. Child theme là một theme con kế thừa tất cả các tính năng và thiết kế của theme cha, nhưng cho phép bạn tùy chỉnh nó mà không ảnh hưởng đến theme gốc.

Lưu Trữ Google Fonts Cục Bộ

Sau khi đã vô hiệu hóa Google Fonts, bạn cần lưu trữ chúng cục bộ trên máy chủ của mình để trang web vẫn hiển thị đúng cách. Có nhiều cách để tải xuống và lưu trữ Google Fonts cục bộ.

Tải Xuống Google Fonts

Bạn có thể tải xuống Google Fonts từ trang web Google Fonts bằng cách chọn các phông chữ bạn muốn sử dụng và nhấp vào nút “Download family”. Sau khi tải xuống, bạn sẽ nhận được một file ZIP chứa các tệp phông chữ ở nhiều định dạng khác nhau (WOFF, WOFF2, TTF, EOT, SVG).

Tải Lên Phông Chữ Lên WordPress

Bạn có thể tải lên các tệp phông chữ đã tải xuống lên thư mục wp-content/fonts trong WordPress. Nếu thư mục này chưa tồn tại, bạn có thể tạo nó. Bạn có thể sử dụng FTP hoặc trình quản lý tệp trong cPanel để tải lên các tệp phông chữ.

Thêm CSS Để Sử Dụng Phông Chữ Cục Bộ

Sau khi đã tải lên các tệp phông chữ, bạn cần thêm CSS để chỉ định cách sử dụng chúng trên trang web. Bạn có thể thêm CSS vào file style.css của theme hoặc sử dụng plugin CSS tùy chỉnh.

Ví dụ về CSS để sử dụng phông chữ “Open Sans” được lưu trữ cục bộ:

@font-face {
    font-family: 'Open Sans';
    src: url('/fonts/OpenSans-Regular.woff2') format('woff2'),
         url('/fonts/OpenSans-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body {
    font-family: 'Open Sans', sans-serif;
}

Thay đổi đường dẫn đến các tệp phông chữ để phù hợp với cấu trúc thư mục của bạn. Đảm bảo bao gồm nhiều định dạng phông chữ để hỗ trợ nhiều trình duyệt.

Kiểm Tra Sau Khi Vô Hiệu Hóa Google Fonts

Sau khi đã vô hiệu hóa Google Fonts và lưu trữ chúng cục bộ, hãy kiểm tra kỹ trang web của bạn để đảm bảo mọi thứ hoạt động bình thường. Đảm bảo rằng các phông chữ hiển thị đúng cách trên tất cả các trình duyệt và thiết bị.

Sử dụng các công cụ như Google PageSpeed Insights hoặc GTmetrix để kiểm tra tốc độ tải trang của bạn. Bạn sẽ thấy sự cải thiện đáng kể về hiệu suất sau khi loại bỏ các yêu cầu HTTP bên ngoài đến Google Fonts.

Những việc cần kiểm tra sau khi vô hiệu hóa:

• Kiểm tra trên nhiều trình duyệt (Chrome, Firefox, Safari, Edge)
• Kiểm tra trên thiết bị di động và máy tính bảng
• Sử dụng công cụ kiểm tra tốc độ website để đánh giá hiệu suất

Kết Luận

Vô hiệu hóa Google Fonts trên WordPress có thể mang lại nhiều lợi ích, bao gồm cải thiện hiệu suất website, bảo vệ quyền riêng tư của người dùng và tăng khả năng kiểm soát đối với các tệp phông chữ của bạn. Có nhiều phương pháp khác nhau để thực hiện việc này, từ việc sử dụng plugin đơn giản đến chỉnh sửa code phức tạp. Chọn phương pháp phù hợp nhất với kỹ năng và nhu cầu của bạn. Đừng quên kiểm tra kỹ trang web của bạn sau khi thực hiện bất kỳ thay đổi nào để đảm bảo mọi thứ hoạt động bình thường.