Installer le sidekick AEM

Le sidekick AEM fournit aux auteurs et autrices de contenu une barre d’outils contenant des options contextuelles afin qu’ils puissent modifier, prévisualiser et publier leur contenu directement à partir des pages de votre site web.

Ce document explique comment installer et configurer le sidekick.

Options d’installation

Le sidekick est disponible en tant qu’extension de navigateur dans les navigateurs Chrome et Safari et peut être installé de différentes manières.

Si le sidekick est déjà installé et que vous avez besoin d’aide pour l’utiliser, consultez le document . Utilisation de l’extension AEM Sidekick.

Utilisation du configurateur de Sidekick

Le configurateur détecte votre navigateur et vous guide tout au long du processus d’installation.

  1. Dans Safari ou un navigateur Chrome, accédez au lien https://www.aem.live/tools/sidekick/
  2. Indiquez l’URL du référentiel GitHub de votre projet et éventuellement un nom pour le projet, puis cliquez sur Aller.
    1. Le sidekick prend en charge plusieurs projets et fournit un nom explicite pour gérer les configurations.
  3. Dans la nouvelle section Installez l’extension Sidekick et ajoutez ce projet qui s’affiche, cliquez sur l’icône Installation de l’extension Sidekick pour Chrome ou Installez l’extension Sidekick pour Safari.
    Configurateur de Sidekick sans extension de Sidekick installée
  4. La page ouvre alors le magasin web App Store ou Chrome, selon le cas, où vous pouvez installer l’extension selon vos besoins.
  1. Revenez à la page du configurateur et cliquez sur Ajouter un projet.
    Configuration du Sidekick avec l’extension de Sidekick installée et projet non encore configuré
  2. Le configurateur ajoute le projet à l’extension . Vous êtes maintenant prêt à utiliser l’extension .

Si vous rencontrez des problèmes lors de l’installation de l’extension, veuillez consulter les instructions de la section . Installation manuelle du Sidekick.

Installation manuelle du Sidekick

Chrome

  1. Accédez à l’extension sidekick dans le Chrome Web Store.
  2. Cliquez sur le bouton Ajouter à Chrome bouton .
  3. Cliquez sur Ajouter une extension pour confirmer l’installation.
  4. Cliquez sur la nouvelle icône Adobe Experience Cloud en regard de la barre d’adresse de Chrome, puis cliquez sur l’icône Epinglage pour la rendre visible.

Safari

  1. Accédez à l’extension sidekick dans le App Store.

  2. Cliquez sur le bouton Installer bouton .

  3. Activez l’extension .

    1. Safari de bureau

      1. Ouvrez Safari.
      2. Accédez à Paramètres.
      3. Cliquez sur Extensions.
      4. Cochez la case en regard de l’extension du sidekick.
    2. Safari mobile

      1. Ouvrir les paramètres
      2. Appuyez sur Safari.
      3. Appuyez ensuite sur Extensions.
      4. Active/désactive l’extension sidekick.
  4. Assurez-vous que l’extension est autorisée à accéder à tous les sites web.

  5. Si votre projet nécessite que vous vous connectiez pour utiliser l’extension sidekick, vous devez activer les cookies tiers : Safari > Paramètres > Confidentialité > décocher la case "Empêcher le suivi intersite".

Ajout de votre projet

Il existe plusieurs façons d’ajouter des projets à l’extension sidekick :

1. Configurateur du Sidekick

2. URL de partage

  1. Accédez à une URL de partage commençant par https://www.aem.live/tools/sidekick/?...
  2. Cliquez sur le bouton bleu Ajouter un projet bouton .
    1. Vous pouvez également cliquer sur l’icône Adobe Experience Cloud en regard de la barre d’adresse de votre navigateur et sélectionner Ajouter un projet dans le menu contextuel.
  3. Une boîte de dialogue de confirmation s’affiche. Cliquez sur OK pour continuer.

Un collègue du projet peut vous fournir une URL de partage. Voir le document Utilisation de l’extension AEM Sidekick pour plus d’informations.

3. URL du projet (bureau uniquement)

  1. Accédez à une URL de projet avec un nom d’hôte comme celui-ci : https://main–repo–owner.hlx.page/
  2. Cliquez sur l’icône Adobe Experience Cloud en regard de la barre d’adresse de votre navigateur et sélectionnez Ajouter un projet dans le menu contextuel.
  3. Une boîte de dialogue de confirmation s’affiche. Cliquez sur OK pour continuer.

4. URL du référentiel GitHub (bureau uniquement)

  1. Accédez à un référentiel GitHub commençant par https://github.com/...
  2. Cliquez sur l’icône Adobe Experience Cloud en regard de la barre d’adresse de votre navigateur et sélectionnez Ajouter un projet dans le menu contextuel.
  3. Une boîte de dialogue de confirmation s’affiche. Cliquez sur OK pour continuer.

5. Page Options

