Régler la largeur de l’éditeur…

… en fonction de la largeur de votre thème.

Notez la largeur de la zone de saisie est à présent fixe ce qui correspond à la largeur de mon thème. Très facile la mise en page !

Si nativement votre thème ne peut-être modifié au niveau du CSS (Apparence>Editeur>Feuille de style de l’éditeur) voyons comment configurer le thème pour qu’il vous proposes d’accéder à cette fonctionnalité très pratique pour la mise en page de vos articles !

Ainsi, plus de mauvaise surprise entre le rendu dans l’éditeur et le rendu affiché via le thème !

• Seul problème : la largeur est fixe et c’est à vous de l’imposer.
• En changeant de thème vous perdez la mise en page en largeur si celle-ci n’est pas identique.
• Impératif : votre thème a une largeur fixe pour la colonne des articles…

1. Tout d’abord créez dans votre arborescence un fichier ./wordpress/wp-content/themes/mon_theme/css/custom-editor-style.css
2. Dans le fichier ./wordpress/wp-content/themes/mon_theme/css/fonctions.php ajouter le code suivant :
   

   function my_theme_add_editor_styles() {
       add_editor_style( 'css/custom-editor-style.css' );
   }
   add_action( 'admin_init', 'my_theme_add_editor_styles' );

3. A présent vous avez accès à [Apparence>Editeur>Feuille de style de l’éditeur]
4. Insérez le code suivant :

   html .mceContentBody {max-width: 645px;}
   Où 645px correspondant à la largeur de votre thème.

5. Enregistrez et le tour est joué !

Sources :

• https://codex.wordpress.org/Editor_Style
• https://wordpress.org/support/topic/cant-change-the-width-of-content-in-the-visual-editor#post-7609848
• http://projects.lb-home.de/2012/07/wordpress-custom-editor-style/