FontDeck font is not loading on site

[nick_hanabi]

First off, thanks for the amazing theme!

My first time using FontDeck or anything similar to host fonts. I am in the process of building a website and purchased Din Text Pro Regular to use (same as what flexform uses coincidentally). I’ve added it correctly to my site code in the Font Options spaces provided (I believe) and it shows up when I check the CSS code for each text element (h1, body, etc.), though it does not seem to be working, at least not on my end.

Not sure if being the developer I’m not supposed to be seeing this because it will count against my monthly allotted views, though this would be silly because I can’t properly view my site as a visitor would.

My site is ElevenSEO.com. The code I’ve added looks like this:

 

Standard FontDeck Font:

body, h6, #sidebar .widget-heading h3, #header-search input, .header-items h3.phone-number, .related-wrap h4, #comments-list > h4, .item-heading h1, .sf-button, button, input[type=”submit”], input[type=”reset”], input[type=”button”], input[type=”email”], .wpb_accordion_section h3, #header-login input, #mobile-navigation > div, .search-form input { font-family:”Din Text Pro Regular”, Verdana, sans-serif; font-size-adjust:0.5; font-weight:normal; font-style:normal; }

 

Heading FontDeck Font:

h1, h2, h3, h4, h5, .heading-font, .custom-caption p, span.dropcap1, span.dropcap2, span.dropcap3, span.dropcap4, .wpb_call_text, .impact-text, .testimonial-text, .header-advert, .wpb_call_text, .impact-text { font-family:”Din Text Pro Regular”, Verdana, sans-serif; font-size-adjust:0.5; font-weight:normal; font-style:normal; }

 

FontDeck JS Code:

<script type=”text/javascript”>
WebFontConfig = { fontdeck: { id: ‘32105’ } };

(function() {
var wf = document.createElement(‘script’);
wf.src = (‘https:’ == document.location.protocol ? ‘https’ : ‘http’) +
‘://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js’;
wf.type = ‘text/javascript’;
wf.async = ‘true’;
var s = document.getElementsByTagName(‘script’)[0];
s.parentNode.insertBefore(wf, s);
})();
</script>

 

Perhaps I am still missing something? I did not install the FontDeck plugin as there were no instructions to do so, and it would seem the above code additions would make it unnecessary.

Thanks so much for a great theme and for your assistance. My apologies if this question has been asked before- my initial search did not yield any similar queries.

Best Regards,

Nick of ElevenSEO.com

[Swift Ideas – Ed]

Hi Nick,

You’re welcome, glad you’re enjoying it!

The font css code that you add, should be the following for both sections:

div { font-family:"Din Text Pro Regular", Verdana, sans-serif; font-size-adjust:0.5; font-weight:normal; font-style:normal; }

We have code that changes the “div” to be the right selectors in the output. Can you confirm that’s what you’ve done?

– Ed

[nick_hanabi]

Hi Ed,

Thanks for the quick response. Originally, I did have that code for both css sections, but it was not working that way either so I assumed I needed to specify. I have just changed it to match what you sent below, but the font still does not load.

ElevenSEO.com is the site if you need to take a look. Let me know what you think I need to do.

Thanks

[Swift Ideas – Ed]

Hmm.. Code all seems ok. Do you have the domain added on FontDeck?

– Ed

[nick_hanabi]

Ok good to know that the code is ok on the site end. I do have the domain added on FontDeck and it is listed correctly (without the ‘www’).

Again, my first time using FontDeck so perhaps something needs to be enabled on their end still. I will contact them as this is more likely an issue on their end.

Thanks for the help Ed. I’ll post the solution whenever I figure it out to hopefully help someone else that this may happen to.

-Nick

[Swift Ideas – Ed]

Sure Nick, just comment again when you hear.

– Ed

[daniella.borges]

Hello,

I have the same problem. This problem appeared when I uptated my theme.

I tried some solutions:

1- Put the code “div.heading-text {font-family:”Din Text Pro Regular”, Verdana, Verdana, sans-serif ;font-size-adjust:0.5;font-weight:normal;font-style:normal;}” on the Panel on “Heading Font Deck Font”;

2- Put this code directly on style.css

3- Change this codes on style.css:

body, h1, h2, h3, h4, h5, h6 {
font-family: “Din Text Pro Regular”, Arial, Helvetica, Tahoma, sans-serif;
}

I saw on the Fire Bug that this font didn´t reload, the site use the second font, in this case, Arial.

Do you have other suggestion for me?

Thanks,

[Swift Ideas – Ed]

Can you provide a link to your site?

Please follow the guidelines strictly that is included in the steps/documentation.

– Ed

[daniella.borges]

Ed,

I followed this steps, but I need to pay Font Deck? To me, shows the value $12.50 per year.

Remember that I already had this font, but when I did the update this font was lost.

Thanks,

[Swift Ideas – Ed]

Hi there,

Not sure how you managed to have the font before, but yes you will need to pay to use FontDeck fonts.

– Ed

[daniella.borges]

Ok,

I will pay, and then I will test.

I will leave this ticket open until I fix this.

Thanks,

[daniella.borges]

Ed,

I bought the font but I have problems.

In Chrome the font doesn´t appear and in Firefox the font shows smaller than the demo.

See attached files.

Thanks,

[Swift Ideas – Ed]

Hi there,

Are you seeing the same on our demo though? The font will appear slightly different across different browsers. Make sure you’ve cleared your browser cache.

– Ed

[daniella.borges]

Hello,

In demo it´s ok. My cache it´s ok. This problem is that font doesn´t loading because appear other font instead of this. Appears “Helvetica”.

Thanks,

[Swift Ideas – Ed]

If you provide a link to the site I can try and help debug it.

– Ed