[ZeshanMember]

Hi Caity,

Upon checking, it seems you haven’t added the code in your child theme’s style.css file, provided in our first response (see: http://prntscr.com/57mnpg).

Please add the font using the code provided and you should be able to use the font in the customizer.

Thanks!

[caity721Participant]

Hey!

Thank you for the help. It looks like I had added the css code in the wrong section. I added it in the correct section, I updated the CSS code in customizer and added the code to the VC style inline option. Any other ideas?

Thank you!

[ChristianModerator]

Hey Caity,

Would it be ok if you give us all the steps you took and details about what font and where exactly you placed them so we can easily see why the font doesn’t work?

Thanks.

[caity721Participant]

OK so I downloaded the font which is called BombshellPro, I placed the font files in webroot/WP-Content/Themes/X-Child-Icon/Fonts (I created the Fonts folder)

I have a .woff, .ttf, .eot and .wof2 file in the folder for the BombshellPro font

I reached out to you guys and placed the code in my style.css, added the additional code into customizer and then placed the code into my content.

[caity721Participant]

Thank you 🙂

[Paul RModerator]

You’re welcome. 🙂

[caity721Participant]

Do you have any ideas on why it might not be working?

[Paul RModerator]

Hi Caity,

Please replace the code in your child theme style.css to this.

@font-face {
  font-family: 'BombshellPro';
  src: url('Fonts/BombshellPro.eot');
  src: url('Fonts/BombshellPro.eot?#iefix') format('embedded-opentype'),
       url('Fonts/BombshellPro.woff') format('woff'),
       url('Fonts/BombshellPro.ttf')  format('truetype'),
       url('Fonts/BombshellPro.svg#svgFontName') format('svg');
}

Thanks

[caity721Participant]

Ahh It’s still not working 🙁

Any ideas?

[caity721Participant]

I’m specifically trying to change it for headlines.. maybe that has something to do with it?

[ChristopherModerator]

Hi there,

Please try to add this in CSS:

@font-face {
  font-family: 'BombshellPro';
  src: url('Exact path to font folder/BombshellPro.eot');
  src: url('Exact path to font folder/BombshellPro.eot?#iefix') format('embedded-opentype'),
       url('Exact path to font folder/BombshellPro.woff') format('woff'),
       url('Exact path to font folder/BombshellPro.ttf')  format('truetype'),
       url('Exact path to font folder/BombshellPro.svg#svgFontName') format('svg');
}

And add this to assign this font to Headlines.

.h-custom-headline{
font-family: 'BombshellPro';
}

Hope it helps.

[caity721Participant]

OK so it’s working in the sense that it’s changing the font so I’m pretty sure all of the cose is correct and working. It’s just not changing it to the font that I have downloaded, it looks like it’s just putting in a default font instead. Do you think there is something wrong with the font file? Is there anyway to test that?

Thanks!
Caity

[ChristopherModerator]

Hi there,

Instead of ‘Exact path to font folder’put the font path of your font folder for example :http://flowersbykatydid.com/wp-content/themes/your child theme or theme /folder where you added fonts/.

Hope i made it clear.

Thank you.

[caity721Participant]

OMG! It worked. I LOVE YOU!!!

THANK YOU!

[RubinKeymaster]

You’re welcome!

[Author]

Posts