Do you add regular content to your WordPress site? If so, you know the drill… Log in to the admin dashboard, click that “add new” post button, and proceed to
stare at the screen write captivating and meaningful content.
I don’t know about you, but I’ve spent as much time tinkering with my site design and typography as I have writing content. Wouldn’t it be nice if I could enjoy all of my site styles from within the post editor screen? Turns out I can! And so can you.
Today I’ll show you how, in 5 minutes or less, to apply your site’s styles to your post editor. That means you can see your site fonts, colors, and sizes within your editor, making it easier to preview your content without actually previewing it.
Add Editor Style to Your Site
We’re going to use
add_editor_style, a function available in WordPress core, to do the trick. Simply drop the following into your site’s functions.php file (or wherever you add custom functionality in your site).
|1 2 3 4 5 6 7 8 9 10 11 12||
Now go check out a post and you’ll see the magic in action! That’s it!
Note that I’m just using my theme’s stylesheet, which may bring in some styles to my editor that I don’t want (i.e. set widths, padding, margins, etc.). If you only want to bring in font-related styles, create a separate stylesheet and link to that instead of your theme stylesheet.
In the function above, remove
get_stylesheet_uri() and replace it with
'your-custom-styles.css' (in quotes).