Cách thêm phông chữ tùy chỉnh vào trang web WordPress của bạn (3 phương pháp)

Chưa được phân loại

Kiểu chữ quan trọng hơn hầu hết mọi người ghi công cho nó. Các phông chữ bạn sử dụng không chỉ ảnh hưởng đến bản trình bày trang web của bạn, chúng còn có thể làm cho nó nổi bật so với các trang web khác và hiển thị nội dung của bạn dễ đọc hơn. Chọn các phông chữ giống như những người khác có thể là một đặt cược an toàn, nhưng có thể đáng để bạn thêm phông chữ tùy chỉnh vào WordPress.

Mặc dù WordPress bao gồm nhiều tùy chọn phông chữ khác nhau, nhưng có rất nhiều cách để cải thiện lựa chọn đó. Nếu bạn biết cách bao gồm các phông chữ tùy chỉnh trên trang web của mình, bạn sẽ có thể chọn từ hàng nghìn tùy chọn thú vị. Điều này sẽ cho phép bạn tìm một phông chữ phù hợp với thị trường ngách và đối tượng của bạn.

Trong bài viết này, chúng ta sẽ nói về phông chữ tùy chỉnh là gì và bạn có thể tìm thấy một số lựa chọn tuyệt vời ở đâu. Sau đó, chúng ta sẽ xem xét ba phương pháp bạn có thể sử dụng để tải phông chữ tùy chỉnh lên WordPress. Hãy bắt đầu nào!

Hiểu phông chữ tùy chỉnh là gì (và lý do tại sao bạn có thể muốn sử dụng chúng)

Thuật ngữ ‘phông chữ tùy chỉnh’ khá rộng. Tuy nhiên, vì chúng ta đang nói về WordPress, chúng tôi sẽ sử dụng nó để chỉ bất kỳ kiểu chữ nào hệ thống quản lý nội dung (CMS) không bao gồm ra khỏi hộp. Có Hàng nghìn các tùy chọn phông chữ tùy chỉnh mà bạn có thể tìm thấy trực tuyến và nói chung, không có gì ngăn cản bạn sử dụng bất kỳ tùy chọn phông chữ nào trong số đó.

Tuy nhiên, hãy nhớ rằng – phông chữ bạn chọn không nên chỉ mang tính thẩm mỹ. Họ cũng nên đáp ứng một số tiêu chí bổ sung:

Ngoài những cân nhắc kỹ thuật này, phông chữ cung cấp cho bạn một cách bổ sung để thể hiện phong cách trang web của bạn. Chúng có thể trở thành một phần trong thương hiệu của bạn và theo thời gian, người dùng có thể liên kết chúng với trang web và doanh nghiệp của bạn. Vì vậy, bạn sẽ muốn xem xét các lựa chọn của mình rất cẩn thận.

Nơi bạn có thể tìm thấy phông chữ tùy chỉnh cho trang web WordPress của mình

Nếu bạn thực hiện tìm kiếm nhanh ‘phông chữ miễn phí’ bằng bất kỳ công cụ tìm kiếm nào ngay bây giờ, bạn sẽ tìm thấy hàng trăm trang có nhiều lựa chọn để chọn:

Sử dụng Google để tìm kiếm phông chữ miễn phí.

Tuy nhiên, vấn đề là rất nhiều trang web ‘phông chữ miễn phí’ đó không có xu hướng có tiêu chuẩn cao khi nói đến việc quản lý các lựa chọn của họ. Bạn có thể tìm thấy một số đồ trang sức, nhưng trong nhiều trường hợp, chúng cũng sẽ có đầy đủ các phông chữ mà bạn sẽ không bị bắt chết bằng cách sử dụng ngay cả khi bạn đang làm việc trên hồ sơ MySpace năm 2005.

May mắn thay, có rất nhiều kho phông chữ tuyệt vời làm đi đến độ dài lớn để quản lý các bộ sưu tập của họ. Một trong những mục yêu thích của chúng tôi là Phông chữ Google, cung cấp hơn 900 họ phông chữ bằng một số ngôn ngữ, tất cả đều miễn phí:

