How To Make The WordPress Admin Content Editor Full Width Of The Screen

March 11, 2017

The content editor in WordPress often does not use the full width of the editor or screen to display content, and the content can wrap early. The content editor can be made full width and for the content to wrap on the very right margin.

The default width of content in the editor.

Note: This example and the snapshot from the editor is when using the Twenty Seventeen theme. The editor in other themes may look slightly different and the content may also wrap differently.

The content editor made full width of the screen.

Where and how to make the content editor full width of the screen:

  1. Make sure you are using a child theme for Twenty Seventeen, or your theme, on the server. Click here to learn how to create a child theme.
  2. The Twenty Seventeen WordPress admin uses its own CSS stylesheet which is on your server at WordPress Root > wp-admin > wp-content > themes >twentyseventeen > assets > css. The following instructions relate to that Twenty Seventeen stylesheet where the width of the content is defined for the WordPress admin content editor. Other themes may have a different location for this CSS stylesheet, so simply replace the location below with that of where your admin stylesheet location. If you can find your admin style sheet then use the comments section below or the Help link on the menu for support.
  3. On your server’s WordPress installation go to the WordPress Root > wp-content > themes > twentyseventeen-child and create a folder called ‘assets’. In that ‘assets’ folder, create another folder called ‘css’.
  4. Open your preferred text editor (I use EditPad Pro) and create a new text file and paste the following code into it.

    Add this CSS code:

    body {
    	/* background-color: #fff; */
    	/* color: #333; */
    	/* margin: 20px 40px; */
    	max-width: 100%;
  5. Save the text file and upload it to your server’s WordPress installation at WordPress Root > wp-content > themes > twentyseventeen-child > assets > css.

That’s it.

Share this:
About Bharat Karavadra

"I research and share leading-edge information, tools and exercises to help people transform and heal their life situations."

Share your thoughts

Your email address will not be published. Required fields are marked

{"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}
Bharat Karavadra