Install Google Fonts in WordPress it's a good way to mejorar el diseño de tu Web y hacer el contents más legible. En este tutorial te decimos cómo.
What is Google Fonts?
Google Fonts is a service of Google which, since 2010, has been in charge of facilitating access to a good number of web fonts (more than eight hundred fonts) for free.
What is this about web fonts?
The typography of a website refers to:
- The letters (a, b, c, d, e ...)
- The numbers (1, 2, 3, 4, 5, 6, 7, 8, 9, 0)
- Y los caracteres especiales (@, #, €, &, =, ¿, *…)
That are part of content as text on a page. These items when they belong to the same family, or to the same font type, have a close relationship and aesthetic correspondence.
At first the typography depended exclusively on the browser (web browser). In such a way that designers and webmasters they couldn't influence on the choice of font.
That is why most of the texts on the web pages were shown in:
- Times New Roman
- Arial
- Georgia
- Garamond.
And some Internet users with a good memory will even remember texts from certain websites in Comic sans (yes, the nemesis of the designers).
In such a way that in those years the options they were limited.
Because for a font or typeface to be deployed in the browser it had to be installed on the computer.
CSS2 appears
With the arrival of CSS2 se abrió el abanico de opciones. El CSS2 permitía a los browsers webs download fonts to the browser. Thus eliminating the prerequisite of:
A font or typeface is displayed in the browser only when it is already installed on the computer.
Why install Google Fonts in WordPress
In some cases the general appearance of a website depends largely on the typography.
Incredible as it may seem. Beyond the other design items that are important. In certain specific cases, such as on those websites where the bulk of the content is consumed via text, typography can work real miracles.
In such a way that with Google Fonts we can get very close to that design that we have in our head. And that despite going around a thousand times with him page builder, to date we have not yet been able to get close.
A suitable source at the same time can improve readability of our texts. This increases retention and improves our numbers for Google and the SEO.
How to install Google Fonts in WordPress
For install Google Fonts or a font hosted on this service there are many methods.
But before installing a web font via Google Fonts conviene que elijas una fuente que haga brillar tus textos. Dicho de otra forma, una fuente que be atractiva y fácil de leer.
Once the font is chosen, we get to work.
1. Installing Google Fonts without plugins or tools
Once we have chosen our font in Google Fonts, we copy the web code of that font.
We will work with Raleway. And this is your code:
<link href=’http://fonts.googleapis.com/css?family=Raleway’ rel=’stylesheet’ type=’text/css’>
So in our WordPress dashboard we follow the following route:
Appearance> Editor> Header*
* The name of our header or header in the editor may vary according to the topic.
Warning:
Remember that modifying the code of our WordPress installation can be harmful. Before modifying something remember create a backup.
So we copy the source code from Google Fonts and we paste it between the labels: and
Here you paste code from the Google Fonts font
You keep changes and almost done.
Now you just need to invoke the font you just installed.
To do this, follow the following route:
Apariencia > Personalizar > CSS adicional
Paste the following code:
html * { font-family:’Raleway’ !important; }
Remember that the name of the font family It will vary depending on the type of font you are installing.
You keep changes and voila.
We already have a new font installed via Google Fonts.
2. Installing Google Fonts with the help of plugins
The easiest way to install fonts Google Fonts In WordPress (and in some cases the most recommended), is using plugins.
In this section the options are varied since there are countless plugins that are responsible for importing the sources from Google Fonts to your WordPress website.
One of the most used is Easy Google Fonts.
Although the other plugins use the same principle.
- Instalas el plugin
- You follow the following path: Appearance> Customize
- A will appear typography option
- Select the source as you like.
- Save the changes and voila.
Now you have custom fonts via Google Fonts on your WordPress website.
Did you like the tutorial?
Do you want to continue learning about WordPress?
Well, you're in luck.
If you want to be a expert in web development and everything related to the world of WordPress sign up for best online course in Spanish from the best content manager: WordPress.org
