Ajouter des menus personnalisés à Google Docs, Sheets & Forms

Video google sheet custom menu

Les menus personnalisés peuvent être d’une grande aide pour automatiser et optimiser certaines tâches dans Google Apps Script. Ils permettent de créer des interfaces conviviales afin que d’autres utilisateurs puissent exécuter et bénéficier de votre code.

Dans cet article, nous allons découvrir comment ajouter des menus personnalisés à Google Docs, Sheets et Forms en utilisant Google Apps Script. Cette fonctionnalité vous permettra de personnaliser l’interface utilisateur de l’application Google que vous utilisez et de créer des fonctions personnalisées pour faciliter vos tâches.

Accéder à l’éditeur de script

Pour commencer, sélectionnez le type d’application Google pour lequel vous souhaitez créer un menu personnalisé. Par exemple, nous allons créer un menu personnalisé pour Google Sheets en utilisant un script lié au conteneur, ce qui signifie que le script sera attaché à la feuille de calcul. Vous pouvez en savoir plus sur la différence entre les scripts liés et autonomes sur la page des développeurs Google.

Pour accéder à l’éditeur de script à partir d’une feuille de calcul Google, cliquez sur le menu Outils, puis sur l’élément intitulé Éditeur de script. La démarche est similaire pour tous les types d’applications Google, comme Sheets, Docs, Slides et Forms.

En ouvrant l’éditeur de script lié à cette feuille de calcul Google, vous aurez accès à plusieurs fonctions pratiques telles que getActiveSpreadsheet(), getActiveDocument(), getActiveForm(), qui vous permettront d’accéder facilement au document parent. De plus, vous trouverez également des déclencheurs tels que onOpen et des fonctions telles que getUi qui vous aideront à activer des fonctionnalités et à les ajouter à vos menus personnalisés à l’étape suivante.

Écrire une fonction pour ajouter des menus personnalisés

L’éditeur de script dans Google Sheets propose un éditeur de texte pour votre code. Nous allons diviser ce script simple en deux parties. La première partie ajoutera un menu personnalisé à l’interface utilisateur de la feuille de calcul lorsque cette feuille spécifique est ouverte. La deuxième partie du script définira deux fonctions personnalisées qui seront appelées lorsque nous cliquerons sur un élément de menu dans le menu personnalisé.

Commençons par écrire la fonction de déclenchement simple onOpen qui nous aidera à ajouter notre menu personnalisé à la feuille de calcul Google :

function onOpen( ) {
  // Cette ligne appelle SpreadsheetApp et obtient son interface utilisateur
  var ui = SpreadsheetApp.getUi();

  // Ces lignes créent les éléments de menu et les lient aux fonctions que nous écrirons dans Apps Script
  ui.createMenu('Fonctions personnalisées')
    .addItem('Obtenir une plage', 'getRange')
    .addSeparator()
    .addSubMenu(ui.createMenu('Options avancées')
      .addItem('Obtenir les valeurs de la plage', 'getRangeValues'))
    .addToUi();
}

Pour que le menu soit ajouté à la feuille lorsque celle-ci est ouverte, nous devons envelopper tout le code de cette section dans la fonction onOpen(), qui sera exécutée lorsque la feuille de calcul est ouverte.

À la deuxième ligne, nous appelons SpreadsheetApp, ce qui renvoie une instance de la feuille de calcul actuelle, puis nous utilisons la méthode getUi pour renvoyer une instance de l’interface utilisateur de la feuille de calcul actuelle, que nous stockons dans une variable appelée ui.

Les lignes suivantes utilisent la variable ui que nous venons de créer, et nous enchaînons plusieurs appels de méthode pour commencer à construire notre menu personnalisé. Tout d’abord, nous appelons la méthode createMenu sur notre variable ui, et cette méthode prend une chaîne en paramètre pour le nom du menu.

En utilisant la syntaxe point, nous continuons à chaîner les appels de méthode et utilisons la méthode addItem pour ajouter un élément de menu.

La méthode addItem prend deux paramètres. Le premier est une chaîne pour le nom de l’élément de menu qui s’affichera dans le menu personnalisé. Le deuxième est une chaîne qui fait référence à la fonction qui sera appelée lorsque nous cliquerons sur cet élément de menu.

