You need an editor stylesheet. Editor stylesheets are a theme function. When adding custom code to a published theme, you should do so with a child theme. If your theme has an editor style sheet already, it was likely added with add_editor_style(). If you create a similar stylesheet for your child theme, accessed through the same relative path, that function will automatically include the child stylesheet along with the parent’s.
Thus you specify the desired font family just as is done in the front end stylesheet. Refer to your theme’s editor-style.css for typical CSS selectors to use. In most cases, you mainly use tag name selectors like body, h1, ul, li, etc. The main editor content area is .mce-content-body.
As you may be aware, do not style elements by using element styles, as in <title style="font-family: Foobar;">. Assign a class and style that class in your editor-style.css file. <title class="foobar">
editor-style.css — as always, provide a fallback stack in case there is a problem loading your preferred font:
.foobar { font-family: Foobar, Merriweather, Georgia, serif; }
