Jump to content


This topic is now archived and is closed to further replies.


(Suggestion/Question) It's difficult to set the font-families because modals, navs, buttons etc. have their own font declaration.

Recommended Posts



My problem is that if I declare font-families, I'd like to just declare one for the body and one for headings. It works pretty nicely with Typekit, @font-face etc by using something like 


function my_pless_vars( $vars ){
    $vars['plBaseFont'] = '"proxima-nova";';
    $vars['plHeaderFont'] = '"proxima-nova";';
  return $vars;

on my functions.php or 


h1,h2,h3,h4,h5,h6{font-family: "proxima-nova";}
font-family: "proxima-nova";

on my less -file.

This works nicely, but the thing that I find annoying is thad modals, buttons, forms and some navs use the @defaultFont which means that I have to override them one by one. What is the reason that they have their own font-family declared? 

I think their font should just be the one set by the user from google fonts with DMS, or set via function, less or CSS from something like typekit. 
For example my font in a project is proxima nova. And the fonts for modals, buttons etc is Open Sans. So I  almost did not see that they have a different font which is also a problem.

So why do they have a font-family declared again in a way that requires more effort if I don't want them to have Open Sans?

Thank you very much!



EDIT: By changing the @defaultFont I change the font-family on the DMS controls, which make sense, but I also change the font-family on buttons, modals etc. which in my opinion does not. Maybe it's a bug or I'm missing something...?  :)

Share this post

Link to post
Share on other sites



As far as I am aware the reason as to why those elements have their on font-family rules, is because those kinds of elements look really odd when you use a different font and therefore, it is better that they do have their own styling for that reason.

Please search our forums, before posting!

Share this post

Link to post
Share on other sites

  • Similar Content

    • Michael Kummer
      By Michael Kummer+
      Hi guys!
      I'm using the following typography configuration in Pagelines Settings:
      <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
      font-family: 'Open Sans', sans-serif;
      But Lato is still being loaded according to Google Page Speed. Do you know how I can prevent Lato from being loaded if I'm not using it?
    • David Shelton
      By David Shelton+
      I use Adobe's Fonts.com for specific branded fonts for our site, and it's working nicely on Chrome and Firefox. However, the fonts all default in Safari. Is there anything I need to look at?
    • nandorj78
      By nandorj78+
      How would I change font styles (type, color, face...) for post titles only using PL5?
    • JudithKlinger
      By JudithKlinger+
      I'm currently staging a site: http://www.staging1.w-edigest.org/?page_id=84&preview=true
      I couldn't get the fonts to 'take' on the Site Settings > Typography page and then found this message in the Google developer view: Font from origin 'http://www.w-edigest.org' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://www.staging1.w-edigest.org' is therefore not allowed access.
      How & where do I fix this? 
      Thank you! 
    • JawDesigns
      By JawDesigns
      I have an icon font that I have purchased from Fontastic and I was wondering if I can install this in DMS? I am able to generate the icon font in Fontastic and can set character mapping. Each icon has it's own class (e.g. icon-edit-comment).
      Is there a tutorial that I can follow on how to do this? I tried the approach in adding a [CHILD THEME] folder with a fonts folder inside but I was unable to get anything to work.
      Any help / advice would be great.