La page Options répertorie toutes les configurations de projet et vous permet de les ajouter, de les modifier ou de les supprimer.

  1. Accédez à la page Options :

    1. Chrome : cliquez avec le bouton droit de la souris sur l’icône Adobe Experience Cloud en regard de la barre d’adresse et sélectionnez Options dans le menu contextuel.
    2. Safari (bureau) : cliquez avec le bouton droit de la souris sur l’icône Adobe Experience Cloud située en regard de la barre d’adresse et sélectionnez Gérer l’extension… Dans la boîte de dialogue des extensions, cliquez sur Préférences.
    3. Safari (mobile) : ouvrez les paramètres et appuyez sur Safari > Extensions > AEM Sidekick > Paramètres d’extension.
  2. Ajoutez une configuration de projet à l’aide de l’une des deux méthodes suivantes :

    1. Ajouter via l'URL de partage : la configuration du projet sera récupérée à partir des paramètres contenus dans l'URL de partage.
    2. Ajouter manuellement : saisissez l’URL du référentiel GitHub et d’autres paramètres facultatifs pour votre projet.

Présentation des configurations de projet

Éditeur de configuration de projet

  • Nom du projet : Indiquez le nom de votre projet ici. Cela donnerait un nom à la configuration du projet, ce qui faciliterait l’identification dans le sidekick. Il s’agit d’une configuration facultative.
  • URL du référentiel : Spécifiez le référentiel Github de votre projet ici. Par exemple : https://github.com/hlxsites/wknd.
    • Conseil bonus : Vous pouvez spécifier ici votre branche de référentiel pour que le code de projet soit sélectionné dans cette branche de référentiel lorsque vous l’ouvrez dans votre navigateur. Par exemple : https://github.com/hlxsites/wknd/tree/mybranch
  • URL du contenu : Spécifiez l’URL du dossier racine du projet dans la racine SharePoint / GDrive .
  • Nom d’hôte de production : Indiquez l’URL de production (le nom de domaine étant le nom d’hôte public de votre projet). Cela permet de s’assurer que le sidekick est disponible dans le navigateur lorsque vous ouvrez le site sur le domaine de production. Il s’agit d’un paramètre facultatif.

Configuration avancée

Développer localement des personnalisations de Sidekick

Paramètres de configuration de projet avancés

  • Test local de la configuration du projet : Utilisez ce paramètre avancé pour tester toutes les personnalisations locales dans le sidekick. En savoir plus sur Personnalisations du Sidekick ici.
    • URL de développement local : Spécifiez l’URL de votre serveur en cours d’exécution local. La valeur par défaut est http://localhost:3000

Ajout d’une autorisation personnalisée

Pour les sites protégés par l’authentification sur .page et .live, vous pouvez ajouter un jeton d’autorisation qui sera ajouté au HTTP. Authorization: en-tête .

Vous pouvez l’utiliser pour tester les clés d’API utilisées dans votre réseau de diffusion de contenu et vous assurer qu’elles ont accès à l’origine. Cette option est susceptible d’être utilisée uniquement par le personnel administratif à des fins de configuration et de débogage.

Installation du signet d’applet du Sidekick

Si vous ne parvenez pas à installer une extension dans votre navigateur ou si vous utilisez un navigateur qui n’est actuellement pas pris en charge par l’extension sidekick, vous pouvez utiliser un signet d’applet.

A signet est un signet ou un favori du navigateur contenant des commandes JavaScript qui ajoutent de nouvelles fonctionnalités au navigateur. Le signet d’applet du sidekick ajoute les fonctionnalités du sidekick sans nécessiter d’installation, ce qui peut s’avérer utile pour certains utilisateurs.

Comme l’extension sidekick se souvient si elle est ouverte ou fermée sur une page de contenu donnée, Adobe recommande d’installer l’extension si possible. Le marché de la bibliothèque doit toujours être ouvert et fermé manuellement sur vos pages de contenu.

Pour installer le signet d’applet :

  1. Dans votre navigateur, accédez au lien https://www.aem.live/tools/sidekick/
  2. Indiquez l’URL du référentiel GitHub de votre projet et éventuellement un nom pour le projet, puis cliquez sur Aller.
    1. Le sidekick prend en charge plusieurs projets et fournit un nom explicite pour gérer les configurations.
  3. Une nouvelle section appelée Installer le signet d’applet du Sidekick pour ce projet s’affiche sur la page avec un bouton.
    Configuration du Sidekick avec l’extension de Sidekick installée et configurée pour le projet
  4. Faites glisser le bouton sur vos signets ou barre d’outils préférée.
  5. Cliquez sur le signet d’applet dans la barre d’outils des signets ou des favoris pour le basculer.

Utilisation de l’extension Sidekick

Consultez le document Utilisation du AEM Sidekick pour savoir comment utiliser le sidekick.

recommendation-more-help
10a6ce9d-c5c5-48d9-8ce1-9797d2f0f3ec