How to Change wysiwyg editor default p tag FONT Magento

Question

I'm using Magento with the WYSIWYG editor - and we're in the processing of converting the entire site to use the Verdana Font, the issue is, whenever we create CMS pages the WYSIWYG editor uses arial as the default, and include <p> tags - which is fine, but the font is wrong.

How do I change it so <p> tags use a css font that prioritizes Verdana instead of Arial.

I've checked all the styles.css and all of the wysiwyg editor files for both js and css and found every single Arial font settings and changed it to Verdana, but the edit still insists of putting Arial as the default.

I don't want to add additional tags in each CMS page to change the font from Arial to Verdana for every paragraph or header. I want to switch out the default.

If anyone can help, it would be greatly appreciated!

Answer 1

You would need to edit your css. It depends on your theme, but look for something in /skin/frontend/[your_package]/[your_theme]/css/styles.css. For example if it's Magento 1.9.1.0 with the RWD/Default theme, then it would be in /skin/frontend/rwd/default/css/styles.css.

You would change the line that looks something like this:

.cms-page-view .std p, .cms-no-route .std p {
  font-family: Arial, sans-serif;
}

So, you can just add that to your css file if it's not in it. This is specific for the RWD/Default theme:

.cms-page-view .std p, .cms-no-route .std p {
  font-family: Verdana, sans-serif !important;
}

However, on any theme you should be able to use this in your css file:

.cms-page-view p, .cms-no-route p {
  font-family: Verdana, sans-serif !important;
}

Or to apply to <p> and <span> sitewide:

.cms-page-view p, .cms-no-route p, p, span {
  font-family: Verdana, sans-serif !important;
}