Présentation du composant
Afin de faciliter la navigation sur son site, quoi de mieux qu’un composant visuel et interactif vous permettant de naviguer directement vers le site d’un pays ou d'un service en cliquant physiquement dessus ? C’est ce que vous propose le composant Image interactive, une image à placer dans vos pages SharePoint avec des zones cliquables permettant de diffuser de l’information ou de renvoyer vers des liens. Cet article décrit les fonctionnalités et les cas d'utilisation des WebParts Image interactive.
Découvrez notre composant en vidéo !
Fonctionnalité utilisateur
L'Image interactive est un composant interactif où vous pouvez ajouter des points d'information et des liens à vos images pour permettre aux utilisateurs de partager graphiquement des informations, des formations ou des organisations et créer une navigation plus fluide sur le site. De cette façon, chacun peut accéder rapidement et facilement à la bonne information en cliquant simplement sur les points de la carte d'images.
Cas d'usage
Ce composant peut être utilisé pour créer une interaction dans plusieurs situations :
- Créer une navigation interactive avec une image qui représente l'organisation de votre entreprise et de votre lieu de travail numérique : les différents départements, lignes de produits ou services.
- Ajouter des informations commerciales pour décrire vos processus et vos produits.
- Placer des points d'intérêt sur une carte.
- Éduquer vos employés sur un produit ou un service en ajoutant des textes ou des liens avec des explications.
- Centraliser les informations sur un sujet en un seul endroit.
Ajouter le composant
- Ouvrez le mode édition de la page SharePoint en cliquant sur modifier en haut à droite de la page,
- À l'emplacement désiré, sélectionnez le bouton "+" pour ouvrir le catalogue de composant,
- Recherchez ou déroulez le catalogue pour sélectionner le composant Image Interactive dans la catégorie "Documents, liste et bibliothèque",
- Le composant est rajouté à l'emplacement désiré.
Paramétrage du composant
Il y a quatre catégories de paramètres disponibles pour la WebPart Image interactive :
- Agencement
- Options d'affichage
- Configuration de l'image interactive
1. Agencement
- Choisissez la taille de la WebPart en cliquant sur : Petit, Moyen ou Grand. Elle correspond à la taille standard de la Webpart de Jint que vous pouvez utiliser pour aligner le composant dans vos pages.
- Personnalisez la taille de la WebPart en ajoutant le nombre de pixels sous "Personnaliser".
- Adaptez automatiquement la hauteur de la WebPart à l'image en activant "Adapter la WebPart à l'image".
2. Options d'affichage
- Activez "Afficher le titre de la WebPart" pour afficher le titre.
- Rédigez un titre dans la zone de texte.
3. Configuration de l'image interactive
3.1 Sélectionner une image
- 1. Ajoutez une image en cliquant sur "Sélectionner une image".
- Sélectionnez une image parmi trois options différentes :
- Récent : choisissez une image qui a été utilisée récemment.
- Banque d'images : recherchez une image dans la barre de recherche ou choisissez une image parmi les catégories recommandées.
- Importer : importez une image depuis votre appareil en cliquant sur "Choisir un fichier".
Une fois l'image sélectionnée, vous pouvez l'insérer en cliquant sur "Insérer". Si vous souhaitez abandonner la sélection d'images, cliquez sur "Annuler".
Si vous souhaitez modifier l'image, cliquez sur "Modifier l'image" ou supprimez l'image en cliquant sur l'icône de la corbeille.
3.2 Définir votre carte d'image
Pour rendre l'image sélectionnée interactive, cliquez sur le bouton "Définissez votre image interactive". Une nouvelle fenêtre s'ouvre dans laquelle vous pouvez configurer l'Image interactive :
1. Vous aurez le choix entre ajouter :
-
-
- Un point sur l’image
- Des zones cliquables de forme rectangulaire ou d’ellipse
-
2. Pour ajouter ces éléments sur l'image, cliquez sur l'icône correspondant à votre choix
3. Le point et/ou les zones cliquables sont maintenant activées et vous pouvez les placer où vous voulez en cliquant sur l'image. Vous pouvez ensuite les configurer
4. Pour déplacer les points et/ou les zones cliquables, cliquez sur l'icône de la flèche. La flèche est alors activée et vous pouvez cliquer sur l'élément et le placer à l'endroit souhaité sur l'image.
5. Pour configurer un point et/ou une zone cliquable, utilisez le mode sélection et cliquez sur l’élément. Le menu de configuration apparaît sur le côté droit. Vous pouvez :
-
- Supprimer l’élément en cliquant sur l'icône de la corbeille.
- Ajouter un lien sous "Ajouter un lien direct". Une fois qu'un lien est ajouté, vous pouvez choisir s'il doit être ouvert dans une nouvelle fenêtre.
- Rendre la zone visible ou non pour les zones cliquables
- Ajouter une infobulle. Vous pouvez ensuite ajouter un titre et un paragraphe. Vous pouvez modifier la taille du titre.
6. Une fois que vous avez terminé de définir l'image interactive, vous pouvez fermer la fenêtre en cliquant sur "Sortir de l'édition". Toutes les modifications sont enregistrées automatiquement.
Exemples de disposition :
Commentaires
0 commentaire
Vous devez vous connecter pour laisser un commentaire.