Simplest way to add google fonts to any WordPress site. Use CSS selectors to apply…
| Author: | vedathemes (profile at wordpress.org) |
| WordPress version required: | 4.9 |
| WordPress version tested: | 5.3.3 |
| Plugin version: | 1.5.0 |
| Added to WordPress repository: | 18-04-2019 |
| Last updated: | 25-11-2019
Warning! This plugin has not been updated in over 2 years. It may no longer be maintained or supported and may have compatibility issues when used with more recent versions of WordPress.
|
| Rating, %: | 0 |
| Rated by: | 0 |
| Plugin URI: | |
| Total downloads: | 3 225 |
| Active installs: | 700+ |
 Click to start download |
|
Don’t just limit your google or typekit (Adobe Fonts) customization to body and heading elements. Apply web fonts to any element of your website using CSS selectors. If you know CSS selectors, this plugin offers you the simplest and most efficient method to use google or adobe (typekit) fonts for your website.
What this plugin offers
- This plugin allows you to customize typography of any front-end element on your site.
- Apply google font to any element using css selectors (Content added by any theme or any plugin).
- Apply Adobe font (typekit) to any element using css selectors (Content added by any theme or any plugin).
- Create unlimited typography control in real time with just click of a button.
- Fast loading by efficiently enqueueing fonts using optimized http requests.
- Live preview of font changes on your website in realtime using the WordPress Customizer.
- Intutive UI makes it very simple to use google or typekit fonts.
Get Started
- After activating the plugin, visit Appearance > Customize in admin dashboard.
- Click on ‘Font Manager’ tab (probably at the bottom of all tabs).
- Click on “Create Font Control” button to create new control.
- Type comma separated css selectors of all target elements (elements you want to customize) in the textarea.
- Click on “Select a Font” button to find and select any google, typekit or websafe font.
- Search for a specific font or use filter button to filter the choices.
- Click on the selected font.
- If you chose a google font then you will be presented with an option to choose font weights.
- Choose required font weights (and italics variant) for your project and click “Add Font” button.
- Now you can see live implementation of your chosen font on your target elements.
- You can use “Next Font” or “Previous Font” button to change your choice.
- Click on the Gear button to customize other typography elements of your target elements.
- Check “Temporarily Highlight Elements” checkbox to make sure you have chosen correct elements.
- Implement your other font customizations and click [Publish] button.
How to Add Adobe Fonts (Typekit)
- Sing-in or create an Adobe ID at Adobe Fonts.
- Search or Browse typekit or Adobe fonts. Click on ‘</>’ icon to add fonts to your existing or new web project.
- Go to My Adobe Fonts > Web Project and find “Project ID”, which can be found next to the Project name.
- Copy “Project ID”.
- Go to the Plugin’s WordPress customizer section, and click on “Plugin Advanced Options”.
- Paste “Project ID” in the appropriate field and hit arrow icon.
- Now Adobe fonts (typekit) will be available for use immediately.