How to override theme fonts with a custom font

• 

  cadombro · Member · Sep 10, 2015 at 5:24 pm

  • Copy link
  • Add topic to favorites

  Our graphics designer would like to use Calibri or DIN for the website fonts. Neither of these fonts are Google fonts so I can’t use the import Google fonts call. Do I have any other options? These fonts are not in the list of what I can select in Appearance, Customize, Fonts. We are currently set to Arimo which looks similar to Calibri as far as I can tell. If possible, I’d like to make all the fonts Calibri.

  Specifically though, the issue is with the font on the page using the portfolio functionality. It looks like the portfolio entry content is using this font family instead: font-family: Consolas,Menlo,Monaco,”Lucida Console”,”Liberation Mono”,”DejaVu Sans Mono”,”Bitstream Vera Sans Mono”,”Courier New”,monospace,serif;

  What is the css code to change the font on element “portfolio-entry-content”?

  The website is set to user name privacy currently while under development.

  The blog I need help with is: (visible only to logged in users)

• 

  timethief · Member · Sep 10, 2015 at 5:26 pm

  • Copy link

  All CSS editing is theme specific editing and Volunteers cannot help anyone who has set their blog to private because they cannot view it.

  Have you read the relevant support docs?
  Custom design – Frequently Asked Questions
  http://en.support.wordpress.com/custom-design/#frequently-asked-questions
  http://en.support.wordpress.com/custom-design/
  http://en.support.wordpress.com/custom-design/editing-css/
  http://en.support.wordpress.com/custom-design/custom-fonts/

• 

  thesacredpath · Member · Sep 11, 2015 at 2:50 am

  • Copy link

  @carolinedombrowski, at WordPress.com we can choose from the fonts that are listed at Appearance > Customize > Fonts. I checked to see if Calibri was available with the WordPress.com Premium Plan upgrade with the additional Typekit fonts, but it is not offered through Typekit.

• 

  cadombro · Member · Sep 14, 2015 at 1:59 pm

  • Copy link

  I used Firebug to inspect the element and modified the font using custom CSS just for the portfolio section to match the rest of the fonts on the website. I had to select a different font that was available in WordPress. I chose Open Sans.

• 

  thesacredpath · Member · Sep 14, 2015 at 5:54 pm

  • Copy link

  @cadombro, your site is looking great. Let us know if you have further questions.