Home Forums Air WordPress Theme Using a different font

This topic contains 13 replies, has 4 voices, and was last updated by  BWSM 3 months, 1 week ago.

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #14793

    benconnolly
    Participant

    I’m trying to use Futura Heavy font for my headings and body text.

    How do I do that? (The FAQ topic wasn’t clear enough for me).

    #14794

    BWSM
    Keymaster

    Hi,

    The Futura Heavy font is not form Google fonts, is it? You need define the font by css:

    Step 1. Please upload the font files(like: otf, woff2, maybe there are other format…) to your web site space by FTP

    Step 2. Define the font by CSS @font-face, you can write the css-code into “Appearance > Customize : Additional CSS” or CSS file of child theme, the CSS code is a sample, you can refer your font Doc(if it has).

    @font-face {
        font-family: TheFontName; font-weight: normal; font-style: normal; 
        src: url('http://yoursite.com/styles/fonts/TheFontName.woff') format('woff'),url('styles/fonts/Inconsolata-Regular.ttf') format('truetype');
    }

    Step 3. Assign the fonts by css”Appearance > Customize : Additional CSS”:

    /* Heading font */
    body.single .title-wrap-tit,.title-wrap-h1, .archive-grid-item-tit,.title-wrap-meta-a,.archive-grid-item-meta-item,h1,h2,h3,h4,h5,h6 {font-family: 'TheFontName';}

    /* Body text */
    body,.single-portfolio-fullscreen-slider .owl-dot.active{font-family: 'TheFontName';}

    /* Menu */
    .navi-trigger-text, #navi-header a,.header-bar-social .socialmeida-a,#navi a {font-family: 'TheFontName';}

    ——–
    TIPS: If you use the default font like “Arial”, please ignore step1-2, assign the fonts as step3 like:
    body { font-family: arial, helvetica, sans-serif; }

    ——-
    Common safe system fonts:
    Arial => font-family: arial, helvetica, sans-serif;
    Helvetica => font-family: helvetica, sans-serif;
    Times => font-family: “Times Roman”, times, serif;
    Times New Roman =>font-family:”Times New Roman”, “Times Roman”, TimesNR, times, serif;

    Regards!
    Bwsm – uiueux.comTwitterFacebook

    • This reply was modified 8 months, 3 weeks ago by  BWSM.
    #15996

    processstudios
    Participant
    This reply has been marked as private.
    #16002

    BWSM
    Keymaster

    Hi, processstudios
    Yes, sure.
    Please send your question and wp-admin(url/user/pass) to uiueux@gmail.com, I’ll log in to check it.

    #16236

    ngh654
    Participant

    Hello,

    I’m trying to use a different font for different headings. I have installed google fonts and have Oswald as the heading font family, however I want a different font for heading 4.

    I’m new to wordpress and websites in general so don’t really know what I am doing, any help would be greatly appreciated!

    #16239

    BWSM
    Keymaster

    Hi,

    Please use the css(“Appearance > Customize : Additional CSS”):

    @import url('https://fonts.googleapis.com/css?family=Oswald');
    .entry h4,.text_block h4,.ux-portfolio-template-intro h4{ font-family: 'Oswald', sans-serif; }

    I don’t know if you link the Oswald font css, if not work please leave your page URL.

    Regards!

    #16245

    ngh654
    Participant
    This reply has been marked as private.
    #16253

    BWSM
    Keymaster

    Please notice:

    Please use the css(“Appearance > Customize : Additional CSS”):

    Not:

    Appearance>Customize>Typograhpy>Default Typography

    • This reply was modified 3 months, 1 week ago by  BWSM.
    #16307

    ngh654
    Participant
    This reply has been marked as private.
    #16311

    BWSM
    Keymaster

    Please update the css:
    .entry h1,.text_block h1,.ux-portfolio-template-intro h1{ font-family: 'Oswald', sans-serif;}
    update as:
    body .entry h1,body .text_block h1,body .ux-portfolio-template-intro h1{ font-family: 'Oswald', sans-serif; }

    #16327

    ngh654
    Participant
    This reply has been marked as private.
    #16334

    BWSM
    Keymaster

    Refer:
    body .entry h1,body .text_block h1,body .ux-portfolio-template-intro h1{ font-family: 'Oswald', sans-serif; font-size: 20px; font-weight: bold; font-style: italic;}

    https://www.w3schools.com/cssref/pr_font_weight.asp
    https://www.w3schools.com/cssref/pr_font_font-style.asp
    ps:
    Some value(font-weight and font-style ) depends if your fonts support.

    • This reply was modified 3 months, 1 week ago by  BWSM.
    #16336

    ngh654
    Participant
    This reply has been marked as private.
    #16343

    BWSM
    Keymaster

    1.Appearance > Theme Options > Font settings: Portfolio List : Title for Item

    2. Edit the portfolio page, enable “Hide Category”

    Please open new ticket for new questions.

Viewing 14 posts - 1 through 14 (of 14 total)

The topic ‘Using a different font’ is closed to new replies.

Join Newsletter(FREE)

Subscribe to our newsletter to receive news & updates. We promise to not spam you, super promise!