Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • December 17, 2017 at 1:48 pm #889777
    thrashin

    Hi Guys,

    My client wants to use a typewriter font for the body font for the site, but there are only a limited number of Google fonts available for this in the General Styling Theme Section. Am I able to add google fonts, to make them available?

    I wanted to try out “TC American Typewriter™” and “TC American Typewriter™ Hellenic” fonts, but may want to try others.

    Is this possible?

    Cheers,

    Adam.

    December 17, 2017 at 1:59 pm #889778
    thrashin

    Actually, the two above fonts are not google fonts, but externals fonts.. there are a couple of Google fonts that might work: https://fonts.google.com/specimen/Special+Elite

    But I am just keen to understand if I can expand the font options, please.

    Thanks.

    Adam.

    December 17, 2017 at 5:28 pm #889798
    Mike

    Hi,
    If the fonts are on google.com/fonts you can add them to enfold list using a function.

    add_filter( 'avf_google_heading_font',  'avia_add_heading_font');
function avia_add_heading_font($fonts)
{
$fonts['Alef'] = 'Alef';
return $fonts;
}

add_filter( 'avf_google_content_font',  'avia_add_content_font');
function avia_add_content_font($fonts)
{
$fonts['Alef'] = 'Alef';
return $fonts;
}

    If it is a custom self hosted font it will not appear in enfold settings. You have to upload the fonts to your server and add font styles using custom css like

    h1 {
     font-family: ‘custom-font’;
}

    An alternate solution is to use the plugin and the plugin allows you to select the html tags and assign the font styles.
    Use Any Font

    Best regards,
    Mike

    December 17, 2017 at 10:45 pm #889835
    thrashin

    Hi Mike,

    Thanks for the info, that almost gives me what I need, but I have a couple of other questions;

    1. For a google font, where is this function added? Is it in the Theme settings somewhere?

    2.  For a custom self hosted font, you say I need to upload it to my server – but where on the server do I load it, and what specific file do I load? Is it like a .ttf file?

    3. The custom css for the self hosted font – where would I enter this?

    Many thanks,

    Adam.

    December 17, 2017 at 11:04 pm #889841
    Mike

    Hi,
    1. The function is added at the end of your functions.php file in Appearance > Editor or via FTP
    2. You can upload the file to the wp-content\uploads\yourfont\ folder, typically it will be a group of files such as .ttf & .woff & others. When you download the font it comes with instructions on the folder to upload and the code to add.
    3. Your custom css should be added to your child theme css or in the General Styling > Quick CSS field if your using the parent theme.
    You may find using Use Any Font easier.

    Best regards,
    Mike

    December 18, 2017 at 2:04 am #889877
    thrashin

    Hi Mike,

    I added the code as suggested to the functions.php file as suggested, first using my font name in place of “Alef”, and then using your example directly (which is currently still in the functions.php file), and neither of them worked to make the font available to me in the ENFOLD THEME OPTIONS / GENERAL STYLING / FONTS / Defines the Font for your body text.

    I’d prefer to do it this way, rather than install another plugin, but can look at that if need be.

    Cheers,

    Adam.

    • This reply was modified 7 years, 2 months ago by thrashin.
    December 18, 2017 at 9:48 pm #890260
    Yigit

    Hi Adam,

    Have you referred to this post – https://kriesi.at/documentation/enfold/register-additional-google-fonts-for-theme-options/? If you have, please create temporary admin logins and post here privately so we can look into it.

    Best regards,
    Yigit

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.