Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1401921

    Customer requests that I use a google font for text and headers (no problem). At the same time they require that I use another font as an overlay on some content sections and/or sliders. I can only assign one font as header font. Is there a workaround that enables me to use another header font for say a H1 or H2 tag so that I can choose?

    #1401973

    Hey Pierre,

    Thank you for the inquiry.

    You can define a different style for a specific element in the Enfold > Advanced Styling panel, but if you want more control over the styles of the elements, you can register another font manually using the @import rule in the style.css file or by using one of the available hooks such as wp_enqueue_scripts.

    Example of the @import:

    @import url(https://fonts.googleapis.com/css?family=Lora);
    @import url(https://fonts.googleapis.com/css?family=Oswald);
    

    Example using the hook:

    function ava_add_google_fonts() {
    
    wp_enqueue_style( 'wpb-google-fonts', 'https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,700,300', false ); 
    }
    
    add_action( 'wp_enqueue_scripts', 'ava_add_google_fonts' );
    

    You will then have to apply the font manually to the elements using css.

    There are also plugins available:

    // https://wordpress.org/plugins/olympus-google-fonts/
    // https://wordpress.org/plugins/local-google-fonts/

    You can choose fonts from Google Fonts (https://fonts.google.com/).

    Best regards,
    Ismael

    #1401983

    Thank you for your reply. I installed CSS hero and my problem is solved.

    #1401988

    Hi pierrevanlier,

    We’re glad to hear that :)
    Thanks for using Enfold and have a great day!

    Best regards,
    Nikko

Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Two different fonts for headers’ is closed to new replies.