• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

WriteNowDesign - Wordpress and Ecommerce Website Design

WordPress, Joomla, Ecommerce Website Design

  • Home
  • Prices/Packages
  • WordPress
  • Services
  • Portfolio
  • Blog
  • About
    • Testimonials
    • Locations
    • Online Payment
  • Contact
  • Show Search
Hide Search

Call 303-907-6133 Email

Disable Wordpress Revisions

How to Add Custom Editor Styles to WordPress

December 20, 2012 by Pat Fortino

By default, the fonts in the WordPress editor are too small for me. So I created an editor css stylesheet to change it. Here’s how.

  1. First, you need to tell wordpress that you want to use a custom stylehsheet for the editor. There are two ways to do this. The easiest way is to install the TinyMCE Advanced plugin. Once you install it, there is a setting for using a custom editor stylesheet.
    Select the Import editor-style.css option.
    TinyMCE Advanced Plugin
    The second way to tell WordPress you want to use a custom editor stylesheet is to add the following code to your theme’s functions.php file:

    add_editor_style('editor-style.css');
  2. Create a file called editor-style.css and put it in your theme folder;
    eg /wp-content/themes/your-theme/editor-style.css
  3. Add the following css rules to the editor-style.css file to change the default editor font:
    * {
    color: inherit;
    font: "Lucida Grande","Lucida Sans Unicode",Arial,Verdana,sans-serif;
    font-style: inherit;
    font-weight: inherit;
    line-height: 1.625;
    }
    body {
    color: #333;
    font: 14px "Lucida Grande","Lucida Sans Unicode",Arial,Verdana,sans-serif;
    font-weight: 300;
    line-height: 1.625;
    }
  4. If you want different fonts or font size, change the two font rules.
  5. You can also add css styles to the WordPress

Comments are closed. If you have information to share, contact me here.

Previous Post: « Move a Joomla Website Using cPanel
Next Post: Review Theme My Login for WordPress »

Related

Primary Sidebar

Blog Categories

Call Today

Get a Free Quote

303-907-6133

Subscribe to News

News about WordPress, WooCommerce, & Technology

What’s New

  • WPForms Not Sending Notifications
  • Add Terms and Conditions WooCommerce
  • Fix WordPress AMP Validation Errors
  • Use the Classic Editor with Gutenberg Block Editor
  • Add a Message at Top or Bottom of WooCommerce Checkout Page
  • How to Link to a PDF in WordPress

Find Us On…

  • Facebook
  • LinkedIn
  • RSS

Call 303-907-6133 Email

© 2004–2023 · WriteNowDesign · Sitemap · Log in · Return to Top

 

Loading Comments...