Trang chủ Google Fonts.

Một lựa chọn tuyệt vời khác là Phông chữ Adobe (trước đây Bộ sưu tập), cung cấp hơn 1,700 họ phông chữ để bạn lựa chọn. Tuy nhiên, hãy nhớ rằng – để truy cập chúng, bạn sẽ cần một Đám mây sáng tạo đăng ký (bất kỳ cấp nào cũng sẽ làm). Nếu bạn là người dùng Adobe, điều đó có nghĩa là bạn đã có quyền truy cập vào toàn bộ bộ sưu tập phông chữ:

Trang chủ Adobe Fonts.

Chỉ riêng hai nguồn này sẽ cung cấp cho bạn nhiều tùy chọn để lựa chọn. Hãy nhớ rằng khi thực hiện lựa chọn của bạn rằng mỗi phông chữ bạn chọn phải phù hợp với phần còn lại của phong cách trang web của bạn và dễ đọc. Khi bạn đã tìm thấy một vài phông chữ bạn thích, tất cả những gì còn lại là thêm chúng vào trang web của bạn.

Cách thêm phông chữ tùy chỉnh vào trang web WordPress của bạn (ba phương pháp)

Khi nói đến phông chữ tùy chỉnh, WordPress cung cấp cho bạn một số cách mà bạn có thể triển khai các tùy chọn bạn muốn. Chúng ta hãy xem xét những gì liên quan đến, vì vậy bạn có thể chọn phương pháp phù hợp nhất với mình.

1. Chỉnh sửa tệp của chủ đề

Nếu bạn không muốn tải các tệp phông chữ lên trang web của mình theo cách thủ công, bạn luôn có thể ‘nhập’ chúng từ kho của bên thứ ba. Ví dụ: với Google Fonts, bạn có thể mở bất kỳ trang phông chữ nào bạn muốn và nhấp vào Chọn phông chữ này ở đầu màn hình:

Cách tải xuống kiểu chữ mới

Khi bạn làm điều đó, một menu mới sẽ xuất hiện bao gồm hai đoạn mã. Cái đầu tiên sẽ trông như thế này:

<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">

Mã này nên được đặt trong <head> thẻ của của chủ đề con bạn tiêu đề.php tệp. Bạn có thể tìm thấy thông tin này trong thư mục của chủ đề trong public_html / wp-nội dung /chủ đề thư mục.

Với dòng đó, bạn đang yêu cầu WordPress nhập tùy chọn bạn đã chọn từ Google Fonts. Tuy nhiên, để sử dụng nó, bạn cũng sẽ cần mở biểu định kiểu của chủ đề con và chỉ định những yếu tố nào sẽ tận dụng phông chữ mới của bạn. Code đó sẽ trông như thế nào:

font-family: 'Roboto', sans-serif;

Hãy nhớ rằng, biểu định kiểu của chủ đề con của bạn phải nằm trong cùng thư mục với biểu định kiểu của nó tiêu đề.php tệp. Điều đó có nghĩa là bạn có thể thực hiện cả hai tác vụ ở cùng một nơi và triển khai các phông chữ mới chỉ trong vài phút.

2. Tải tệp phông chữ lên thư mục của chủ đề

Nếu bạn là tất cả về tối ưu hóa hiệu suất, tải trực tiếp các tệp phông chữ lên trang web của bạn có thể cho phép bạn giảm bớt vài mili giây thời gian tải của mình. Tất nhiên, điều đầu tiên bạn cần là tệp phông chữ bạn muốn tải lên máy chủ của mình:

Ví dụ về các tệp phông chữ.

Vì WordPress không bao gồm một chuyên dụng Phông chữ thư mục, bạn sẽ muốn tạo một thư mục sử dụng máy khách FTP đáng tin cậy của bạn. Bạn có thể thêm thư mục bất cứ nơi nào bạn muốn, nhưng chúng tôi khuyên bạn nên đặt nó trong Chủ đề thư mục để bạn có thể theo dõi nó. Thiết lập nó ngay bây giờ và tải tệp phông chữ của bạn lên thư mục mới:

