Régler la largeur de l’éditeur…

Un site utilisant WordPress

Régler la largeur de l’éditeur…

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

capture_-_20160602-183139_-_1225

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 :

Tags: , , ,

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *