Cas d’utilisation

Créez votre instance Cloud Service à l’aide des options suivantes :

1. Sélectionnez Sandbox dans le menu déroulant Environnement.
2. Sélectionnez Adobe Store dans le menu déroulant Tester les données.

Connexion à votre compte Adobe Experience Cloud

Configurez votre storefront Cloud Service à l’aide des options suivantes :

1. Sélectionnez adobe-commerce/adobe-demo-store pour le modèle.
2. Sélectionnez Choisir une instance disponible (maillage -> SaaS) pour la méthode de connexion.

Dans Commerce Admin, accédez à Magasins > Settings > Configuration > Modes de paiement.

Dans la section Configuration générale, saisissez vos Payment Services Sandbox ID et Payment Services Sandbox Key. Vous pouvez obtenir ces identifiants en suivant les étapes décrites dans Intégration des sandbox

Définissez la liste déroulante Activer sur Oui.

Cliquez sur Enregistrer la configuration.

Accédez au storefront créé dans les conditions préalables.

Recherchez et sélectionnez un produit. Effectuez les sélections de personnalisation nécessaires. Cliquez ensuite sur Ajouter au panier.

{width="600" modal="regular"}

Sélectionnez l’icône de panier pour afficher votre panier.

{width="600" modal="regular"}

Cliquez sur Extraire.

{width="600" modal="regular"}

Saisissez les coordonnées et les informations d’expédition requises. Vous pouvez utiliser des informations fictives pour cette commande.

Pour passer en caisse, sélectionnez Chèque / Mandat. Si vous souhaitez utiliser une carte de crédit, utilisez l'une des cartes test fournies par Paypal. Vous pouvez les utiliser avec n’importe quelle date d’expiration future et n’importe quel CVC.

{width="600" modal="regular"} {width="600" modal="regular"}

Cliquez sur Passer une commande.

Ouvrez l’Administration Commerce : <your store URL>/admin.

Connectez-vous à l’aide de votre Adobe ID.

Accédez à Ventes > Commandes.

{width="600" modal="regular"}

Recherchez la commande que vous avez passée et confirmez les détails.

{width="600" modal="regular"}

Ouvrez le storefront créé dans les conditions préalables.

Ouvrez Storefront Builder. En accédant à https://da.live/#/<GitHub User Name>/<Repository Name>/main/da/index.md.

Ouvrez la page Index.

Sous le bloc Carrousel, saisissez un nouveau titre en modifiant la ligne « Bienvenue dans la démonstration de la boutique Adobe ».

Cliquez sur l’icône d’envoi, puis sur Aperçu.

Vérifiez la page d’aperçu et cliquez sur Publier.

Actualisez la page du storefront et confirmez que vos modifications sont maintenant actives.

Dans Storefront Builder, sélectionnez votre page d’index et cliquez sur Copier.

Créez un dossier expériences sous le dossier principal, en cliquant sur le bouton Nouveau et en sélectionnant Dossier.

Créez un dossier nommé 1234 dans le dossier expériences.

Collez les deux copies de la page d’index dans le dossier 1234.

Ouvrez chaque page et renommez-les « homev1 » et « homev2 ». Ce sont vos challengers.

Modifiez chaque page pour inclure un contenu différent. Par exemple, modifiez l’image principale ou le texte. Vous devez être en mesure d'identifier les différences entre chaque page.

Publiez chacune de vos pages de challenger.

Ouvrez la page de contrôle, la page d'index d'origine.

Ajoutez un nouveau bloc avec le titre métadonnées.

Ajoutez les informations suivantes aux lignes du bloc de métadonnées

• Titre - Adobe Commerce

• Description - Boutique web

• Expérience - 1234

• Variantes d’expérience

  • https://<your-site>.aem.live/experiments/1234/indexv1
  • https://<your-site>.aem.live/experiments/1234/indexv2

{width="600" modal="regular"}

Ouvrez une fenêtre de navigation privée ou privée et accédez à la page principale.

Fermez la fenêtre de navigation privée et répétez l'étape précédente. Chaque fois que vous ouvrez la page, une variante aléatoire que vous avez créée s’affiche.

