

Les traductions sont fournies par des outils de traduction automatique. En cas de conflit entre le contenu d'une traduction et celui de la version originale en anglais, la version anglaise prévaudra.

# Ajout de messages interactifs Amazon Lex pour les clients dans une session de chat
<a name="interactive-messages"></a>

Les messages interactifs sont des messages enrichis qui présentent une invite et des options d’affichage préconfigurées que le client peut choisir. Ces messages sont alimentés par Amazon Lex et configurés via Amazon Lex à l'aide d'une AWS Lambda fonction. 

**Astuce**  
Si vous avez intégré Apple Messages for Business, consultez [Types de messages interactifs](https://register.apple.com/resources/messages/msp-rest-api/type-interactive) sur le site Web d’Apple.

## Limites de validation
<a name="validation-limits"></a>

Les limites des champs de chaîne (par exemple, titre, sous-titre, etc.) devraient être appliquées par le client (c’est-à-dire une interface personnalisée ou le widget de communication hébergé). L'[SendMessage](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_SendMessage.html)API vérifie uniquement que la taille totale de la chaîne est inférieure à 20 Ko.
+ Lorsque vous utilisez le widget de communication hébergé sans le personnaliser, si la chaîne dépasse les limites de champs, elle est tronquée sur l’interface utilisateur et des points de suspension (…) sont ajoutés. Vous pouvez déterminer comment appliquer les limites de champ en personnalisant le widget. 
+ Si vous effectuez une intégration avec d’autres plateformes (comme Apple Messages for Business), consultez les limites indiquées dans cette rubrique pour Amazon Connect, ainsi que celles de la documentation relative à l’autre plateforme. Par exemple, les réponses rapides ne sont pas prises en charge sur les anciennes versions d’iOS. 

Toutes les autres limites de champs doivent être respectées pour que le message soit correctement envoyé.

## Modèles d’affichage de messages
<a name="message-display-templates"></a>

Amazon Connect fournit les modèles d’affichage de messages suivants. Utilisez-les pour présenter des informations aux clients dans une session de chat :
+  [Sélecteur de liste](#list-picker)
+ [Sélecteur de temps](#time-picker)
+ [Panneau](#panel)
+ [Réponse rapide](#quick-reply-template)
+ [Carrousel](#carousel-template)
+ [Modèle de formulaire Apple](#apple-form-template)
+ [Modèle Apple Pay](#apple-pay-template)
+ [Modèle d’application iMessage](#imessage-app-template)
+ [WhatsApp liste](#whatsapp-list)
+ [WhatsApp bouton de réponse](#whatsapp-reply-button)
+ [Formatage riche en titres et sous-titres](#rich-link-formatting)

Ces modèles définissent le mode de rendu des informations et les informations qui apparaissent dans l’interface de chat. Lorsque des messages interactifs sont envoyés par chat, les flux vérifient que le format du message suit l’un de ces modèles.

## Modèle de sélecteur de liste
<a name="list-picker"></a>

Utilisez le modèle de sélecteur de liste pour présenter au client une liste de six choix maximum. Chaque choix peut comporter sa propre image. 

Les images suivantes montrent deux exemples de la manière dont le modèle de sélecteur de liste affiche les informations dans un chat. 
+ Une image montre trois boutons, chacun portant le nom d’un fruit dans le texte : pomme, orange, banane.
+ La seconde image montre la photo d’un magasin, ainsi que trois boutons, au-dessous, comportant chacun le nom, l’image et le prix du fruit.

![\[Modèle de sélecteur de liste affichant des informations dans un chat\]](http://docs.aws.amazon.com/fr_fr/connect/latest/adminguide/images/interactive-messages-listpicker-images2.png)


Le code suivant est le modèle de sélecteur de liste que vous pouvez utiliser dans votre fonction Lambda. Notez ce qui suit :
+ Le **texte en gras** indique un paramètre obligatoire.
+ Dans certains cas, si l’élément parent n’est pas obligatoire, mais que les champs qu’il contient le sont, ces champs sont obligatoires. Par exemple, examinez la structure `data.replyMessage` dans le modèle suivant. Si cette structure existe, `title` est obligatoire. Sinon, l’élément `replyMessage` complet est facultatif. 

```
{
   "templateType":"ListPicker",                       
   "version":"1.0",                                   
   "data":{                                           
      "replyMessage":{                             
         "title":"Thanks for selecting!",             
         "subtitle":"Produce selected",
         "imageType":"URL",                                
         "imageData":"https://interactive-msg.s3-us-west-2.amazonaws.com/fruit_34.3kb.jpg",                          
         "imageDescription":"Select a produce to buy"
      },
      "content":{                                       
         "title":"What produce would you like to buy?",
         "subtitle":"Tap to select option",
         "imageType":"URL",                       
         "imageData":"https://interactive-msg.s3-us-west-2.amazonaws.com/fruit_34.3kb.jpg",                  
         "imageDescription":"Select a produce to buy",
         "elements":[                                   
            {
               "title":"Apple",                          
               "subtitle":"$1.00",
               "imageType":"URL",
               "imageData":"https://interactive-message-testing.s3-us-west-2.amazonaws.com/apple_4.2kb.jpg"
            },
            {
               "title":"Orange",                         
               "subtitle":"$1.50",
               "imageType":"URL",                  
               "imageData":"https://interactive-message-testing.s3-us-west-2.amazonaws.com/orange_17.7kb.jpg",           
            },
             {
               "title":"Banana",                         
               "subtitle":"$10.00",
               "imageType":"URL",                  
               "imageData":"https://interactive-message-testing.s3-us-west-2.amazonaws.com/banana_7.9kb.jpg",            
               "imageDescription":"Banana"
            }
         ]
      }
```

### Limites du sélecteur de liste
<a name="list-picker-limits"></a>

Le tableau suivant répertorie les limites pour chacun des éléments du sélecteur de liste, si vous choisissez de créer votre propre fonction Lambda à partir de zéro. Les paramètres obligatoires sont affichés en gras.

Pour envoyer un nombre illimité d’options, implémentez des boutons d’action dans votre application. Pour plus d’informations, consultez [Implementation of action buttons in interactive message list picker/panel](https://github.com/amazon-connect/amazon-connect-chat-interface/blob/master/.github/docs/InteractiveMessageActionButtonImplementation.md). 


****  
[\[See the AWS documentation website for more details\]](http://docs.aws.amazon.com/fr_fr/connect/latest/adminguide/interactive-messages.html)

**Note**  
Si vous utilisez le champ `targetForLinks` et le widget de communication Amazon Connect, pour ouvrir des liens dans le même onglet de navigateur, vous devez ajouter l’attribut suivant à l’extrait de code du widget afin de permettre à l’iframe actuel d’ouvrir et de parcourir les liens dans le même onglet :  

```
amazon_connect('updateSandboxAttributes', 'allow-scripts allow-same-origin allow-popups allow-downloads allow-top-navigation-by-user-activation')                                       
```

## Modèle de sélecteur de temps
<a name="time-picker"></a>

Le modèle de sélecteur d’heure est utile pour permettre aux clients de planifier des rendez-vous. Vous pouvez fournir jusqu’à 40 créneaux horaires au client dans un chat. 

Les images suivantes montrent deux exemples de la manière dont le modèle de sélecteur de temps affiche les informations dans un chat.
+ Une image montre une date et, en dessous, un créneau horaire.
+ La seconde image montre une date et, en dessous, deux créneaux horaires.

![\[Modèle de sélecteur de temps affichant des informations dans un chat\]](http://docs.aws.amazon.com/fr_fr/connect/latest/adminguide/images/interactive-messages-timepicker.png)


L’image suivante montre le sélecteur de temps avec une image

**Note**  
Si vous utilisez ce modèle de message avec le canal [Apple Messages for Business](apple-messages-for-business.md) et que vous n’ajoutez pas d’image, Amazon Connect ajoutera une image par défaut à la fois dans la réponse et dans le message de réponse.

![\[Sélecteur de temps avec une image.\]](http://docs.aws.amazon.com/fr_fr/connect/latest/adminguide/images/interactive-messages-timepicker-with-image.png)


Le code suivant est le modèle de sélecteur de temps que vous pouvez utiliser dans votre fonction Lambda. Notez ce qui suit :
+ Le **texte en gras** indique un paramètre obligatoire.
+ Dans certains cas, si l’élément parent n’est pas obligatoire, mais que les champs qu’il contient le sont, ces champs sont obligatoires. Par exemple, examinez la structure `data.replyMessage` dans le modèle suivant. Si cette structure existe, `title` est obligatoire. Sinon, l’élément `replyMessage` complet est facultatif. 

```
{
   "templateType":"TimePicker",                                 
   "version":"1.0",                                             
   "data":{                                                    
      "replyMessage":{
         "title":"Thanks for selecting",                        
         "subtitle":"Appointment selected",
         "imageType":"URL",                                       
         "imageData":"https://interactive-msg.s3-us-west-2.amazonaws.com/booked.jpg",
         "imageDescription":"Appointment booked"
      },
      "content":{                                               
         "title":"Schedule appointment",                       
         "subtitle":"Tap to select option",
         "imageType":"URL",                                       
         "imageData":"https://interactive-msg.s3-us-west-2.amazonaws.com/calendar.jpg",
         "imageDescription":"Appointment booked",
         "timeZoneOffset":-450,
         "location":{
            "latitude":47.616299,                               
            "longitude":-122.4311,                              
            "title":"Oscar",                                    
            "radius":1,
         },
         "timeslots":[                                          
               {
                  "date" : "2020-10-31T17:00+00:00",             
                  "duration": 60,                               
               },
               {
                  "date" : "2020-11-15T13:00+00:00",            
                  "duration": 60,                              
               },
               {
                  "date" : "2020-11-15T16:00+00:00",            
                  "duration": 60,                              
               }
            ],           
         }
      }
   }
}
```

### Limites du sélecteur de temps
<a name="time-picker-limits"></a>

Le tableau suivant répertorie les limites de tous les éléments d’un sélecteur de temps. Utilisez ces informations si vous choisissez de créer votre propre fonction Lambda à partir de zéro. Les paramètres obligatoires sont affichés en gras.


****  
[\[See the AWS documentation website for more details\]](http://docs.aws.amazon.com/fr_fr/connect/latest/adminguide/interactive-messages.html)

## Modèle de panneau
<a name="panel"></a>

En utilisant le modèle de panneau, vous pouvez présenter au client jusqu’à 10 choix pour une question. Toutefois, vous pouvez inclure une seule image, au lieu d’une image pour chaque choix. 

L’image suivante montre un exemple de la façon dont le modèle de panneau affiche les informations dans un chat. Il montre une image en haut du message et, sous l’image, une invite qui demande *Comment puis-je vous aider ? Appuyez pour sélectionner une option*. Sous cette invite, trois options sont affichées pour le client : **Vérifier les options de libre-service**, **Parler à un agent**, **Mettre fin à la conversation**. 

![\[Modèle de panneau affichant des informations dans un chat.\]](http://docs.aws.amazon.com/fr_fr/connect/latest/adminguide/images/interactive-messages-panel1.png)


Le code suivant est le modèle de panneau que vous pouvez utiliser dans votre fonction Lambda. Notez ce qui suit :
+ Le **texte en gras** indique un paramètre obligatoire.
+ Dans certains cas, si l’élément parent n’est pas obligatoire, mais que les champs qu’il contient le sont, ces champs sont obligatoires. Par exemple, examinez la structure `data.replyMessage` dans le modèle suivant. Si cette structure existe, un attribut `title` est obligatoire. Sinon, l’élément `replyMessage` complet est facultatif.

```
{
   "templateType":"Panel",                            
   "version":"1.0",                                   
   "data":{                                          
      "replyMessage":{                             
         "title":"Thanks for selecting!",             
         "subtitle":"Option selected",
      },
      "content":{                                      
         "title":"How can I help you?",                
         "subtitle":"Tap to select option",
         "imageType":"URL",                       
         "imageData":"https://interactive-msg.s3-us-west-2.amazonaws.com/company.jpg",                  
         "imageDescription":"Select an option",
         "elements":[                                 
            {
               "title":"Check self-service options",   
            },
            {
               "title":"Talk to an agent",                     
            },
            {
               "title":"End chat",                    
            }
         ]
      }
   }
}
```

### Limites du panneau
<a name="panel-limits"></a>

Le tableau suivant répertorie les limites pour chacun des éléments du panneau, si vous choisissez de créer votre propre fonction Lambda à partir de zéro. Les paramètres obligatoires sont affichés en gras.

Pour envoyer un nombre illimité d’options, implémentez des boutons d’action dans votre application. Pour plus d’informations, consultez [Implementation of action buttons in interactive message list picker/panel](https://github.com/amazon-connect/amazon-connect-chat-interface/blob/master/.github/docs/InteractiveMessageActionButtonImplementation.md). 


****  
[\[See the AWS documentation website for more details\]](http://docs.aws.amazon.com/fr_fr/connect/latest/adminguide/interactive-messages.html)

## Modèle de réponse rapide
<a name="quick-reply-template"></a>

Utilisez des messages de réponse rapide pour obtenir des réponses simples de la part des clients, puis pour les soumettre aux clients dans une liste intégrée. Les images ne sont pas prises en charge pour les réponses rapides.

L’image suivante montre un exemple de la façon dont le modèle de réponse rapide affiche des informations dans un chat.

![\[Modèle de panneau affichant des informations dans un chat.\]](http://docs.aws.amazon.com/fr_fr/connect/latest/adminguide/images/quick-reply-template.png)


Le code suivant est le modèle de réponse rapide que vous pouvez utiliser dans votre fonction Lambda.

```
{
    "templateType": "QuickReply",
    "version": "1.0",
    "data": {
        "replyMessage": {
            "title": "Thanks for selecting!"
        },
        "content": {
            "title": "Which department would you like?",
            "elements": [{
                    "title": "Billing"
                },
                {
                    "title": "Cancellation"
                },
                {
                    "title": "New Service"
                }
            ]
        }
    }
}
```

### Limites de réponse rapide
<a name="quickreply-limits"></a>

Le tableau suivant répertorie les limites pour tous les éléments de réponse rapide. Utilisez ces informations si vous choisissez de créer votre propre fonction Lambda à partir de zéro. Les paramètres obligatoires sont affichés en gras.


****  
[\[See the AWS documentation website for more details\]](http://docs.aws.amazon.com/fr_fr/connect/latest/adminguide/interactive-messages.html)

## Modèle de carrousel
<a name="carousel-template"></a>

Utilisez des carrousels pour présenter jusqu’à 5 sélecteurs de listes ou panneaux aux clients dans un même message. À l’instar du sélecteur de liste et du sélecteur de temps, vous pouvez ajouter d’autres options au carrousel à l’aide de la fonctionnalité SHOW\$1MORE.

Le GIF suivant montre un exemple de la façon dont le modèle de carrousel affiche des informations dans un chat. Les clients font défiler le carrousel d’images à l’aide des flèches gauche et droite. 

![\[Carrousel dans l’expérience de chat d’un client.\]](http://docs.aws.amazon.com/fr_fr/connect/latest/adminguide/images/carousel-interactive.gif)


L’image suivante montre deux liens hypertexte **En savoir plus**, qui sont des exemples d’éléments de liens hypertexte du sélecteur de carrousel.

![\[Sélecteur de carrousel avec des liens hypertexte\]](http://docs.aws.amazon.com/fr_fr/connect/latest/adminguide/images/carousel-interactive1.png)


Le code suivant est le modèle de carrousel que vous pouvez utiliser dans votre fonction Lambda. 

```
{
  "templateType": "Carousel",            
  "version": "1.0",                      
  "data": {                              
      "content": {                           
        "title": "View our popular destinations",   
        "elements": [                               
        {
          "templateIdentifier": "template0",        
          "templateType": "Panel",
          "version": "1.0",
          "data": {
            "content": {
              "title": "California",
              "subtitle": "Tap to select option",
              "elements": [
                {
                  "title": "Book flights"
                },
                {
                  "title": "Book hotels"
                },
                {
                  "title": "Talk to agent"
                }
              ]
            }
          }
        },
        {
          "templateIdentifier": "template1",   
          "templateType": "Panel",
          "version": "1.0",
          "data": {
            "content": {
              "title": "New York",
              "subtitle": "Tap to select option",
              "elements": [
                {
                  "title": "Book flights"
                },
                {
                  "title": "Book hotels"
                },
                {
                  "title": "Talk to agent"
                }
              ]
            }
          }
        }
      ]
    }
  }
}
```

Pour les utilisateurs du widget de communication hébergé :
+ Les sélections du modèle de carrousel donnent lieu à une réponse sous forme de chaîne JSON structurée comme dans l’exemple suivant, à renvoyer à Lambda (les autres types de messages interactifs renvoient une réponse sous forme de chaîne normale avec uniquement une valeur `selectionText`) :

  ```
  {
      templateIdentifier: "template0",
      listTitle: "California",
      selectionText: "Book hotels"
  }
  ```
+ Dans les carrousels, vous pouvez fournir des hyperliens dans les éléments de la liste. picker/panel Pour créer un lien hypertexte à la place d’un bouton, incluez les champs supplémentaires suivants pour l’élément qui doit être un lien hypertexte :

  ```
  {
      title: "Book flights",
      ...
      type: "hyperlink",
      url: "https://www.example.com/Flights"
  }
  ```

### Limites de carrousel
<a name="carousel-limits"></a>

Le tableau suivant répertorie les limites de tous les éléments de carrousel. Utilisez ces informations si vous choisissez de créer votre propre fonction Lambda à partir de zéro. Les paramètres obligatoires sont affichés en gras.


****  
[\[See the AWS documentation website for more details\]](http://docs.aws.amazon.com/fr_fr/connect/latest/adminguide/interactive-messages.html)

## Modèle de formulaire Apple
<a name="apple-form-template"></a>

**Note**  
 Ce modèle s’applique uniquement aux flux de contacts d’Apple Messages for Business. 

Une entreprise peut envoyer un message interactif sous forme de formulaire à ses clients finaux par le biais d’un seul message contenant plusieurs pages d’informations à remplir. Lorsque ce message est reçu sur l’appareil Apple du client final, ce dernier peut ouvrir le formulaire et parcourir les pages, en fournissant une réponse pour chaque page, avant de soumettre toutes les réponses à la fin du formulaire.

Par exemple, les entreprises peuvent utiliser les formulaires Apple à diverses fins, notamment pour le tri des flux, les enquêtes clients et la création de comptes.

**Avertissement**  
Le contenu des messages interactifs et les réponses des clients finaux sont stockés dans la transcription des enregistrements de contacts et peuvent être consultés par les autres participants au chat ainsi que les analystes de contacts ayant accès aux transcriptions. Pour éviter que des informations personnelles n'apparaissent dans la transcription de votre enregistrement de **contact une fois le contact terminé**, vous devez utiliser le [bloc Définir le comportement d'enregistrement et d'analyse](set-recording-behavior.md) dans votre flux de step-by-step guideContact Lens, [activer](sensitive-data-redaction.md) et activer la rédaction des données sensibles. Pour des détails complets sur la façon d’activer l’expurgation des données d’identification personnelle, consultez [Activation de l’expurgation de données sensibles](enable-analytics.md#enable-redaction).

 Les types de pages prises en charge sont les suivantes :
+ **ListPicker**: une liste d'options parmi lesquelles l'utilisateur doit sélectionner avec prise en charge des images.
+ **WheelPicker**: similaire ListPicker mais la sélection se fait via une molette d'options défilante.
+ **DatePicker**: une vue du calendrier où l'utilisateur peut choisir une date.
+ **Input** : champ de texte que l’utilisateur doit remplir.

Le code suivant est un exemple de modèle de formulaires Apple que vous pouvez utiliser dans votre fonction Lambda.

**Note**  
 Le **texte en gras** est un paramètre obligatoire. 
 Dans certains cas, si l’élément parent existe dans la demande et qu’il n’est pas obligatoire/en gras, mais que les champs qu’il contient le sont, les champs sont obligatoires. 

 Exemple de formulaire de sondage simple : 

```
{
  "templateType": "AppleForm",
  "version": "1.0",
  "data": {
    "content": {
      "title": "Survey",
      "pages": [
        {
          "pageType": "DatePicker",
          "title": "Date you visited",
          "subtitle": "When did you last visit?",
          "minDate": "2024-01-02"
        },
        {
          "pageType": "ListPicker",
          "title": "Rating",
          "subtitle": "How do you rate the experience?",
          "items": [
            {
              "title": "Good",
              "imageType": "URL",
              "imageData": "https://mybucket.s3.us-west-2.amazonaws.com/good.jpg"
            },
            {
              "title": "Okay",
              "imageType": "URL",
              "imageData": "https://mybucket.s3.us-west-2.amazonaws.com/okay.jpg"
            },
            {
              "title": "Poor",
              "imageType": "URL",
              "imageData": "https://mybucket.s3.us-west-2.amazonaws.com/poor.jpg"
            }
          ]
        },
        {
          "pageType": "ListPicker",
          "title": "Dine type",
          "subtitle": "Select all dine types that apply",
          "multiSelect": true,
          "items": [
            {
              "title": "Pickup"
            },
            {
              "title": "Dine-in"
            },
            {
              "title": "Delivery"
            }
          ]
        },
        {
          "pageType": "WheelPicker",
          "title": "Visits",
          "subtitle": "How often do you visit?",
          "items": [
            {
              "title": "Often"
            }
            {
              "title": "Sometimes"
            },
            {
              "title": "Rarely"
            }
          ]
        },
        {
          "pageType": "Input",
          "title": "Additional notes",
          "subtitle": "Anything else you'd like to mention about your visit?",
          "multiLine": true
        }
      ]
    }
  }
}
```

### Limites des formulaires Apple
<a name="apple-forms-limits"></a>

#### InteractiveMessage
<a name="apple-forms-limits-interactivemessage"></a>


| Champ  | Type  | Obligatoire  | Description/Remarques  | 
| --- | --- | --- | --- | 
| version | chaîne  | Oui  | Numéro de version. Valeur autorisée : 1.0  | 
| templateType  | TemplateType  | Oui  | Type de modèle de message interactif. Valeurs autorisées : [» ListPicker «," TimePicker «, « Panel », "QuickReply«, « Carousel », "ViewResource«," AppleForm«]  | 
| données | InteractiveMessageData  | Oui  | Données de message interactif  | 

#### InteractiveMessageData
<a name="apple-forms-limits-interactivemessagedata"></a>


| Champ  | Type  | Obligatoire  | Description/Remarques  | 
| --- | --- | --- | --- | 
| content  | InteractiveMessageContent  | Oui  | Contenu de message interactif principal  | 
| replyMessage  | ReplyMessage  | Non  | Configuration de l’affichage des messages après l’envoi de la réponse à un message interactif  | 

#### AppleFormContent
<a name="apple-forms-limits-appleformcontent"></a>


| Champ  | Type  | Obligatoire  | Description/Remarques  | 
| --- | --- | --- | --- | 
| title  | String  | Oui  | Titre de haut niveau du formulaire. Affiché dans la bulle des messages de réception et dans le rendu de la transcription Apple  | 
| subtitle  | String  | Non  | Utilisé comme sous-titre dans ReceivedMessage  | 
| imageType  | String  | Non  | Valeurs valides : « URL » utilisée pour l'image dans ReceivedMessage  | 
| imageData  | String  | Non  | URL de l'image S3 utilisée pour l'image dans ReceivedMessage  | 
| pages | AppleFormPage[]  | Oui  | Liste des pages du formulaire  | 
| showSummary  | Booléen  | Non  | Afficher ou non une page récapitulative des réponses à examiner avant la soumission Par défaut : False (aucune confirmation/summary page)  | 
| splashPage  | AppleFormSplashPage  | Non  | Page de démarrage initiale à afficher avant les pages réelles (par défaut : pas de page de démarrage)  | 

#### AppleFormSplashPage
<a name="apple-forms-limits-appleformsplashpage"></a>


| Champ  | Type  | Obligatoire  | Description/Remarques  | 
| --- | --- | --- | --- | 
| title  | String  | Oui  | Titre de la page de démarrage  | 
| subtitle  | String  | Non  | Sous-titre/corps de la page démarrage  | 
| imageType  | ImageType  | Non  | Présent lors de l’affichage de l’image dans la page de démarrage (valeur autorisée : « URL » ; par défaut : aucune image affichée)  | 
| imageData  | String  | Non  | Pour imageType="URL", il s’agit de la valeur d’URL Par défaut : aucune image affichée  | 
| buttonTitle  | String  | Oui  | Texte du bouton Continuer. Requis par Apple, texte par défaut dont la localisation n’est pas prise en charge  | 

#### AppleFormPage
<a name="apple-forms-limits-appleformpage"></a>
+  Modèle de base pour les pages de formulaires. Des types de pages spécifiques s’étendent à partir de ce modèle 


| Champ  | Type  | Obligatoire  | Description/Remarques  | 
| --- | --- | --- | --- | 
| pageType  | ApplePageType  | Oui  | Enum pour le type de page. Valeurs autorisées : ["Input », "DatePicker«," WheelPicker «," ListPicker «]  | 
| title  | String  | Oui  | Titre de la page  | 
| subtitle  | String  | Oui  | Sous-titre de page. Utilisé dans la page de confirmation  | 

#### AppleFormDatePickerPage
<a name="apple-forms-limits-appleformdatapickerpage"></a>

 **AppleFormDatePickerPage**s'étend [AppleFormPage](#apple-forms-limits-appleformpage) 


| Champ  | Type  | Obligatoire  | Description/Remarques  | 
| --- | --- | --- | --- | 
| pageType  | ApplePageType  | Oui  | Valeur : « DatePicker »  | 
| labelText  | String  | Non  | Texte affiché à côté de la date saisie. Voir des exemples de captures d’écran en annexe  | 
| helperText  | String  | Non  | Texte d’aide affiché sous la date saisie. Voir des exemples de captures d’écran dans l’annexe (par défaut : aucun texte d’assistance)  | 
| dateFormat  | String  | Non  | Format de date ISO 8601. Valeur par défaut : MM/dd/yyyy  | 
| startDate  | String  | Non  | Date initiale/date par défaut sélectionnée dans un format de date valide (par défaut : date actuelle pour l’utilisateur final lorsque le message est envoyé)  | 
| minDate  | String  | Non  | Date minimale autorisée à être sélectionnée dans un format de date valide (par défaut : aucune date minimale)  | 
| maxDate  | String  | Non  | Date maximale autorisée à être sélectionnée dans un format de date valide (par défaut : date actuelle pour l’utilisateur final lorsque le message est envoyé)  | 

#### AppleFormListPickerPage
<a name="apple-forms-limits-appleformlistpickerpage"></a>

 **AppleFormListPickerPage**s'étend [AppleFormPage](#apple-forms-limits-appleformpage) 


| Champ  | Type  | Obligatoire  | Description/Remarques  | 
| --- | --- | --- | --- | 
| pageType  | ApplePageType  | Oui  | Valeur : « ListPicker »  | 
| multiSelect  | Booléen  | Non  | Permet de sélectionner plusieurs éléments (par défaut : faux (sélection unique))  | 
| items  | AppleFormListPickerPageItem[]  | Oui  | Liste des éléments de la page de liste  | 

#### AppleFormListPickerPageItem
<a name="apple-forms-limits-appleformlistpickerpageitem"></a>

 **AppleFormListPickerPageItem**s'étend [AppleFormPage](#apple-forms-limits-appleformpage) 


| Champ  | Type  | Obligatoire  | Description/Remarques  | 
| --- | --- | --- | --- | 
| title  | String  | Oui  | Texte d’affichage de l’élément  | 
| imageType  | ImageType  | Non  | Présent lors de l’affichage de l’image dans l’élément (valeur autorisée : « URL » ; par défaut : aucune image affichée)  | 
| imageData  | String  | Non  | Pour imageType="URL", il s’agit de la valeur d’URL Par défaut : aucune image affichée  | 

**Note**  
Modèle d'image similaire aux modèles de messages interactifs existants (ListPicker), sauf qu'`imageDescription`il n'est pas inclus, il est utilisé pour le texte alternatif de l'image dans les widgets de chat ou les discussions Web et ignoré pour les messages interactifs Apple.

#### AppleFormWheelPickerPage
<a name="apple-forms-limits-appleformwheelpickerpage"></a>

 **AppleFormWheelPickerPage**s'étend [AppleFormPage](#apple-forms-limits-appleformpage) 


| Champ  | Type  | Obligatoire  | Description/Remarques  | 
| --- | --- | --- | --- | 
| pageType  | ApplePageType  | Oui  | Valeur : « WheelPicker »  | 
| items  | AppleFormWheelPickerPageItem[]  | Oui  | Liste d’éléments du sélecteur à molette  | 
| labelText  | String  | Non  | Texte affiché à côté de l’entrée. Voir des exemples de captures d’écran en annexe  | 

#### AppleFormWheelPickerPageItem
<a name="apple-forms-limits-appleformwheelpickerpageitem"></a>

 **AppleFormWheelPickerPageItem**s'étend [AppleFormPage](#apple-forms-limits-appleformpage) 


| Champ  | Type  | Obligatoire  | Description/Remarques  | 
| --- | --- | --- | --- | 
| title  | String  | Oui  | Texte d’affichage de l’élément de sélection  | 

#### AppleFormInputPage
<a name="apple-forms-limits-appleforminputpage"></a>

 **AppleFormInputPage**s'étend [AppleFormPage](#apple-forms-limits-appleformpage) 


| Champ  | Type  | Obligatoire  | Description/Remarques  | 
| --- | --- | --- | --- | 
| pageType  | ApplePageType  | Oui  | Valeur : Input  | 
| labelText  | String  | Non  | Texte affiché à côté de la zone de saisie. Voir des exemples de captures d’écran en annexe  | 
| helperText  | String  | Non  | Texte supplémentaire affiché sous la zone de saisie (par défaut : aucun texte d’assistance)  | 
| placeholderText  | String  | Non  | Texte de remplacement à afficher initialement en l’absence d’entrée (par défaut : « (Facultatif) » ou « (Obligatoire) »)  | 
| prefixText  | String  | Non  | Préfixe le texte à afficher à côté de l’entrée. Par exemple : \$1 lorsque l’entrée est une valeur monétaire (par défaut : aucun texte de préfixe)  | 
| requis | Booléen  | Non  | Indique si l’utilisateur final doit fournir une entrée (par défaut : faux)  | 
| multiLine  | Booléen  | Non  | Indique si une entrée multiligne peut être fournie (par défaut : faux (ligne unique))  | 
| maxCharCount  | Number  | Non  | Nombre maximal de caractères en entrée. Appliqué sur le client Apple (par défaut : aucune limite)  | 
| regex | String  | Non  | Chaîne d’expression régulière (regex) pour placer des contraintes sur l’entrée fournie (par défaut : aucune contrainte regex)  | 
| keyboardType  | String  | Non  | Détermine le type de clavier affiché lorsque l’utilisateur final fournit une entrée (valeurs autorisées : identiques à celles d’Apple). Voir les [documents](https://register.apple.com/resources/messages/msp-rest-api/type-interactive#form-message). Voici certaines des valeurs autorisées : numberPad, phonePad, emailAddress  | 
| textContentType  | String  | Non  | Facilite le remplissage automatique des suggestions sur les appareils Apple.  Valeurs autorisées : identiques à celles d’Apple. Voir les [documents](https://register.apple.com/resources/messages/msp-rest-api/type-interactive#form-message). Certaines des valeurs autorisées : TelephoneNumber, FamilyName fullStreetAddress  | 

## Modèle Apple Pay
<a name="apple-pay-template"></a>

**Note**  
Ce modèle s’applique uniquement aux flux de contacts d’Apple Messages for Business.

 Utilisez le modèle Apple Pay pour proposer aux clients un moyen simple et sécurisé d’acheter des biens et des services par le biais d’Apple Messages for Business avec Apple Pay.

 Le code suivant est le modèle Apple Pay que vous pouvez utiliser dans votre fonction Lambda :

**Note**  
 Le **texte en gras** est un paramètre obligatoire. 
 Dans certains cas, si l’élément parent existe dans la demande et qu’il n’est pas obligatoire/en gras, mais que les champs qu’il contient le sont, les champs sont obligatoires. 

```
{
  "templateType":"ApplePay",
  "version":"1.0",
  "data":{
    "content":{
      "title":"Halibut",
      "subtitle":"$63.99 at Sam's Fish",
      "imageType":"URL",
      "imageData":"https://interactive-msg.s3-us-west-2.amazonaws.com/fish.jpg",
      "payment": {
        "endpoints": {
          "orderTrackingUrl": "https://sams.example.com/orderTrackingUrl/",
          "paymentGatewayUrl": "https://sams.example.com/paymentGateway/",
          "paymentMethodUpdateUrl": "https://sams.example.com/paymentMethodUpdate/",
          "shippingContactUpdateUrl": "https://sams.example.com/shippingContactUpdate/",
          "shippingMethodUpdateUrl": "https://sams.example.com/shippingMethodUpdate/",
          "fallbackUrl": "https://sams.example.com/paymentGateway/"
        },
        "merchantSession": {
          "epochTimestamp": 1525730094057,
          "expiresAt": 1525730094057,
          "merchantSessionIdentifier": "PSH40080EF4D6.........9NOE9FD",
          "nonce": "fe72cd0f",
          "merchantIdentifier": "merchant.com.sams.fish",
          "displayName": "Sam's Fish",
          "signature": "308006092a8.......09F0W8EGH00",
          "initiative": "messaging",
          "initiativeContext": "https://sams.example.com/paymentGateway/",
          "signedFields": [
            "merchantIdentifier",
            "merchantSessionIdentifier",
            "initiative",
            "initiativeContext",
            "displayName",
            "nonce"
          ],
        },
        "paymentRequest": {
          "applePay": {
            "merchantCapabilities": [
              "supports3DS",
              "supportsDebit",
              "supportsCredit"
            ],
            "merchantIdentifier": "merchant.com.sams.fish",
            "supportedNetworks": [
              "amex",
              "visa",
              "discover",
              "masterCard"
            ]
          },
          "countryCode": "US",
          "currencyCode": "USD",
          "lineItems": [
            {
              "amount": "59.00",
              "label": "Halibut",
              "type": "final"
            },
            {
              "amount": "4.99",
              "label": "Shipping",
              "type": "final"
            }
          ],
          "requiredBillingContactFields": [
            "postalAddress"
          ],
          "requiredShippingContactFields": [
            "postalAddress",
            "phone",
            "email",
            "name"
          ],
          "shippingMethods": [
            {
              "amount": "0.00",
              "detail": "Available within an hour",
              "identifier": "in_store_pickup",
              "label": "In-Store Pickup"
            },
            {
              "amount": "4.99",
              "detail": "5-8 Business Days",
              "identifier": "flat_rate_shipping_id_2",
              "label": "UPS Ground"
            },
            {
              "amount": "29.99",
              "detail": "1-3 Business Days",
              "identifier": "flat_rate_shipping_id_1",
              "label": "FedEx Priority Mail"
            }
          ],
          "total": {
            "amount": "63.99",
            "label": "Sam's Fish",
            "type": "final"
          },
          "supportedCountries" : [
            "US",
            "CA",
            "UK",
            "JP",
            "CN"
          ]
        }
      },
      "requestIdentifier" : "6b2ca008-1388-4261-a9df-fe04cd1c23a9"
    }
  }
}
```

### Limites d’Apple Pay
<a name="apple-pay-limits"></a>


| Champ parent  | Champ  | Obligatoire  | Nombre minimal de caractères  | Nombre maximal de caractères  | Autre exigence  | 
| --- | --- | --- | --- | --- | --- | 
|  | templateType  | Oui  |  |  | Type de modèle valide  | 
|  | données | Oui  |  |  |  | 
|  | version | Oui  |  |  | Doit être « 1.0 »  | 
| données | content  | Oui  |  |  |  | 
| content  | title  | Oui  | 1  | 512  | Titre de la bulle du message reçu  | 
|  | subtitle  | Non  | 0  | 512  | Sous-titre à afficher sous le titre de la bulle du message reçu  | 
|  | imageData  | Non  | 0  | 200  | Il doit s’agir d’une URL valide accessible publiquement  | 
|  | imageType  | Non  | 0  | 50  | Doit être « URL »  | 
|  | paiement | Oui  |  |  | Dictionnaire contenant les champs qui donnent les spécificités d’une demande Apple Pay.  | 
|  | requestIdentifier  | Non  |  |  | Chaîne, identifiant de la ApplePay demande. Si cet identifiant n’est pas spécifié, un UUID sera généré et utilisé.  | 
| paiement | points de terminaison | Oui  |  |  | Dictionnaire contenant les points de terminaison pour le traitement des paiements, les mises à jour des contacts et le suivi des commandes.  | 
|  | merchantSession  | Oui  |  |  | Dictionnaire contenant la session de paiement fournie par Apple Pay après la demande d’une nouvelle session de paiement.  | 
|  | paymentRequest  | Oui  |  |  | Dictionnaire contenant des informations sur la demande de paiement  | 
| points de terminaison | paymentGatewayUrl  | Oui  |  |  | String. Appelée par Apple Pay pour traiter le paiement par l’intermédiaire du fournisseur de services de paiement. Cette URL doit correspondre à l’URL figurant dans le champ initiativeContext de la session du commerçant  | 
|  | fallbackUrl  | Non  |  |  | URL qui s’ouvre dans un navigateur Web afin que le client puisse finaliser l’achat si son appareil n’est pas en mesure d’effectuer des paiements avec Apple Pay. Si spécifié, FallbackURL doit correspondre. paymentGatewayUrl  | 
|  | orderTrackingUrl  | Non  |  |  | Appelée par Messages for Business après avoir terminé la commande ; vous permet de mettre à jour les informations de commande dans votre système.  | 
|  | paymentMethodUpdateURL | Non  |  |  | Appelée par Apple Pay lorsque le client change de mode de paiement. Si vous n’implémentez pas ce point de terminaison et que vous incluez cette clé dans le dictionnaire, le client voit un message d’erreur.  | 
|  | shippingContactUpdateURL | Non  |  |  | Appelée par Apple Pay lorsque le client modifie les informations relatives à son adresse de livraison. Si vous n’implémentez pas ce point de terminaison et que vous incluez cette clé dans le dictionnaire, le client voit un message d’erreur  | 
|  | shippingMethodUpdateURL | Non  |  |  | Appelée par Apple Pay lorsque le client change de mode de livraison. Si vous n’implémentez pas ce point de terminaison et que vous incluez cette clé dans le dictionnaire, le client voit un message d’erreur.  | 
| merchantSession  | displayName  | Oui  | 1  | 64  | String. Nom d’affichage canonique de votre boutique. Ne localisez pas ce nom.  | 
|  | initiative  | Oui  |  |  | String. Il doit s’agir d’un « message »  | 
|  | initiativeContext  | Oui  |  |  | String. Transmettez l’URL de votre passerelle de paiement.  | 
|  | merchantIdentifier  | Oui  |  |  | String. Identifiant unique représentant un commerçant pour Apple Pay.  | 
|  | merchantSessionIdentifier  | Oui  |  |  | String. Identifiant unique qui représente la session d’un commerçant pour Apple Pay.  | 
|  | epochTimestamp  | Oui  |  |  | Chaîne. Représentation de l’heure en nombre de secondes écoulées depuis 00 h 00 UTC, jeudi 1er janvier 1970.  | 
|  | expiresAt  | Oui  |  |  | String. Représentation de l’heure d’expiration en nombre de secondes écoulées depuis 00 h 00 UTC, le jeudi 1er janvier 1970.  | 
|  | nonce  | Non  |  |  | Binaire. Chaîne à usage unique qui vérifie l’intégrité de l’interaction.  | 
|  | signature  | Non  |  |  | Binaire. Hash de la clé publique utilisée pour signer les interactions.  | 
|  | signedFields  | Non  |  |  | La liste des chaînes contient les propriétés signées.  | 
| paymentRequest  | applePay  | Oui  |  |  | Dictionnaire qui décrit la configuration d’Apple Pay.  | 
|  | countryCode  | Oui  |  |  | String. Code de pays ISO 3166 à deux lettres du commerçant.  | 
|  | currencyCode  | Oui  |  |  | String. Code de devise ISO 4217 à trois lettres pour le paiement.  | 
|  | lineItems  | Non  |  |  | Série de postes expliquant les paiements et les frais supplémentaires. Les postes ne sont pas obligatoires. Toutefois, le tableau ne peut pas être vide si la clé lineItems est présente.  | 
|  | total  | Oui  |  |  | Dictionnaire contenant le total. Le montant total doit être supérieur à zéro pour passer la validation.  | 
|  | requiredBillingContactChamps | Non  |  |  | Liste des informations de facturation requises par le client pour traiter la transaction. Pour la liste des chaînes possibles, consultez la section [requiredBillingContactChamps](https://developer.apple.com/documentation/apple_pay_on_the_web/applepaypaymentrequest/2216120-requiredbillingcontactfields). Demandez uniquement les champs de contact nécessaires pour traiter le paiement. Demander de remplir des champs superflus complique la transaction, ce qui peut augmenter les chances que le client annule la demande de paiement.  | 
|  | requiredShippingContactChamps | Non  |  |  | Liste des informations de livraison ou des coordonnées requises par le client pour exécuter la commande. Par exemple, si vous avez besoin de l’adresse e-mail ou du numéro de téléphone du client, incluez cette clé. Pour la liste des chaînes possibles, consultez la section [requiredShippingContactChamps](https://developer.apple.com/documentation/apple_pay_on_the_web/applepaypaymentrequest/2216121-requiredshippingcontactfields).  | 
|  | shippingMethods  | Non  |  |  | Tableau répertoriant les méthodes de livraison disponibles. Le bulletin de paiement Apple Pay indique le premier mode de livraison du tableau comme mode de livraison par défaut.  | 
|  | supportedCountries  | Non  |  |  | Tableau des pays à prend en charge. Répertoriez chaque pays avec son code ISO 3166.  | 
| applePay  | merchantIdentifier  | Oui  |  |  | Identifiant unique représentant un commerçant pour Apple Pay.  | 
|  | merchantCapabilities  | Oui  |  |  | Tableau de fonctionnalités de paiement prises en charge par le commerçant. Le tableau doit inclure supports3DS et peut éventuellement inclure supportsCredit, supportsDebit et supportsEMV.  | 
|  | supportedNetworks  | Oui  |  |  | Tableau de réseaux de paiement pris en charge par le commerçant. Ce tableau doit inclure une ou plusieurs des valeurs suivantes : amex, discover, jcb, masterCard, privateLabel ou visa  | 
| lineItem  | amount  | Oui  |  |  | Montant monétaire de l’article.  | 
|  | étiquette | Oui  |  |  | Description courte et localisée de l’article.  | 
|  | type | Non  |  |  | Valeur qui indique si l’article est final ou en attente.  | 
| total  | amount  | Oui  |  |  | Montant total du paiement.  | 
|  | étiquette | Oui  |  |  | Description courte et localisée du paiement.  | 
|  | type | Non  |  |  | Valeur qui indique si le paiement est final ou en attente.  | 
| shippingMethods  | amount  | Oui  |  |  | String. Coût non négatif associé à ce mode de livraison.  | 
|  | detail  | Oui  |  |  | String. Description supplémentaire du mode de livraison.  | 
|  | étiquette | Oui  |  |  | String. Brève description du mode de livraison.  | 
|  | identifier  | Oui  |  |  | String. Valeur définie par le client utilisée pour identifier ce mode de livraison.  | 

## Modèle d’application iMessage
<a name="imessage-app-template"></a>

**Note**  
Ce modèle s’applique uniquement aux flux de contacts d’Apple Messages for Business. 

 Utilisez le modèle d’applications iMessage pour présenter au client votre application iMessage personnalisée. 

 Le code suivant est un exemple de modèle d’application iMessage que vous pouvez utiliser dans votre fonction Lambda.  

```
{
   templateType: AppleCustomInteractiveMessage,
   version: "1.0",
   data: {
       content: {
           appIconUrl: "https://interactive-message-testing.s3-us-west-2.amazonaws.com/apple_4.2kb.jpg",
           appId: "123456789",
           appName: "Package Delivery",
           title: "Bubble Title CIM",
           bid: "com.apple.messages.MSMessageExtensionBalloonPlugin:{team-id}:{ext-bundle-id}",
           dataUrl: "?deliveryDate=26-01-2024&destinationName=Home&street=1infiniteloop&state=CA&city=Cupertino&country=USA&postalCode=12345&latitude=37.331686&longitude=-122.030656&isMyLocation=false&isFinalDestination=true",
           subtitle: "Bubble package",
       },
       replyMessage: {
           title: "Custom reply message title",
           subtitle: "Custom reply message subtitle",
           imageType: "URL",
           imageData: "https://interactive-msg.s3-us-west-2.amazonaws.com/fruit_34.3kb.jpg",
       }
   }
}
```

### Limites de l’application iMessage
<a name="imessage-apps-limits"></a>


|  **Champ parent**  |  **Champ**  |  **Obligatoire**  |  **Type**  |  **Autres notes**  | 
| --- | --- | --- | --- | --- | 
|  |  templateType  | Oui  | TemplateType  | Type de modèle valide, « AppleCustomInteractiveMessage »  | 
|  |  data  | Oui  | InteractiveMessageData  | Contient les dictionnaires receivedMessage et content  | 
|  |  Version  | Oui  | chaîne  | Doit être « 1.0 »  | 
|  data  |  content  | Oui  | InteractiveMessageContent  | Contenu interactif de l’application iMessage  | 
|  |  Message de réponse  | Oui  | ReplyMessage  | Configuration de l’affichage des messages après l’envoi de la réponse à un message interactif  | 
|  content  |  appIconUrl  | Oui  | chaîne  | URL AWS S3  | 
|  |  APpiD  | Oui  | chaîne  | ID de IMessage l'application professionnelle  | 
|  |  Nom de l'application  | Oui  | chaîne  | Nom de IMessage l'application professionnelle  | 
|  |  bid  | Oui  | chaîne  | Offre IMessage pour applications professionnelles. Modèle : com.apple.messages. MSMessageExtensionBalloonPlugin: \$1identifiant d'équipe\$1 : \$1\$1 ext-bundle-id  | 
|  |  dataUrl  | Oui  | chaîne  | Données transmises à l’application iMessage  | 
|  |  useLiveLayout  | Non  | boolean  | Vrai par défaut  | 
|  |  title  | Oui  | chaîne  | titre de la bulle de l’application iMessage  | 
|  |  sous-titre  | Non  | chaîne  | sous-titre de la bulle de l’application iMessage  | 
|  Message de réponse  |  title  | Non  | chaîne  |  | 
|  |  sous-titre  | Non  | chaîne  |  | 
|  |  Type d'image  | Non  | chaîne  | Il doit s’agir d’une URL valide accessible publiquement  | 
|  |  Données d'image  | Non  | chaîne  | Ne peut pas exister sans image  | 

## WhatsApp liste
<a name="whatsapp-list"></a>

**Note**  
Vous n'utilisez ce modèle que pour les flux WhatsApp de messagerie. Pour plus d'informations sur l'intégration WhatsApp à Amazon Connect[Configuration de la messagerie WhatsApp professionnelle](whatsapp-integration.md), consultez la section précédente de ce guide.

Vous utilisez le modèle de WhatsApp liste dans WhatsApp les chats pour fournir aux clients une liste d'options.

L’exemple suivant montre une liste d’options pour un service bancaire.

```
{
  "templateType": "WhatsAppInteractiveList",
  "version": "1.0",
  "data": {
    "content": {
      "title": "Which account do you need help with?",
      "body": {
        "text": "Which account do you need help with?"
      },
      "action": {
        "button": "Options",
        "sections": [
          {
            "title": "Your accounts",
            "rows": [
              {
                "id": "11111111",
                "title": "11111111",
                "description": "PERSONAL CHECKING"
              },
              {
                "id": "22223333",
                "title": "22223333",
                "description": "PERSONAL SAVINGS"
              }
            ]
          },
          {
            "title": "Other",
            "rows": [
              {
                "id": "other",
                "title": "I can't find my account"
              }
            ]
          }
        ]
      }
    }
  }
}
```

L’image suivante montre un écran typique avant et après l’ouverture d’une liste par un client.

![\[Image présentant une liste d’options.\]](http://docs.aws.amazon.com/fr_fr/connect/latest/adminguide/images/whatsapp-options-results.png)


### WhatsApp limites d'options
<a name="whatsapp-options-limits"></a>


| Champ parent | Champ | Obligatoire | Longueur minimale  | Longueur maximale  | Autre exigence | 
| --- | --- | --- | --- | --- | --- | 
|  | templateType | Oui |  |  | Doit être « WhatsAppInteractiveList » | 
|  | data | Oui |  |  |  | 
|  | Version | Oui |  |  | Doit être « 1.0 » | 
| data | content | Oui |  |  |  | 
| content | title | Oui |  |  |  | 
|  | en-tête | Non |  |  |  | 
|  | body | Oui  |  |  |  | 
|  | pied de page | Non |  |  |  | 
|  | action | Oui |  |  |  | 
| en-tête |  type  | Oui  |  |  |  Doit être « text »  | 
|  |  texte  | Oui  | 1  |  60  |  | 
| body |  texte  | Oui  | 1 |  4096  |  | 
|  footer  |  texte  | Oui  | 1 |  60  |  | 
|  action  |  sections  | Oui  | 1 |  10  |  | 
|  |  bouton  | Oui  | 1 |  20  |  | 
|  section  |  title  | Oui  | 1 |  24  |  | 
|  |  rangées  | Oui  | 1 |  10  |  Maximum de 10 lignes dans toutes les sections  | 
|  ligne  |  id  | Oui | 1 | 200 | Doit être unique sur toutes les lignes | 
|  |  title  | Oui  | 1 | 24 |  | 
|  | description  | Non  | 1 |  72  |  | 

## WhatsApp bouton de réponse
<a name="whatsapp-reply-button"></a>

**Note**  
Vous n'utilisez ce modèle que pour les flux WhatsApp de messagerie.

Vous pouvez utiliser le modèle de bouton de WhatsApp réponse pour présenter une liste d'options en ligne aux clients.

```
{
  "templateType": "WhatsAppInteractiveReplyButton",
  "version": "1.0",
  "data": {
    "content": {
      "title": "What would you like to do?",
      "body": {
        "text": "What would you like to do?"
      },
      "action": {
        "buttons": [
          {
            "type": "reply",
            "reply": {
              "id": "agent",
              "title": "Continue to agent"
            }
          },
          {
            "type": "reply",
            "reply": {
              "id": "end_chat",
              "title": "End chat"
            }
          }
        ]
      }
    }
  }
}
```

L’image suivante illustre une expérience utilisateur type.

![\[Image d’une réponse lors d’une session de chat.\]](http://docs.aws.amazon.com/fr_fr/connect/latest/adminguide/images/whatsapp-reply-template.png)


### WhatsApp limites du bouton de réponse
<a name="whatsapp-reply-limits"></a>

Le modèle de WhatsApp réponse présente les limites suivantes.


| Champ parent | Champ | Obligatoire | Longueur minimale | Longueur maximale  | Autre exigence | 
| --- | --- | --- | --- | --- | --- | 
|  | templateType  | Oui |  |  | Doit être « WhatsAppInteractiveReplyButton »  | 
|  | data  | Oui |  |  |  | 
|  | Version  | Oui |  |  | Doit être « 1.0 »  | 
|  data  | content | Oui |  |  |  | 
|  content  | title  | Oui |  |  |  | 
|  | en-tête | Non |  |  |  | 
|  | body | Oui |  |  |  | 
|  | footer  | Non |  |  |  | 
|  | action  | Oui |  |  |  | 
| en-tête  | type  | Oui |  |  | Valeurs valides : « text », « document », « image », « video »  | 
|  | texte | Non | 1 | 60  |  | 
|  | image  | Non |  |  |  | 
|  | vidéo | Non |  |  |  | 
|  | document | Non |  |  |  | 
| image  | lien  | Oui |  |  | Doit être une URL multimédia accessible au public commençant par https/http  | 
| vidéo | lien  | Oui |  |  | Doit être une URL multimédia accessible au public commençant par https/http  | 
| document | lien  | Oui |  |  | Doit être une URL multimédia accessible au public commençant par https/http  | 
| body  | texte  | Oui | 1 | 1 024  |  | 
| footer  | texte  | Oui | 1 | 60  |  | 
| action  | boutons  | Oui | 1 | 3  |  | 
| bouton  | type  | Oui |  |  | Doit être « reply »  | 
|  | reply.id | Oui | 1 | 256  | Doit être unique pour tous les boutons  | 
|  | reply.title  | Oui | 1 | 20  |  | 

## Mise en forme enrichie des titres et sous-titres
<a name="rich-link-formatting"></a>

Vous pouvez ajouter une mise en forme enrichie aux titres et aux sous-titres de vos messages de chat. Par exemple, vous pouvez ajouter des liens, une mise en italique, une mise en gras, des listes numérotées et des listes à puces. Vous pouvez utiliser [Markdown]( https://commonmark.org/help/) pour mettre en forme votre texte. 

L’illustration suivante d’une boîte de chat montre un exemple de sélecteur de liste avec une mise en forme enrichie dans le titre et le sous-titre.
+ Le titre **Comment pouvons-nous vous aider ? aws.amazon.com** est en gras et contient un lien.
+ Le sous-titre contient du texte en italique et en gras, une liste à puces et une liste numérotée. Il affiche également un lien brut, un lien texte et un exemple de code.
+ La partie inférieure de la boîte de chat affiche trois éléments de sélecteur de liste.

![\[Boîte de chat, titre avec un lien, sous-titre avec des listes et des liens.\]](http://docs.aws.amazon.com/fr_fr/connect/latest/adminguide/images/rich-link-formatting-example1a.png)


### Comment mettre en forme du texte avec Markdown
<a name="markdown-formatting-text"></a>

Vous pouvez écrire les chaînes de titre et de sous-titre dans un format multiligne ou sur une seule ligne avec des caractères ``\r\n`` de saut de ligne.
+ **Format multiligne** : l’exemple de code suivant montre comment créer des listes en Markdown dans un format multiligne.

  ```
  const MultiLinePickerSubtitle = `This is some *emphasized text* and some **strongly emphasized text**
  
  This is a bulleted list (multiline):
  * item 1
  * item 2
  * item 3
  
  This is a numbered list:
  1. item 1
  2. item 2
  3. item 3
  
  Questions? Visit https://plainlink.com/faq
  
  [This is a link](https://aws.amazon.com)
  
  This is \`\`
  `
  
  const PickerTemplate = {
      templateType: "ListPicker|Panel",
      version: "1.0",
      data: {
          content: {
              title: "How can we help?",
              subtitle: MultiLinePickerSubtitle,
              elements: [ /* ... */ ]
          }
      }
  }
  ```
+ **Format à une seule ligne** : l’exemple suivant montre comment créer un sous-titre sur une seule ligne en utilisant des caractères ``\r\n`` de saut de ligne. 

  ```
  const SingleLinePickerSubtitle = "This is some *emphasized text* and some **strongly emphasized text**\r\nThis is a bulleted list:\n* item 1\n* item 2\n* item 3\n\nThis is a numbered list:\n1. item 1\n2. item 2\n3. item 3\n\nQuestions? Visit https://plainlink.com/faq\r\n[This is a link](https://aws.amazon.com)\r\nThis is `<code/>`";
  
  const PickerTemplate = {
      templateType: "ListPicker|Panel",
      version: "1.0",
      data: {
          content: {
              title: "How can we help?",
              subtitle: SingleLinePickerSubtitle,
              elements: [ /* ... */ ]
          }
      }
  }
  ```

L’exemple suivant montre comment mettre en forme du texte en italique et en gras avec Markdown :

`This is some *emphasized text* and some **strongly emphasized text**`

L’exemple suivant montre comment mettre en forme du texte sous forme de code avec Markdown :

`This is `<code />``

### Comment mettre en forme des liens avec Markdown
<a name="markdown-formatting-links"></a>

Pour créer un lien, utilisez la syntaxe suivante :

 `[aws](https://aws.amazon.com)`

Les exemples suivants montrent deux manières d’ajouter des liens avec Markdown :

`Questions? Visit https://plainlink.com/faq `

`[This is a link](https://aws.amazon.com)`

**Note**  
Pour les sélecteurs de listes, le champ `targetForLinks` peut être ajouté en tant que champ enfant à `content` si vous souhaitez avoir un contrôle précis sur l’endroit où les liens sont ouverts. Le widget de communication ouvre les liens dans un nouvel onglet du navigateur par défaut. Pour plus d’informations, consultez [Modèle de sélecteur de liste](#list-picker).