Thiết lập một thư mục chuyên dụng trong WordPress.

Khi tệp đã được đặt đúng chỗ, hãy mở biểu định kiểu của chủ đề con của bạn. Bây giờ bạn sẽ cần phải gọi vào phông chữ đó để bạn có thể sử dụng nó, thông qua một đoạn trích sẽ trông như thế này:

@font-face {
font-family: New Font;
src: url(http://www.yourwebsite.com/wp-content/themes//fonts/your-new-font.ttf);
font-weight: normal;
}

Xin lưu ý rằng họ phông chữ và URL ở trên là trình giữ chỗ, bạn sẽ cần thay thế bằng thông tin phù hợp.

Khi bạn đã nhập mã này, đừng đóng biểu định kiểu của chủ đề. Bạn vẫn cần định cấu hình phần tử nào sẽ sử dụng phông chữ mới, với một số mã rất giống với những gì chúng ta đã xem xét trong phần trước:

.h1 site-title {
font-family: "New Font", Arial, sans-serif;
}

Trong ví dụ này, chúng tôi đang định cấu hình các tiêu đề phụ H1 của mình để sử dụng phông chữ mới. Tuy nhiên, bạn có thể thay thế nó bằng bất kỳ yếu tố nào khác mà bạn muốn hoặc nhiều yếu tố nếu bạn muốn thay đổi phông chữ ở nhiều nơi.

3. Sử dụng plugin

Như thường lệ, cách dễ nhất để triển khai chức năng mới trong WordPress là cài đặt một plugin. Khi nói đến việc sử dụng phông chữ tùy chỉnh, có rất nhiều tùy chọn để lựa chọn.

Ví dụ: nếu bạn muốn sử dụng Google Fonts, chúng tôi khuyên bạn nên đặt tên khéo léo Google Fonts cho WordPress plugin. Sau khi kích hoạt công cụ này, bạn sẽ có thể chọn từ toàn bộ danh mục Google Fonts cho các trang và bài đăng của mình mà không cần thêm bất kỳ mã nào vào trang web của mình:

Mặt khác, nếu bạn muốn sử dụng bất kỳ tệp phông chữ nào và không giới hạn bản thân trong một kho lưu trữ duy nhất, Phông chữ tùy chỉnh là công cụ bạn nên xem xét:

Với plugin này, bạn có thể tải phông chữ lên trang web của mình ngay từ trang tổng quan và sử dụng Trình tùy chỉnh để chọn địa điểm và thời gian sử dụng chúng. Một trong hai plugin này giúp bạn dễ dàng thêm phông chữ tùy chỉnh mới vào trang web của mình.

Kết thúc

Nếu bạn chú ý đến các phông chữ mà các trang web sử dụng, bạn sẽ nhận thấy rằng nhiều phông chữ trong số chúng dính vào cùng một số lựa chọn đã được thử và đúng. Một số phông chữ đặt cược khá an toàn khi nói đến khả năng đọc và khả năng truy cập của người dùng. Tuy nhiên, với hàng nghìn tùy chọn để lựa chọn – cả miễn phí và trả phí – bạn nên tìm kiếm một tùy chọn cũng phù hợp với phong cách và đối tượng trang web của bạn một cách hoàn hảo.

Đối với cách tải phông chữ tùy chỉnh lên WordPress, bạn có thể thực hiện nó bằng ba cách tiếp cận khác nhau:

  1. Chỉnh sửa tệp của chủ đề.
  2. Tải tệp của phông chữ lên thư mục của chủ đề.
  3. Sử dụng plugin phông chữ tùy chỉnh WordPress.

Bạn có bất kỳ câu hỏi nào về loại phông chữ bạn nên sử dụng trên trang web của mình không? Hãy nói về họ trong phần bình luận bên dưới!

Hướng dẫn miễn phí

5 mẹo cần thiết để tăng tốc độ
Trang web WordPress của bạn

Giảm thời gian tải của bạn thậm chí 50-80%
chỉ bằng cách làm theo các mẹo đơn giản.

Bài viết liên quan

Trả lời

Email của bạn sẽ không được hiển thị công khai.