Ouvrez le storefront créé dans les conditions préalables et accédez à un élément à modifier. Notez le SKU ou le code de produit des éléments.

Ouvrez AEM Assets en le sélectionnant dans Adobe Experience Cloud.

{width="600" modal="regular"}

Cliquez sur Assets.

{width="600" modal="regular"}

Recherchez l’article par SKU ou Code de produit.

Sélectionnez l’élément à modifier, puis cliquez sur Ouvrir dans Adobe Express.

{width="600" modal="regular"}

Dans le panneau Image, sélectionnez Insérer un objet.

{width="600" modal="regular"}

Dans la zone de texte, décrivez l’image que vous souhaitez ajouter. Par exemple, « les pins enneigés ».

{width="600" modal="regular"}

Ajustez la Brush size et dessinez à l’endroit où vous souhaitez ajouter l’image générée. Pour cet exemple, dessinez autour de l’objet existant pour sélectionner l’arrière-plan.

Cliquez sur Générer pour afficher les résultats.

Choisissez parmi les différents résultats, en sélectionnant l'option souhaitée et en cliquant sur Conserver.

Cliquez sur Vos affaires pour revenir à l’éditeur d’image.

Cliquez sur Enregistrer pour spécifier le type d’image.

Cliquez de nouveau sur Enregistrer pour enregistrer les modifications.

Dans la boîte de dialogue Enregistrer la ressource, sélectionnez le Commerce Dossier de destination.

{width="600" modal="regular"}

Cliquez sur Enregistrer en tant que nouvelle ressource pour enregistrer l’image.

Dans le Panneau de navigation d’AEM as a Cloud Service, sélectionnez Assets > Fichiers > Commerce et cliquez sur la ressource que vous avez créée dans la section précédente.

{width="600" modal="regular"}

Cliquez sur Propriétés.

{width="600" modal="regular"}

Sélectionnez l’onglet Commerce.

{width="600" modal="regular"}

Vérifiez que le existe-t-il dans Adobe Commerce ? champ est défini sur Oui.

Cliquez sur Ajouter et saisissez le SKU du produit auquel vous souhaitez ajouter la ressource.

{width="600" modal="regular"}

Sélectionnez la position et le type de la ressource.

Sélectionnez l’onglet De base et modifiez l’onglet Statut de la révision en Approuvé.

{width="600" modal="regular"}

Cliquez sur Enregistrer et fermer.

Dans Adobe Commerce Admin, accédez à Catalogue > Produits.

Sélectionnez le produit auquel vous avez ajouté l’image dans la section précédente.

Développez la section Images et vidéos.

{width="600" modal="regular"}

Vérifiez que votre image est maintenant disponible dans la liste des images.

Revenez à votre storefront et accédez à la page du produit modifié.

Vérifiez que la nouvelle image s’affiche.

{width="600" modal="regular"}

Ouvrez votre site storefront à l’aide de l’éditeur universel.

Sélectionnez le bloc de texte à modifier.

Dans le panneau Propriétés, cliquez sur Générer des variations.

Cliquez sur le bouton Générer.

Sélectionnez ou personnalisez le texte généré.

Cliquez sur Publier pour mettre à jour votre storefront.

Ouvrez ​ Générer des variations ​

Sélectionnez le modèle Bannière héroïque.

Dans la zone de texte Expliquer l’interaction utilisateur, saisissez : « Expérience permettant aux employés et aux partenaires d’Adobe d’acheter des équipements de marque Adobe ! ».

Dans l’URL pour la connaissance de domaine, saisissez www.adobestore.com.

Cliquez sur Générer.

Sélectionnez une variation de contenu et cliquez sur Générer une image.

Dans la liste déroulante Taille de l’image, sélectionnez Écran large (16:9).

Dans la liste déroulante Type de contenu, sélectionnez Photo.

Pour l’image de référence Style, sélectionnez la bannière de magasin Adobe existante.

Sélectionnez l’image générée à utiliser, puis cliquez sur Enregistrer.

Répétez ce processus avec d’autres images de référence pour générer d’autres variations.