Would you like to add custom fonts to WordPress?
Believe me, the police also a very big role to play on your blog and you will gain a lot by adding a font adapted not only to the context of your blog, but also to your WordPress theme.
In this tutorial I will show you how to add custom fonts to your WordPress blog using Google Fonts, Typekit And CSS3.
The use of custom fonts in WordPress themes has become common. In fact, there are several WordPress themes which offer several fonts to choose from. However loading all these fonts at the same time can considerably slow down the loading of a page.
And if your blog is slow, I suggest you Some solutions to performance issues on WordPress
This is one of the reasons why we are going to do it the right way, uploading only the custom font we want to use on the blog.
But first of all, it is first important to know how to search for fonts while also consulting the 7 WordPress plugins to take in hand the typography of your blog
How to find fonts and how to use them on WordPress
Fonts are not as scalable as they used to be. However, there are several sources where you can find fonts such as " Google Fonts "," Typekit "," FontSquirrel " and " Fonts.com ».
How to add a Google Fonts font to WordPress
Google Fonts is a very large library of free fonts that you can use in several projects.
All you need to do is access " Google Fonts And select the font of your choice. Then click on " select this font »A tab appears at the bottom right of your screen.
Click on this tab which expands as in the image above. You will be able to customize the style of the font to include by clicking on Customize. You only have to select the style you want to see on your blog.
You should then scroll down to the " Embed ". You will then need to copy the code located in the section " STANDARD ". It is this code that you can add on the " header Of your child theme.
That's all there is to add a new Google Font to your WordPress blog.
How to add a font using TypeKit
Typekit is another free and premium service that offers fonts that you can use also in your different projects. They offer premium subscriptions and free subscriptions.
You just need to have a Typekit account and create a new " Kit ».
You will then have to select the font from the Typekit library and add it to your project. After that, grab the code for your kit and add it from your dashboard.
To add it to your dashboard, you simply need to install and activate the plugin " Typekit Fonts for WordPress ».
After its activation, you simply need to access the " Settings> Typekit Fonts And paste the code from your kit into the " Custom CSS rules ».
The font can then be used in the same way, that is to say by specifying the name of the family for specific elements or for the whole document.
How to add a font using the CSS3 (@ font-face)
The most direct way to embed a font in your blog is to add it using "font-faces" via CSS3. This method allows you to add any type of font you want on your blog.
The first thing to do is to download the font of your choice in web format. If you don't have this font in web format, then you can convert it for free at " FontSquirrel Webfont Generator ».
Once you have the files in the format " websites », You will then have to send them directly to your server. I strongly recommend that you add it to the " fonts Of your child theme using an FTP client (fileZilla Is my recommendation).
If you want to go further in this procedure, see our tutorial on How to use FTP on Windows 10
Let's go back to our goal.
Once it's done, you can integrate the font like this:
To use it anywhere, you will simply need to define the name of the font as you specified in the " bottom-face »Previous (see value of the font-family attribute ).
That's all there was to know about using CSS3 code. However, I must specify that the method with the "font-face" functionality is more suitable for developers.
Other solutions and tools are also used and recommended to manage or manipulate the fonts on your website.
Discover also some premium WordPress plugins
You can use other WordPress plugins to give a modern appearance and to optimize the handling of your blog or website.
We offer you here some premium WordPress plugins that will help you do that.
1. CommentPress
CommentPress is a powerful WordPress compact plugin that lets you insert, edit and delete comments quickly and easily. CommentPress uses Ajax, jQuery and PHP to give visitors the ability to insert comments without having to reload the page.
This plugin has many customization options, in order to give it the look and appearance you want. It has a captcha to block spam and gives your comment section more security.
Its main features are: the easy insertion of comments, the possibility for users to reply to specific comments, the pagination of comments, complete management of the administration of the comments section, buttons for easy insertion of images, videos and links, a fully responsive layout, a Captcha to secure the form and avoid spam, and much more.
Download | Demo | Web hosting
2. Everest Gallery
As its name suggests, it is the pinnacle of WordPress plugins photo gallery premium. This ultra-customizable tool will allow you to create galleries of any style in just a few minutes.
Everest Gallery can be used to showcase articles, custom post types, custom taxonomies/categories, WooCommerce products, personalized products, image galleries and attachments, videos, product features, customer showcase, portfolios, team members, screenshots, etc…, fully responsive.
Everest Gallery comes with full documentation, and more than 30 options to completely customize the look of the gallery. With the customization options available, you can use this WordPress Plugin to present anything easily and effectively.
Download | Demo | Web hosting
3. WP Media Manager
WP Media Manager is one of the best and most powerful WordPress plugins media library management. It is great at managing folders and its ease of use lets you organize your thousands of media files.
Just use the drag and drop method to insert the media files into folders / subfolders. This ability not only allows him to improve file management, but also allows him to manage folders. Which is generally a must have for novice users.
Ce WordPress Plugin has features such as creation of folders, filtering of these, 3 magnificent responsive galleries, possibility of duplicating files, creation of an unlimited hierarchy and many others…
Download | Demo | Web hosting
Other recommended resources
Go further in using custom fonts in WordPress by also consulting the links or recommended resources below.
- How to Add Keywords and Meta Descriptions in WordPress
- How to add an impressive typography with Typekit
- 7 WordPress plugins to add a slider to a blog
- 8 WordPress plugins to add a translation system on a blog
- Other Resources:
- List of essentials for starting a blog
- 14 WordPress Plugins Elementor Can Replace
- Elementor Pro Price 2023: Which Plan is the Most Profitable for You?
- How to Create and Display Popup by Post Tag in WordPress
- Best Free Elementor Addons in 2023
- How to create a custom font for your WordPress blog
Conclusion
So ! That's it for this tutorial on the best way to add custom fonts to WordPress. If you have any suggestions or comments, they will be welcome.
However, you will also be able to consult our resources, if you need more elements to carry out your projects of creation of Internet sites, by consulting our guide on the WordPress blog creation or the one on Divi: the best WordPress theme of all time.
N'' do not hesitate to share it on your different Social Media. If you have some Comments or suggestions, do not hesitate to tell us in the section reserved for these.
...
