Có một lỗi trong WordPress 6.5 cấm phông chữ tùy chỉnh hiển thị chính xác trên trang web của bạn khi sử dụng tính năng Thư viện phông chữ.

Lỗi này dường như xảy ra nếu bạn đã từng cài đặt và sử dụng phiên bản cũ Chủ đề khối tùy chỉnh plugin trên trang web của bạn để hiển thị phông chữ tùy chỉnh, đây là phương pháp thực tế để tải lên và hiển thị phông chữ tùy chỉnh trước khi giới thiệu tính năng Thư viện phông chữ của WordPress 6.5.

Tính năng Thư viện Phông chữ là gì

Như bạn có thể đã biết, Thư viện Phông chữ Tính năng này cho phép bạn tải lên phông chữ tùy chỉnh từ máy tính của mình hoặc liên kết trực tiếp tới Google Fonts từ bên trong Trình chỉnh sửa trang web. Tính năng này chỉ khả dụng cho Chủ đề khối, sử dụng Trình chỉnh sửa khối Gutenberg của WordPress để thiết kế trang web.

Sửa lỗi phông chữ tùy chỉnh không hiển thị trong WordPress 6.5

Để giải quyết vấn đề này, trước tiên bạn cần đảm bảo đã cài đặt phiên bản mới nhất của plugin Chủ đề khối tùy chỉnh. Bạn cũng cần điều hướng đến phần Kiểu của Trình chỉnh sửa Trang để chỉnh sửa kiểu hiện tại cho chủ đề của bạn. Cuối cùng, bạn sẽ cần lưu đúng phông chữ tùy chỉnh vào chủ đề của mình.

Bước 1: Cài đặt Plugin Tạo khối chủ đề hoặc Cập nhật lên phiên bản mới nhất

Vì WordPress 6.5 đã giới thiệu khả năng thêm phông chữ tùy chỉnh thông qua tính năng Thư viện phông chữ nên họ đã loại bỏ khả năng này khỏi plugin Tạo khối chủ đề. Tuy nhiên, nếu bạn đã từng sử dụng phiên bản cũ của plugin này để hiển thị phông chữ tùy chỉnh trên trang web của mình, bạn vẫn cần cài đặt plugin Tạo khối chủ đề trên trang web WordPress của mình để Thư viện phông chữ hiển thị chính xác các phông chữ tùy chỉnh.

Nhấp vào Thêm plugin mới Bên trong phần Plugins của Khu vực quản trị WordPress

Vì vậy, hãy điều hướng đến phần Plugin trong khu vực Quản trị viên WP của bạn. Nếu bạn đã cài đặt plugin này, hãy đảm bảo rằng nó đã được cập nhật lên phiên bản mới nhất. Nếu bạn đã xóa nó, hãy đi tới “Thêm plugin mới” để thêm plugin mới.

Tìm kiếm Plugin WordPress Tạo chủ đề khối và nhấp vào Cài đặt ngay

Sau đó, tìm kiếm “Tạo chủ đề khối” bằng thanh tìm kiếm ở góc trên bên phải và nhấp vào “Cài đặt ngay” bên cạnh plugin chủ đề Tạo khối hiển thị trong kết quả tìm kiếm.

Nhấp vào Kích hoạt để kích hoạt Plugin WordPress Tạo khối chủ đề

Nhấp vào “Kích hoạt” để kích hoạt plugin sau khi cài đặt xong.

Bước 2: Sử dụng Thư viện Phông chữ để Thêm Phông chữ Tùy chỉnh vào Trang web của bạn

Giờ đây, phiên bản mới nhất của plugin Tạo chủ đề khối đã được cài đặt và kích hoạt, bạn sẽ cần điều hướng đến Trình chỉnh sửa trang để thêm phông chữ tùy chỉnh vào trang web của mình (nếu bạn chưa có). Nếu bạn đã thêm phông chữ tùy chỉnh, hãy chuyển sang bước tiếp theo.

Điều hướng đến Trình chỉnh sửa giao diện bên trong Khu vực quản trị WordPress

Đầu tiên, vào Giao diện> Biên tập. Thao tác này sẽ đưa bạn đến Trình chỉnh sửa trang.

Truy cập Trình chỉnh sửa trang bằng cách nhấp vào khu vực nội dung chính

Nhấp vào bên phải màn hình, nơi hiển thị trang web đang hoạt động của bạn (thường là trang chủ đang hoạt động).

Nhấp vào Biểu tượng Kiểu trong Thanh công cụ Khối của Trình chỉnh sửa trang WordPress

