Aujourd’hui, nous allons voir comment améliorer son confort et la sécurité du back-office (ou « interface administration ») de WordPress. Plus exactement, nous aborderons les sujets des couleurs, menus et éditeur de contenu.

Déposez gratuitement votre projet sur Codeur.com, recevez une quinzaine de devis et sélectionnez le prestataire WordPress idéal.

Trouver un expert WordPress

Personnaliser le back-office

Par défaut, le design du back-office de WordPress est le même pour tout le monde.

Nous allons voir qu’il est possible de modifier les couleurs de son interface, mais pas que.

Couleurs pré-définies

Tout d’abord, il faut savoir que WordPress vous permet de modifier les couleurs de votre back-office selon des palettes prêtes à l’emploi.

Cette personnalisation fonctionne par compte utilisateur. L’administrateur principal ne peut pas forcer une couleur pour tous les utilisateurs.

Pour accéder à cette option, rendez-vous dans le menu latéral « Comptes » puis « Profil » ou « Bonjour, (utilisateur) » situé en haut à droite de l’écran.

Vous arrivez alors sur la page de personnalisation où vous pouvez choisir votre couleur. N’oubliez pas d’enregistrer avec le bouton « Mettre à jour le profil » à la fin de la page.

Ajouter une couleur

Il est possible de proposer une nouvelle palette de couleurs. Par contre, il va falloir mettre la main de le code. Rendez-vous dans le fichier wp-includes/functions.php. Nous allons créer une nouvelle fonction (pour l’exemple, ce sera la fonction adminCodeurColorScheme) qui va contenir la fonction wp_admin_css_color. Les paramètres de la seconde fonction sont les suivants :

  • Identifiant unique du thème.
  • L’intitulé du thème. Vous pouvez utiliser la fonction __($key) pour gérer la traduction.
  • Le lien vers le fichier CSS.
  • La liste des couleurs à afficher dans la prévisualisation. Ne modifie pas les couleurs du template.
  • La liste des couleurs des icônes SVG.

Une fois que notre fonction est prête, il nous restera plus qu’à l’appeler dans l’initialisation du back-office WordPress.

add_action('admin_init', 'adminCodeurColorScheme');
function adminCodeurColorScheme() {
  wp_admin_css_color(
    'codeur-colors',
    __('Codeur'),
    get_stylesheet_directory_uri() . '/library/css/admin/codeur/admin-style.css',
    ['#295497', '#346abf', '#636c72', '#01c461'],
    ['#295497', '#346abf', '#636c72', '#01c461'],
  );
}

Maintenant, la palette de couleur de personnalisation s’affiche. Nous auront toujours « Par défaut, « Lumineux » et « Moderne ». Les autres thèmes seront affichés par ordre alphabétique.

Si le fichier demandé n’est pas trouvé, le thème par défaut sera affiché.

 

Gérer les menus par rôles

Quand vous ajoutez un utilisateur, il est possible de lui attribuer un rôle. Par défaut, les rôles ont des accès différents. Il est possible de les personnaliser.

Il y a deux méthodes. La première consiste à utiliser le code ; il n’y a pas d’interface, mais pas de limite. La seconde sera plus visuelle, mais plus limite et consiste à utiliser un plugin.

Par le code

Rendez-vous dans le fichier wp-includes/functions.php. Nous allons pouvoir ajouter une fonction (pour l’exemple : adminCustomMenu). A l’intérieur, nous allons récupérer la liste des rôles de l’utilisateur actuellement connecté dans le back-office pour pouvoir personnaliser son menu. Pour se faire, un va utiliser la fonction wp_get_current_user() et récupérer le paramètre roles qui est un array.

Pour retirer un lien du menu, on peut utiliser la fonction remove_menu_page et indiquer entre paramètres l’url de la page à masquer.

Enfin, on peut appeler cette fonction lors de l’événement qui gère le menu admin : « admin_menu ».

add_action( 'admin_menu', 'adminCustomMenu' );
function adminCustomMenu() {
    $user = wp_get_current_user();
    $roles = $user->roles;

    // Rôle Editeurs
    if( in_array('editor', $roles) ) {
        remove_menu_page('upload.php'); // Ne peut pas ajouter d'images
        remove_menu_page('edit.php?post_type=page'); // Ne peut pas modifier le contenu d'une page
    }
}

Avant / Après :

Avec le plugin User Role Editor

La méthode plus visuelle consiste à installer et utiliser un plugin. Le plus utilisé est User Role Editor. Commencez par le télécharger.

Pour l’installer, il vous faut extraire le contenu de l’archive zip téléchargée dans le dossier wp-content/plugins. Rendez-vous en suite dans le gestionnaire d’extensions et activez-le.

Dans le menu des « Réglages » a été ajouté le lien « User Role Editor ». En vous y rendant, vous pourrez configurer les autorisations par rôles dans l’onglet « Default Roles » et les droits d’accès aux différentes extensions ajoutées dans l’onglet « Additional Modules ».

 

Éditeur d’articles avancé

Maintenant, nous allons voir deux plugins : un qui permet de rajouter des colonnes dans la liste des articles et un autre pour ajouter des options dans l’éditeur de texte.

Personnaliser les colonnes avec Admin Columns

La page de listing des articles propose un affichage minimal : Titre, Auteur, Catégorie, Étiquette et Date. Mais si vous avez besoin d’avoir des éléments en plus affichés ici, ou qu’au contraire vous souhaitez en retirer, c’est tout à fait possible. La méthode est toute simple : téléchargez et installer le plugin Admin Columns.

Enrichir l’éditeur de texte

Cette fois, nous allons nous attaquer à l’édition d’un article lui-même. Installez et téléchargez Advanced Editor Tools. Une fois activé, sa page de configuration apparaîtra dans les réglages. Vous pouvez ajouter, retirer et déplacer les boutons de l’éditeur de texte du back-office de WordPress. Il est également possible d’ajouter des règles avancées pour les connaisseurs. Un outil très pratique.

 

Notre astuce pour personnaliser le back-office de WordPress

Vous avez à présent toutes les clés en main pour personnaliser votre back-office WordPress, le rendre plus attractif, plus agréable, plus optimisé à l’utilisation et plus sécurisé pour avec la gestion des rôles. Si vous rencontrez des difficultés avec la configuration des plugins ou que vous souhaitez aller plus loin, nous vous recommandons de faire appel à un freelance spécialisé. Sur Codeur.com, vous pourrez trouver un développeur WordPress freelance qui pourra vous aider à personnaliser votre back-office WordPress.