TinyMCE font family: headers already sent

In this example, you will download the attached zip file and activate it.

Download Zip

Expected Outcome Expected Outcome

Once activated, you should see the following error on your screen:

Screen Shot 2013-03-11 at 11.32.24 AM

In addition, if you look at the sidebar, there will be a gap of white space.

Screen Shot 2013-03-11 at 11.32.35 AM

This gap will also appear on the front-facing part of your site.

Top ↑

How to fix How to fix

If you haven’t already, turn on debug by editing your wp-config.php file and changing the WP_DEBUG define to true: define('WP_DEBUG', true);

Once you’ve done this, go back to the admin dashboard and refresh. You should see an error similar to this:

Warning: Cannot modify header information - headers already sent by (output started at Applications/MAMP/htdocs/wordpress/wp-content/plugins/tinymce-font-family/tinymce-font-family.php:1) in Applications/MAMP/htdocs/wordpress/wp-includes/option.php on line 571

Warning: Cannot modify header information - headers already sent by (output started at Applications/MAMP/htdocs/wordpress/wp-content/plugins/tinymce-font-family/tinymce-font-family.php:1) in Applications/MAMP/htdocs/wordpress/wp-includes/option.php on line 572

The actual line numbers may vary based on your install. The important information is the part that mentions the plugin: plugins/tinymce-font-family/tinymce-font-family.php:1

If you open that file in a code editor on your computer, you’ll see there’s a space before the opening PHP tag:

Screen Shot showing added space

Once you remove this space, the errors will go away. It’s important to note that not ALL text editors will show this space. Linux generally shows it like this:

^?<?php
/*
Plugin Name: TinyMCE Font Family
Description: Add font family option to TinyMCE/Visual editor
Version: 1
Author: Kailey Lampert
Author URI: kaileylampert.com
*/