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

0

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 …)

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ệ

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

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