Bây giờ bạn sẽ ở trong cái được gọi là Block Editor. Phía trên cùng của trình chỉnh sửa là Thanh công cụ khối. Ở góc trên cùng bên phải của Thanh công cụ khối, bạn sẽ thấy một biểu tượng có tên là “Styles” (nó có biểu tượng hình tròn nửa đen, nửa trắng). Nhấp vào biểu tượng này để mở thanh bên cài đặt Kiểu.

Nhấp vào Kiểu chữ Bên trong Thanh bên Kiểu cho WordPress

Tiếp theo, nhấp vào “kiểu chữ” để truy cập cài đặt kiểu chữ.

Nhấp vào Biểu tượng Quản lý Phông chữ để Thêm hoặc Xem Phông chữ WordPress Tùy chỉnh

Ở bên phải của tiêu đề phụ “Phông chữ”, bạn sẽ thấy một biểu tượng thanh trượt nhỏ có nhãn “Quản lý phông chữ”. Nhấp vào biểu tượng này để truy cập tính năng Thư viện phông chữ (tính năng này sẽ chỉ khả dụng trong WordPress 6.5 hoặc mới hơn).

Tải lên phông chữ thông qua tính năng quản lý phông chữ mới trong WordPress

Tại đây, bạn có thể sử dụng tab “Tải lên” để cài đặt phông chữ của bên thứ ba từ máy tính của mình hoặc sử dụng tab “Cài đặt phông chữ” để liên kết với Google Fonts. Sau khi tải lên hoặc liên kết tới phông chữ của mình, bạn có thể đóng cửa sổ này.

Bước 3: Lưu phông chữ vào chủ đề hiện tại của bạn

Bây giờ bạn đã thêm phông chữ tùy chỉnh vào trang web của mình, bạn chỉ cần nhấp vào “Cập nhật” và phông chữ bây giờ sẽ được hiển thị trên trang web của bạn…. Phải?

Không chính xác. Nếu bạn đã từng sử dụng plugin Create Block Theme cũ trước khi cập nhật lên WordPress 6.5, bạn phải hoàn thành một bước bổ sung để các thay đổi của bạn có hiệu lực.

Nhấp vào Tạo biểu tượng chủ đề khối trong Thanh công cụ khối để lưu cài đặt chủ đề tùy chỉnh

Trong Thanh công cụ khối dọc theo đầu Trình chỉnh sửa khối, bạn sẽ thấy biểu tượng cờ lê có nhãn “Tạo chủ đề khối”. Nhấp vào biểu tượng này.

Lưu ý: nếu bạn không cài đặt hoặc cập nhật lên phiên bản mới nhất của plugin Tạo chủ đề khối và/hoặc bạn không sử dụng WordPress 6.5 trở lên, biểu tượng này sẽ không hiển thị trên thanh công cụ của Trình chỉnh sửa khối.

Nhấp vào lưu Thay đổi chủ đề bên trong Tạo khối Thanh bên chủ đề

Tiếp theo, nhấp vào “Lưu thay đổi cho chủ đề”.

Chọn hộp kiểm Lưu phông chữ và nhấp vào Lưu thay đổi

Đảm bảo chọn “Save Fonts”, sau đó nhấp vào “Save Changes”.

Xác nhận thay đổi phông chữ WordPress tùy chỉnh và nhấp vào OK

Một thông báo thành công bây giờ sẽ hiển thị ở đầu trình chỉnh sửa cho biết trình chỉnh sửa sẽ tải lại. Nhấn OK để xác nhận. Trình chỉnh sửa bây giờ sẽ tải lại.

Nhấp vào Xem trang để xem trước phông chữ WordPress tùy chỉnh

Bây giờ, bạn sẽ thấy phông chữ tùy chỉnh chính xác được hiển thị trong nội dung của mình bên trong cửa sổ soạn thảo (nếu bạn nhìn kỹ vào tiêu đề chính trong ảnh trên so với ảnh trước, bạn sẽ thấy phông chữ đã thay đổi/cập nhật). Bạn cũng có thể nhấp vào “Xem trang” để xem bản xem trước trực tiếp trang web của mình, bản xem trước này hiện sẽ hiển thị chính xác phông chữ của bên thứ ba.

Đó là tất cả cho hướng dẫn này! Nếu bạn thấy nó hữu ích, bạn có thể xem phần khác của tôi Bài viết trợ giúp và video hướng dẫn về WordPress. Bạn cũng có thể ghi danh vào của tôi Khóa học đơn giản hóa WordPress trên Udemy.

Davies Media Design Bản tin email ứng dụng sáng tạo miễn phí

Đăng ký Bản tin DMD

Đăng ký để nhận hướng dẫn mới, cập nhật khóa học và tin tức mới nhất về các ứng dụng sáng tạo miễn phí yêu thích của bạn!

Bạn đã đăng ký thành công!