Would like to fix broken font, but how?

ChancyRat

I have Buda and Frederika the Great Google fonts identified in Advanced Customization, but to my surprise most sections of the site are now reverting to yucky fonts. Overall the problem appears to be loss of the Buda font?

In the image:
GREEN Frederika the Great is still good.
BRIGHT YELLOW and PINK for broken/missing Buda.

I would appreciate pointers to what I should change to fix these? I see there is a mixture of block types (text, menu, and HTML).

This image is from the home page, but an HTML block that is broken can also be seen on:
https://www.joinrats.com/ModifyBehavior/Biting-Rats/

THANKS.

Hikin' Mike

Looks like you are using 'Buda' and 'Frederika the Great' as your SmugMug fonts. I'm also seeing @font-face for 'Buda' which is some how removing 'Buda' on my old XP machine running Firefox, but looks fine using Chrome. I suggest removing the @font-face code and all instances of 'Buda' because it isn't needed.

@font-face {
font-family: 'Buda';
font-style: normal;
font-weight: 400;
  src: 
     url(http://themes.googleusercontent.com/static/fonts/buda/v3/xpKVHc19vcKaqMGd7JtK-A.eot?#iefix) format('embedded-opentype'),
     url(http://themes.googleusercontent.com/static/fonts/buda/v3/3N6IHhwL9GuAVU1WX0Z9CA.woff) format('woff'),
     url(http://themes.googleusercontent.com/static/fonts/buda/v3/In5nPPB6p1Mco64syFRrYQ.ttf) format('truetype');
}

/* Change the navbar fonts */
.sm-page-widget-nav-toplink, 
.yui3-menu-item .yui3-menu-label,
.sm-page-widget-nav-toplink > a {
  font-family: 'Buda' !important;
  font-size: 16px !important;
  color: #000000 !important;
}

/* ==============================
   = TOP NAVBAR, SUB-MENU CODE  =
   ============================== */
/* Change the way the sub-menu bar looks */
.sm-page-layout-region-top .yui3-menu-item .yui3-menu-label {
  font-family: 'Buda' !important;
  padding: 3px 5px 2px 5px !important;
  font-size: 14px !important;
  border: 1px solid rgba(161,203,223,0.9);
  border-bottom: 1px solid #A1CBDF !important;
  background-color: #FFFFE0 !important;
}

ChancyRat

Oh HI MIKE!
Sorry, I did not see you answered... dgrin didn't send me email that someone responded ... confused about that too now...
I hope you are well.
Okay, I'll take a look at this. It's been a while since I delved into Code, and not being a Code Person, I suspect I'm going to suffer the pain of code amnesia.
I take it you are saying these changes are to be made within the Advance Customization section. Only. (Don't think I have Buda anywhere else, actually.)
I'm sure there was a reason I had to add the code you're telling me to remove... but ... well ... exploration ahead!
I should have mentioned I'm on Win7 and Win10 on two different machines, and this font problem shows on both on Chrome and Firefox.
Are you saying you got the font errors on just XP on Chrome?

In the meantime, backing up my site via Sherlock Wizard tool: https://www.sherlockphotography.org/Customisations/SmugMug-for-Chrome/Backup

Hikin' Mike

I take it you are saying these changes are to be made within the Advance Customization section. Only. (Don't think I have Buda anywhere else, actually.)
I'm sure there was a reason I had to add the code you're telling me to remove... but ... well ... exploration ahead!

Yes, the code I posted will be in your Theme's custom CSS.

I should have mentioned I'm on Win7 and Win10 on two different machines, and this font problem shows on both on Chrome and Firefox.
Are you saying you got the font errors on just XP on Chrome?

The only computer I have runs WP. When I use Firefox the font doesn't work. When I use Chrome, it looks fine.

ChancyRat

"The only computer I have runs WP. When I use Firefox the font doesn't work. When I use Chrome, it looks fine."
WEIRD!

ChancyRat

@Hikin' Mike said:
Looks like you are using 'Buda' and 'Frederika the Great' as your SmugMug fonts. I'm also seeing @font-face for 'Buda' which is some how removing 'Buda' on my old XP machine running Firefox, but looks fine using Chrome. I suggest removing the @font-face code and all instances of 'Buda' because it isn't needed.

@font-face {
font-family: 'Buda';
font-style: normal;
font-weight: 400;
  src: 
     url(http://themes.googleusercontent.com/static/fonts/buda/v3/xpKVHc19vcKaqMGd7JtK-A.eot?#iefix) format('embedded-opentype'),
     url(http://themes.googleusercontent.com/static/fonts/buda/v3/3N6IHhwL9GuAVU1WX0Z9CA.woff) format('woff'),
     url(http://themes.googleusercontent.com/static/fonts/buda/v3/In5nPPB6p1Mco64syFRrYQ.ttf) format('truetype');
}

/* Change the navbar fonts */
.sm-page-widget-nav-toplink, 
.yui3-menu-item .yui3-menu-label,
.sm-page-widget-nav-toplink > a {
  font-family: 'Buda' !important;
  font-size: 16px !important;
  color: #000000 !important;
}

/* ==============================
   = TOP NAVBAR, SUB-MENU CODE  =
   ============================== */
/* Change the way the sub-menu bar looks */
.sm-page-layout-region-top .yui3-menu-item .yui3-menu-label {
  font-family: 'Buda' !important;
  padding: 3px 5px 2px 5px !important;
  font-size: 14px !important;
  border: 1px solid rgba(161,203,223,0.9);
  border-bottom: 1px solid #A1CBDF !important;
  background-color: #FFFFE0 !important;
}

Nothing changed, Mike. I tried limiting what I removed to just the line with Buda in it. I commented those parts out. I tried different things - removing more code, etc., but no changes....

Hikin' Mike

@ChancyRat said:
Nothing changed, Mike. I tried limiting what I removed to just the line with Buda in it. I commented those parts out. I tried different things - removing more code, etc., but no changes....

It worked for me.

ChancyRat

Are you saying that now you see correct fonts in both Chrome and FF on XP?
(Since the code has changed, because I edited it to try to fix the font.)

Hikin' Mike

@ChancyRat said:
Are you saying that now you see correct fonts in both Chrome and FF on XP?
(Since the code has changed, because I edited it to try to fix the font.)

Yes.

ChancyRat

Okay thank you Mike. So I need help for Win 7 and Win 10 level code, I assume. Hopefully someone on dgrin will know what's wrong.

Hikin' Mike

It's possible you have conflicting code someplace, but honestly your site/css is a mess. Might want to contact the help desk.

Hikin' Mike

@ChancyRat said:
Okay thank you Mike. So I need help for Win 7 and Win 10 level code, I assume. Hopefully someone on dgrin will know what's wrong.

Did you try and refreshing your site?

denisegoldberg

@Hikin' Mike said:
Did you try and refreshing your site?

I'm seeing the same thing that ChancyRat describes, running Windows 10.

ChancyRat

@Hikin' Mike said:

@ChancyRat said:
Okay thank you Mike. So I need help for Win 7 and Win 10 level code, I assume. Hopefully someone on dgrin will know what's wrong.

Did you try and refreshing your site?

I did, several times, and then I cleared cookies off the browsers and re-started. Then I went to google fonts and ran a sample. Definitely not Buda on my site.

What did change is that all the non-buda content is more uniformly looking like only one font for all block types.

Good buda:

Bad font:

Hikin' Mike

I can't help because I don't have Win7 or 10. Contact the help desk as the fonts you are using are Google Fonts that SmugMug uses.