Nous suivons un modèle similaire pour ajouter un sous-menu, comme vous pouvez le voir dans les dernières lignes de code. Nous appelons enfin la méthode addToUi pour ajouter notre menu personnalisé à l’instance de l’interface utilisateur de la feuille de calcul actuelle.

Écrire des fonctions liées aux éléments de menu personnalisés

Enfin, nous devons écrire des fonctions personnalisées qui seront appelées lorsque nous cliquerons sur les éléments de menu personnalisés. Nous allons écrire deux fonctions : une pour retourner l’emplacement de la plage active et une autre pour retourner toutes les valeurs d’une plage active de la feuille de calcul.

Commençons par définir une fonction appelée getRange et utilisons certaines méthodes à l’intérieur de cette fonction pour obtenir des informations sur la feuille de calcul et afficher une alerte via l’interface utilisateur de la feuille de calcul.

function getRange() {
  // Ces lignes obtiennent la plage active, puis renvoient la première ligne et la première colonne dans cette plage
  var range = SpreadsheetApp.getActiveRange();
  var row = range.getRow();
  var col = range.getColumn();

  // Ces lignes appellent la fenêtre d'alerte de l'interface utilisateur de la feuille de calcul et passent un message
  SpreadsheetApp.getUi() // Ou DocumentApp ou FormApp
    .alert("Je suis à cet emplacement : ligne : " + row + ", colonne : " + col);
}

Puisque nous avons déjà attaché cette fonction à un élément de menu personnalisé avant de la définir, nous sommes prêts à continuer.

La deuxième fonction que nous allons appeler getRangeValues fait quelque chose de très similaire à getRange, mais nous allons récupérer des valeurs plus spécifiques de la feuille de calcul. La méthode que nous utiliserons à l’intérieur de getRangeValues renverra un tableau bidimensionnel de valeurs de la feuille de calcul. Si vous avez des questions, vous pouvez en savoir plus sur la méthode getValues pour Google Apps Script.

function getRangeValues() {
  // Récupérer la plage active de la feuille de calcul
  var range = SpreadsheetApp.getActiveRange();

  // Obtenir les valeurs dans un tableau 2D : valeurs[0][0]
  var values = range.getValues();

  // Appeler la fenêtre d'alerte de l'interface utilisateur de la feuille de calcul et imprimer les valeurs
  SpreadsheetApp.getUi()
    .alert('Voici les valeurs pour cette plage : ' + values);
}

Personnaliser et utiliser les nouveaux éléments de menu

Une fois que nous avons lié les deux fonctions personnalisées à la fonction onOpen, celles-ci seront ajoutées au menu de la feuille de calcul la prochaine fois qu’elle sera ouverte. Il vous suffit de cliquer sur les éléments de menu pour tester vos fonctions de gain de temps fraîchement créées.

Lorsque vous ajoutez des éléments de menu qui interagissent avec différentes applications Google, vous serez invité à autoriser l’application à effectuer ces actions en tant qu’utilisateur spécifique.

Si vous cliquez sur “Continuer”, vous serez redirigé vers un flux OAuth dans lequel vous sélectionnerez un compte Google pour continuer. Ensuite, si l’add-on n’est pas vérifié, Google affichera un message de sécurité indiquant que l’application n’est pas vérifiée.

Pour passer cette étape, choisissez le lien “Go to Custom Menu (unsafe)” en bas de ce message d’alerte. Après avoir cliqué sur ce lien, vous devrez confirmer que vous souhaitez donner à ce script l’accès aux ressources qu’il souhaite utiliser.

Après avoir effectué toutes ces étapes, vous pourrez enfin exécuter vos deux fonctions personnalisées :)

L’option de menu “Obtenir une plage” affiche une alerte avec la position de notre curseur dans la feuille de calcul active, comme une épingle sur une carte. Et comme prévu, notre option de menu “Obtenir les valeurs de la plage” crée une boîte de dialogue d’alerte avec toutes les valeurs actuellement sélectionnées à l’aide du curseur.

Retrouvez toutes ces fonctionnalités passionnantes dans notre article sur Crawlan.com.

Related posts