Web Fonts Loader

  • Version: 1.1
  • Active installations: 500+
  • WordPress Version: 5.0 or higher
  • Tested up to: 5.9
  • PHP Version: 7.2 or higher
Download…

Load the 20 most popular Google Fonts within your WordPress.

Apply them to the whole site or individually to each page or post content.

Usage

Once you install and activate the plugin, your editor toolbar will change, and you will see there are two new dropdowns with all available font options (see screenshots below).

The first one is for the font typeface, and the second is for font-weight and style.

Additionally, you can go to the Appearance > Fonts admin sub-menu and apply any of the available fonts to your whole site’s headings and body text.

Features

  • You can select from all available font variations and styles (100 … 900, italic, etc.) and you can use them to style your headings, blockquote, etc.
  • You can apply fonts to the whole site as well as a single page or post element via the editor (works only with the Classic Editor at this moment).
  • Very easy to use, with only a few clicks you can customize the font typeface, weight, and style of your page/post content.
  • All the fonts are loaded dynamically on a post/page basis using the Web Fonts Loader by Typekit so you can use different fonts on different pages and only the applied fonts will load up on the front-end.
  • Lightweight loading the fonts on the front end won’t affect you page loading speed.

Font Family: Roboto, Open Sans, Lato, Montserrat, Oswald, Source Sans Pro, Slabo 27px, Ralewat, PT Sans, Merriweather, Ubuntu, Nato Sans, Poppins, Playfair Display, Lora, PT Serif, Titillium Web, Arimo, Muli, Fira Sans

Font Variation: Roboto Condensed, Roboto Slab, Roboto Mono, Open Sans Condensed, Montserrat Alternates, Montserrat Subrayada, Source Serif Pr, Source Code Pro, Slabo 13px, Raleway Dots, PT Sans Caption, PT Sans Narrow, PT Serif Caption, Merriweather Sans, Ubuntu Condensed, Ubuntu Mono, Noto Serif, Playfair Display SC, Fira Sans Condensed, Fira Sans Extra Condensed, Fira Mono

Font Weight: Thin, Extra Light, Light, Regular, Medium, SemiBold, Bold, Extra Bold & Black

Font Style: Thin Italic, Extra Light Italic, Light Italic, Regular Italic, Medium Italic, Semi Bold Italic, Bold Italic, Extra Bold Italic & Black Italic

Tips and Tricks

How to use the plugin with the Classic Editor?

  1. Once you install and activate the plugin your Classic Editor toolbar will change and you will see there are two new dropdowns with all available font options (see screencast and screenshots).
  2. The first one is for the font typeface and the second one is for font weight and style.
  3. Additionally, you can go to the Appearance > Fonts admin sub-menu and apply any of the available fonts to your whole site’s headings and body elements.

FAQs

Use the Support tab on this page to post your requests and questions.

All tickets are usually addressed within 24 hours.

If your request is an add-on feature, we will add it to the plugin wish list and consider implementing it in the next major version.

Does it work with WordPress Gutenberg blocks?

Currently, the plugin doesn’t support blocks. However, we have plans to add this functionality soon.

If you still wish to use the plugin, you can use the Classic Editor or apply only the global fonts under the options page.

How do I apply a font to all the contents for a certain page or post?

Select your desired font typeface with style without selecting anything inside the editor.

How do I apply font only to a leading paragraph or a heading?

Just double click on the element text (this will select the full text for that element) and then apply your font typeface or weight & style.

How do I see what typeface or style is applied to an element?

A single click on any element, and if there is an applied Google font or style, you will see the Toolbar sections change.

How can I apply font or style to the whole site?

Go to the Appearance > Web Fonts in your WordPress admin menu bar, and then you will see all the available options you have.

Note: these global fonts will be overwritten if you apply fonts and styles to individual elements via the Classic Editor editor.

Screenshots

In the screenshots below, we highlight the primary way to use and access the plugin within WordPress.