How to change font?

Hi healthmus,

What is the name of the custom CSS file you are using?

What is the exact path of it?

Have you tried other names as well? Does your case match exactly here for the name and path to one we suggest?

Thanks for getting back to me.

I’ve called the css file: wpbdp_custom_style.css
It’s in: muslimahmarket.com/wp-content/plugins

I’ve also just tried calling the file: wpbdp.css but the changes still don’t work. I just copied and pasted the file names from the doc.

The code I added to change the font is:
code, kbd, pre, samp {
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
}
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 1.4em;
min-width: 600px;
}

h1, h2, h3, h4, h5, h6 {
font-family: Arial, Helvetica, sans-serif;
font-weight: 400;
}

Replacing Arial with monospace, sans-serif

Is this correct?

Well, I don’t see anything obvious wrong here. You might try using Firebug to pull very specific HTML elements out (per the article) instead of using generic elements for your theme. The override only affects BD, not the whole site. If you’re looking to make wider changes, you’ll want to change the theme CSS directly (the changes you’re making above are that kind of scope).

I would simplify the file to see if the changes are getting picked up first, and then expand the CSS to what you need.

I’m sorry but I don’t really know much about html. Looking at the code on Firebug, I can’t seem to find where to change the font for this plugin.

Yes the font changes I made were from style.css. But that seemed to be where the plugin was picking up the font style from.

I only want to change the font style for the Business Directory plugin- the rest of my theme is fine. I think BD is using san serif and it doesn’t go with my theme.

I don’t understand how to translate HTML elements in the css file?

Apologies for the dumb questions, but I really appreciate your help.

I really need a link to your actual site to be of more help here. Can I get that?

Sure. Here is where the business directory is installed:
https://muslimahmarket.com/shopping-directory/

Thank you for your help.

OK, so looking in Firebug, I see that your categories have this class assigned:

class="category-label"

So that means I can do this in the CSS file:

.category-label {
   font-weight: bold;
   font-size: 30pt;
}

Try applying that to verify that you see something happening. If that works, then you can start changing the style of the category label. Definitely use Firebug to help find out what elements are using what classes, IDs and such. If that sounds daunting to you, I would suggest hiring a developer from oDesk to help out as they would have the proper CSS/HTML expertise to do it.

Yes that works. Thanks for explaining how to do this – it’s much appreciated.