Bài 4: Sửa lỗi font cho website WordPress – Sử dụng Google font

4 447

Trong bài viết này, mình sẽ hướng dẫn các bạn sửa lỗi font cho website bán hàng chúng ta đang làm ở video trước bằng cách sử dụng Google font.

Video – Sửa lỗi font cho website WordPress

Hướng dẫn chi tiết

Nguyên nhân lỗi font

✔ Nguyên nhân gây ra lỗi font trên website là do font mặc định của giao diện (theme) wordpress không hỗ trợ Tiếng Việt. Kho giao diện theme WordPress hiện nay rất đa dạng và phong phú, đến từ nhiều nhà phát triển khác nhau. Thông thường, một theme tốt sẽ sử dụng font hỗ trợ nhiều ngôn ngữ.

Tuy nhiên, một số nhà phát triển (mình gọi là DEV cho ngắn gọn nhé) chỉ tập trung vào thị trường Tiếng Anh nên sử dụng font hỗ trợ cho tiếng Anh hoặc các ngôn ngữ không dấu.

✔ Để sửa lỗi font cho website, bạn cần thay đổi font mặc định của website.

✔ Có rất nhiều cách để thay đổi font cho website WordPress

+ Sử dụng plugins để upload file font theo ý bạn mong muốn

+ Sử dụng Google font (có thể tải file hoặc dùng link trực tuyến). Bạn có thể tự cài đặt Google font hoặc dùng plugins cũng được.

Trong nội dung bài viết này, mình sẽ dùng Google font và tự đổi font bằng code thủ công nhé.

Đổi Google font cho website

Đầu tiên, bạn cài giúp mình plugins Insert Headers and Footers. Link tải ngay đây

Nói sơ về tác dụng của plugins này. Giao diện website mà bạn nhìn thấy về bản chất là 1 file html. Gồm 2 phần chính là head và body. Phần head là phần code nằm trong cặp thẻ <head></head>, phần body nằm trong phần thẻ <body></body> như hình bên dưới.

File html chuẩn
Cấu trúc file html

Đối với plugins này:

  • Headers: là những đoạn code nằm trong phần head, có tác dụng khai báo css, js …
  • Footers: là những đoạn code trước khi đóng thẻ body (đứng trước </body>). Có thể dùng để thêm code tùy chỉnh (nút gọi, khung chat, mã js …)
FBI WARNING - dưới đây có QUẢNG CÁO

Bạn MUỐN TĂNG KÍCH THƯỚC website WORDPRESS, nhanh, rẻ và dễ sử dụng có thể chọn hosting Azdigi nhé.
Link đăng ký: https://my.azdigi.com/aff.php?aff=1612
Nếu các bạn click và đăng ký hosting từ link trên, mình sẽ có một ít tiền để duy trì.

Nếu bạn không phải là người biết về code thì bỏ qua nhé. Làm theo hướng dẫn là được. Mình sẽ có một video khác nói về cách không cần code mà dùng plugins để cài Google Font.

Sau khi đã cài plugins và kích hoạt, các bạn vào đường dẫn sau https://fonts.google.com để lựa chọn font. Nhớ chọn font hỗ trợ tiếng Việt nhé.

Giao diện chọn font Google
Giao diện chọn font Google

Bạn có thể vào phần custom để chọn thêm nhiều dạng của font này.

Bạn copy đoạn <link href …> ….</link> , Trong trang admin wordpress, chọn Cài đặt -> Insert Headers and Footers, dán nội dung vào phần Headers trong plugins Insert Headers and Footers vừa cài.

Sau đó các bạn thêm mã css tùy chỉnh font vào phần CSS tùy chỉnh (Vào xem trang -> Chọn Tùy biến giao diện -> CSS tùy chỉnh). Đoạn này hơi dài, mình khuyên bạn nên xem video nhé.

Như vậy là chúng ta đã sửa xong lỗi font của website. Bài học sau, mình sẽ hướng dẫn về WooCommerce, cách import dữ liệu demo và hiển thị sản phẩm ra ngoài giao diện bằng shortcode.

Nếu có thắc mắc, đặt câu hỏi bằng cách comment bên dưới, qua email, hoặc nhắn tin qua Fanpage Góc làm web.

Đừng quên LikeShare nếu thấy bài viết thú vị.

Liên hệ

  1. chính nói

    a ơi cho e hỏi
    sao tên wed của e khi search thì ra ra toàn tiến nhật ko ạ
    mà nhấn vào thì nó lại đúng ạ

    1. Admin nói

      Coi lại meta description, meta title nha

  2. Lan Phương nói

    Chào add,
    Mình đã làm như hướng dẫn nhưng chữ trong văn bản bị in đậm lên hết, ad cho mình hỏi có cách nào fixx lỗi ko ạ?
    Cám ơn ad nhiều ạ

    1. Admin nói

      Xem lại css nha bạn, bạn viết đúng chưa

Để lại một trả lời

Địa chỉ email của bạn sẽ không được công bố.