When designing a website, one of the simplest and at the same time significant details, are the fonts or type of letters used. This gives a special style or appearance to any website. Of course, it’s necessary to choose a font that matches your WordPress template. In this case, it should be related to the purpose and content of the site; for example, if the site is a news portal, the best font type would be a classic style and elegant font. On the other hand, a children’s website should have cartoon-style fonts or those that are simply fun.
Before, only a few sources could be used on websites, since compatibility with different Internet browsers and operating systems weren’t as developed. If we wanted to use sources other than those that were compatible by default with most web browsers, then we had to upload the file with the fonts to our server. Luckily, at present, this has changed and now it’s possible to reference or import fonts that are not found on our website but on a server from an external provider.
Google Fonts in WordPress
One of the most popular and recognized providers of free online sources of excellent quality is Google Fonts. This service of the Internet giant offers us an extensive catalog of font sources. It’s possible to choose one or adapt more to our requirements and preferences, only by adding a few lines of code to the CSS. That way, it’s easy to use them to decorate the web pages, without major complications.
The first thing you should do is go to the corresponding website. There, you will select the type of font you want to use. Take its exact name, and add it to the following line of code @import url (http://fonts.googleapis.com/ css? family = Arial); where you must replace the word “Arial” with the title of the font you have chosen. In case the title is composed of several words, the blanks must be changed to the sum sign (+); otherwise you would be making a mistake in the code.
The location where you must place this line of code will be the style.css file of the WordPress template or theme that is active. To find the folder corresponding to this template, you must know the name of this template and go inside the location of the installation of WordPress on the server. Once there, continue to the path / wp-content / themes / and within this will be the different templates installed. The file that corresponds to the styles is usually located in a folder named Css.
However, it’s not necessary to search the file so much through the internal directories of the server, since the WordPress interface itself does not allow editing the files that make up the current template. In this case, go to the Appearance-Editor menu and in a simple editor of text shown to you, place the code indicated above.
Finally, it will only be necessary to indicate by CSS code in which parts of the web the type of font chosen will be used. Each design and each particular case will have its peculiarities, but, as the following example shows, see how to implement this font in the body of the website via the following code: Body {font-family: «Arial», Helvetica;} where the name of the font imported from Google (Arial) must be in quotes (“”); the second (Helvetica) is an alternative option in case it’s not possible to load the first.
