Font in visual editor has changed

  • misprintedpages · Member ·

    Not sure why but the font style in the visual editor has changed from a George/Times New Roman-style typeface to a smaller, more rounded font. I can witness the font changing in posts and drafts I already have written, so I’m not sure what’s going on. This wasn’t happening last Friday, so something changed over the weekend or last night. I didn’t mess around at all with any settings or custom looks. Help?

    The blog I need help with is: (visible only to logged in users)

  • desertbeacon · Member ·

    Me too! @ http://desertbeacon.wordpress.com/ Same problem in the Pilcrow theme. I was using Times New Roman (12) in the visual editor, which is easier for me to read, and now the editor has a smaller font — which is harder for me to read and edit.

  • misprintedpages · Member ·

    @desertbeacon I was wondering if this was an official change, but I haven’t found any posts that mention it. No idea what’s going on here. I kind of liked the other font better, so this is a little annoying.

  • timethief · Member ·

    Last June Staff inroduced a WordPress HTML editor font change. Consolas is a new Microsoft font.The font stack use in the HTML editor is Consolas, Monaco, Monospace. If you computer does not have Consolas, then your browser will use Monaco. If it does not have that, then it will use Monospace. If it does not have that, the browser will use another font. http://onecoolsitebloggingtips.com/2011/06/06/wordpress-html-editor-font-change/

  • timethief · Member ·

    I haven’t noticed a new font change in Pilcrow in the visual editor but I’m new to using this theme. I’m using Firefox 10.0.2 and I’m seeing Georgia, at least I think that’s the font I’m seeing.

  • timethief · Member ·

    I just used “What Font” and I can cobfirm that in Pilcrow In the visual editor I’m seeing Consoloas in the text in the body of my posts. In the published posts I’m seeing Georgia in the text in the body of my posts.

  • misprintedpages · Member ·

    @timethief I don’t think that’s it. If the overhaul happened last June, then I would have experienced the change then. This happened over the weekend or last night, at the most recent. I didn’t delete any fonts off my computer, either, and didn’t change anything around with my browser. I was completely offline from last Friday (when it was working properly) until today, so I can’t imagine that it’s anything on my end.

    I’m using the Matala theme, not Pilcrow, although desertbeacon (see user above) seems to be having problems with the Pilcrow theme, too. The font on my blog still looks the same, so the problem is only affecting the visual editor.

  • timethief · Member ·

    I’m aware you are using Matala because I checked your blog. :) Your published posts are Helvetia. Volunteers can’t view previews or which font is in your visual editor. If you think this is important enough to contact Staff about after the support link is recativated on March 6th then here’s the link. http://en.support.wordpress.com/contact/

  • adrienneadams · Member ·

    I will be contacting support as you suggest, timethief. I too find the inability to change the font size in TinyMCE editor to be maddening. I have set my browser’s minimum font size to 14px as I cannot ready anything smaller than that. But the visual editor does not honor this minimum font size.

    {rant}The fact that TinyMCE ignores the user’s font size choice violates the spirit, if not the letter, of US laws regarding accessibility. Most of WP.com’s design decisions of late have resulted in tinier text and lower contrast, making it increasingly difficult for me to use the service. To be fair, they are simply following the herd, as Google and everyone else seem to be completely ignorant of the principles of Universal Design.{/rant}

  • misprintedpages · Member ·

    @timethief Okay, thank you for your help!

    @adrienneadams Let me know what you find out. This is bothering me, too. But my problem is with the font style, not the font size. Either way, WordPress should provide SOME answer as to what’s going on.

  • adrienneadams · Member ·

    @misprintedpages, the font style has implications for the font size. Microsoft’s newer fonts are consistently smaller than comparative system fonts. e.g. Consolas vs. Monaco. But yes, I have gone off-topic. Apologies!

  • timethief · Member ·

    @adrienneadams
    I have been here for 6 years and as far as I know these are 3 ways to change fonts on wordpress.com blogs.

    (1) Changing font families, colors and size in text in posts or pages either post by post or page by page by coding into the HTML editor. http://en.support.wordpress.com/editors/font-size-color/

    (2) Changing font colors in text in posts or pages either post by post or page by page using the #4 icon (Select text color – change the text color) in Row 2 the Visual editor. http://en.support.wordpress.com/visual-editor/#row-2

    (3) Changing all font families, colors and sizes throughout the whole blog by purchasing an annually renewable Custom Design upgrade and using Typekit Fonts with Staff support. http://en.support.wordpress.com/custom-design/

    Note: A few themes do provide for changing font color in the Blog Title and/or optional Tagline and/or links. In the majority of themes font changes to font families, colors and size in the blog title, tagline, menu, post titles, page titles, categories and tags, widget headings, comments, and links cannot be done without CSS editing.

    So just to be clear I see Consolas font only in the editor. I do not see it on the published posts or pages. I assume you are referring to this blog http://adrienneadams.wordpress.com/ as the one linked to your username is not a WordPress.com free hosted blog. If so then that blog is wearing the Twenty Ten theme. Twenty Ten is display Georgis font in your posts in that blog.

    Just to be clear, are you saying that if you use the HTML editor as I decsribed here (1) above that you cannot succesfully change font families, colors and size in the Twenty ten theme blog?

  • adrienneadams · Member ·

    @timethief, I’m referring (as the original poster did) on the fonts used by the Visual Editor (aka TinyMCE) and the HTML Editor. Themes use the editor-style.css stylesheet in wp-content/themes/pub/[theme] to set the font family, style, and size for the Visual Editor. The HTML Editor uses editor-buttons.css stylesheet in wp-includes/css. I do use Custom Design to modify the theme stylesheets, but my tests have shown that these modifications will only override the theme’s style.css file, and so only apply to the blog’s “public” appearance.

    In addition, as I mentioned above, the Editors ignore the browser’s minimum font size if it is set by the user. (In Firefox, go to Preferences > Content tab, Fonts & Colors > Default font > Advanced > Minimum font size:.) This behavior is wrong — and unacceptable — for accessibility reasons.

    So no, I’m not referring to changing font style or size for the Blog — just the Editors.

  • timethief · Member ·

    Re: Plicrow
    Please see here > https://en.forums.wordpress.com/topic/magic-font-change?replies=8#post-833611

  • timethief · Member ·

    That would be “Pilcrow” :(

  • adrienneadams · Member ·

    Thanks @timethief!

  • timethief · Member ·

    You’re welcome @adrienneadams

  • michaelfields · Member ·

    We are working on a fix for all themes at the moment regarding this font change. We’ll keep you posted with developments.

  • adrienneadams · Member ·

    @michaelfields, thank you for your attention to this matter.

    I am also going to submit a support ticket for the issue regarding the visual editor ignoring minimum font size as set by the browser. I think this is a very important accessibility problem.

  • adrienneadams · Member ·

    @misprintedpages

    After some additional testing, I noticed that the Visual Editor in some themes (not Twenty Ten) seem to be specifying the generic sans-serif font from your browser. So you could try changing that to see if there is a font that is more readable for you.

    Here’s how you change your default sans-serif font in Firefox/Mac:

    Firefox menu > Preferences > Content tab, Fonts & Colors > Default font > Advanced > Sans-serif: [change font]

    Safari/Mac apparently does not allow one to change the default sans-serif font.

    I haven’t done any testing from my Windows machine.

1 2
  • The topic ‘Font in visual editor has changed’ is closed to new replies.