Enable custom FONT general via child theme

Hi Yigit,
thanks a lot. This link I followed. But as far as I understod I have the font then only in the dropdowns of advanced styling. Where can i set the standard text another font?
How can I add additional fonttypes like my_h1_style my_h2_style ?
Thanks a lot for your help.

Greetings
Michael

Hi Yigit,

thanks with help of some other topics I got it basically work. I defined the h1 with

    h6 { 
    font-family: 'freightbigmediumregular'; 
    font-size: 22px; 
    line-height: 24px; 
    letter-spacing: 20px;
    color: #373737 !important;
    text-transform: none !important;
    font-weight: normal !important;
    }  

and also own stylel i.e.

    FS6 { 
    font-family: 'freightsansbook'; 
    font-size: 16px; 
    line-height: 24px; 
    letter-spacing: 20px;
    color: #C8C8C8 !important;   
    text-transform: none !important;
    font-weight: normal !important;
    } 
    
    FS7 { 
    font-family: 'freightsansbook'; 
    font-size: 14px; 
    line-height: 16px; 
    letter-spacing: 0px;
    color: #AAAAAA !important;  
    text-transform: none !important;
    font-weight: normal !important;
    } 
    

But now I have a problem with using my own styles i.e. FS7.

I tried two variantions:

1) Add the own style row in functions.php

//Enable ALB Style
add_theme_support('avia_template_builder_custom_css');

When I write here FS7 inside it doesn’t work.

2) In the editor by default it can’t be selected, so I tried to use them manually:

sdfsdfsdfsdf

<FS7>sdfsdfsdfsdf</FS7>

When saving or preview it, it’s working:
http://pasteboard.co/1c7wMAfI.jpg
But with next edit or save or switch from “Text” to “Visual” it’s again a <p> style and styles has to be edited every time by new.
I also deactivated the tinymce to run origin wordpress editor with same effect.

Any idea how to fix this issue?

Thanks a lot !
Greeetings
Michael

Hi Josue,
thanks for your reply. This just have tried.

The Problem is, that with span it doesn’t work.

I show you:

[av_textblock size='' font_color='' color='' custom_class='fs3']
<p class="fb1">neuer text</p>
<p>nur p text</p>
<fs1>fs1 rwyr</fs1>
<fs2>fs2 rwyr</fs2>
<span class="fs7">SPAN FS7</span>
<span class="fs1">SPAN FS1</span>

<span class="fs3">sdfsdfsdfsdf </span>sdfsdfsdfsdf
[/av_textblock]

[av_textblock size='' font_color='' color='' custom_class='']
<fs3">SADSDdsaADFAFD

<fs5">sdfsdfsdfsdf
sdfsdfsdfsdf
[/av_textblock]

That’s the result:

http://pasteboard.co/1dGzqH6R.png

URL
http://madlener.wom.server49.vorschauseite.eu/tinymce/

It’s also strange that the custom CSS class from ALB doesn’t work as well. Or do I have do define the class in an other way?

    fs1 { 
    font-family: 'freightsans_lightregular'; 
    font-size: 48px; 
    line-height: 57px; 
    letter-spacing: 0px;
    color: #373737 !important;
    text-align: center;
    text-transform: none !important;
    font-weight: normal !important;
    }

Thanks for your help !
Greetings
Michael

Hi Josue !!

I’m getting crazy !!! THIS WORKS…a single DOT consumed me 4 or more hours !!!!

For all others also want to use own additional styles also in TinyMce advanced I want to share the proceduere, to save the time for other users.

1) Define the fonts with font-face.
Follow this easy steps:
http://justcreative.com/2013/01/22/how-to-use-custom-fonts-with-font-face-on-wordpress/

2) define your own, not heading, fonts with

 myfont { 
    font-family: 'MYFONTFAMILY'; 
    font-size: 48px; 
    line-height: 57px; 
    letter-spacing: 0px;
    color: #373737 !important;
    text-align: center;
    text-transform: none !important;
    font-weight: normal !important;
    }

.

3) Install Plugin TinyMce advanced profesional Styles and define the fonts with your name as seen in the screenshot:
http://pasteboard.co/1eVO6dx1.png

4) Then you get in TinyMce at Formats the styles as defined:
http://pasteboard.co/1eVWGBlc.png

5) use the styles :-)

Hint: You won’t see the styles in the editor, but you can check in the HTML code:
http://pasteboard.co/1eW1Xxes.png
<p><br /><span class="fs1">FS1</span><br /><br /><span class="fs2">FS2</span><br /><br /><span class="fs3">FS3</span><br /><br /><span class="fs4">FS4</span><br /><br /><span class="fs5">FS5</span><br /><br /><span class="fs6">FS6</span><br /><br /><span class="fs7">FS7</span><br /><br /><span class="fs8">FS8</span></p>

Afterwards the new fonts should be seen like in this example:
http://pasteboard.co/1eWaau9U.png

Have luck and thanks for great support from ENFOLD !!

Greetings
Michael