Can I use Google font "Cormorant Infant" in the Scribe theme?

When I go to "Theme Text Fonts" and try to choose the Google font "Cormorant Infant" the dialog box says "No results match 'Cormorant Infant.' " Are the only fonts available to use with this them the ones that show in this dropdown menu? Also I pasted at the top of the global CSS this code:
/* cormorant-infant-regular - latin */
@font-face {
font-family: 'Cormorant Infant';
font-style: normal;
font-weight: 400;
src: url('../fonts/cormorant-infant-v3-latin-regular.eot'); /* IE9 Compat Modes */
src: local('Cormorant Infant Regular'), local('CormorantInfant-Regular'),
url('../fonts/cormorant-infant-v3-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('../fonts/cormorant-infant-v3-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
url('../fonts/cormorant-infant-v3-latin-regular.woff') format('woff'), /* Modern Browsers */
url('../fonts/cormorant-infant-v3-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
url('../fonts/cormorant-infant-v3-latin-regular.svg#CormorantInfant') format('svg'); /* Legacy iOS */

However this did not make the font available.
Can you let me know how to do this? Or let me know if this is not possible with this theme?

Thanks for your help!


  • Adam Czajczyk

    Hello Cecile,

    I hope you're well today and thank you for your question!

    I have checked that on my setup and it looks like this font is not available in Upfront (as a result in its child themes such as Scribe too). I admit I'm not sure how Google Fonts are fetched and if they are "hard coded" (pre-defined) or fetched "live" from Google so I have asked Upfront developers and I'm awaiting their replay. I'll let you know once I got that information.

    As for workaround for that. The code that you added would work only with fonts that you got access to font files. Google Fonts are hosted externally and they should be embedded in a different way. In case of Upfront that's even a bit more complex. The "workaround" solution would be to use a simple MU plugin. Here's what to do:

    1. create an empty file with .php extension (e.g. "my-cormorant-infant-font.php")
    2. put this code into the file using a "clean text" editor (such as e.g. Notepad++, Sublime or similar):

    function wpmu_include_cormorant_infant_font() {
    	echo '<link href="" rel="stylesheet">';

    3. Using FTP or CPanel's "File Manager" upload that file into the "/wp-content/mu-plugins" folder on your server; if there's no "mu-plugins" folder inside "wp-content", create it.

    Now you can use the font in Scribe, although it will not be available in any drop-down font selection box. You may however use CSS to assign it to an elment on the page by editing element preset's CSS (Edit CSS button on preset edit screen for selected module). The rule to assign that font to an element is

    font-family: 'Cormorant Infant', serif;

    For example, if you put a "Text module" on page and would like to affect the "paragraph" format test, the CSS to be added to the preset CSS would be:

    .plain-text-container p {font-family: 'Cormorant Infant', serif;}

    I hope that helps :slight_smile:

    Best regards,

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.