Comprendre et créer des images multi-clic et des liens de carte dans SharePoint Online

Ce tutoriel vous explique comment ajouter plusieurs hyperliens à l'intérieur d'une image et l'intégrer dans une page SharePoint. Pour ajouter un hyperlien à une image, nous souhaitons mapper le lien dans l'image avec ses coordonnées. Vous pouvez facilement y parvenir grâce à une image cliquable.

Images cliquables 

Une image cliquable permet à un utilisateur de cliquer sur différentes zones cliquables de l'image et d'être lié à différentes destinations, ce qui facilite la navigation vers une autre page.[19659006] En utilisant le mappage d'images, vous pouvez définir des zones liées à l'intérieur d'une image, permettant ainsi à l'image d'avoir plusieurs zones cliquables.  

Il existe deux manières de créer une zone multi-cliquable dans une image :  

1. Créer une carte-image dans la version classique de SharePoint en ligne.
2. Créez une image multi-clic à l'aide de PowerPoint dans SharePoint en ligne moderne.

Créer une carte d'images dans Classic SharePoint Online 

Tout d'abord, j'ai sélectionné l'image ci-dessous.

Free Image Map. Nous pouvons télécharger l'image en cliquant sur le "Sélectionnez une image à partir de mon PC," ou nous pouvons également charger des images à partir d'un site Web en cliquant sur le bouton "Charger l'image à partir du site Web". Voir ci-dessous ce que vous verrez une fois téléchargé :[19659025]

Après cela, sélectionnez la bulle sous « actif » sur la gauche, puis sélectionnez « Rect » dans la liste déroulante des formes.[1 9659025]

Cliquez sur le numéro un dans le coin supérieur gauche de l'image. Ensuite, cliquez sur le numéro un dans le coin inférieur droit. Vous pouvez ajuster la zone de carte rectangulaire sur l'image.

Remplissez tous les détails nécessaires :

• Lien (URL de la page)
• Titre (nom de la page)
• Cible (_blank)

Cliquez sur " ajouter une nouvelle zone" vous permettra de créer plusieurs zones de carte cliquables sur l'image. Faites cela pour répéter le même processus que précédemment pour les numéros deux et trois sur cette image.

Cliquez sur « montrez-moi le code » et une boîte de dialogue de code apparaîtra.

Sélectionnez « tous, ” copiez le code et modifiez le chemin de la source de l'image vers l'endroit où l'image sera téléchargée, qui se trouve dans le chemin du site SharePoint comme ci-dessous :

Accédez au site SharePoint classique, modifiez la page, ajoutez le composant WebPart éditeur de script et collez le code. Il s'affichera comme indiqué dans les captures d'écran ci-dessous :

Cliquez sur « Ajouter un composant WebPart ».

Cliquez sur le dossier « médias et contenu », « » éditeur de script » et « ajouter un composant WebPart éditeur de script ».

Cliquez sur le bouton « insérer ».

Maintenant, essayez de cliquer sur le numéro un.[19659025]

Si nous cliquons sur le numéro un, il redirigera vers la page « Test1.aspx ». Il fera la même chose que pour les numéros deux et trois.

Créer une image multi-clic à l'aide de PowerPoint dans SharePoint Online moderne

Ouvrez PowerPoint, insérez l'image numérique et suivez ces étapes :

[19659025]Étape 1 : Sélectionnez votre image. Cliquez sur « insérer » pour ajouter votre image.

Étape 2 : Cliquez sur « formes », sélectionnez une forme rectangulaire, dessinez un rectangle au-dessus du numéro un et ajustez la zone où un utilisateur peut cliquez pour le numéro un.

Étape 3 : Faites un clic droit sur la forme du rectangle et cliquez sur « lien ». Ajoutez l'URL de destination de l'utilisateur.

Étape 4 : Une boîte de dialogue apparaît. Ajoutez l'URL dans le champ d'adresse et sélectionnez "ok". ]Étape 6 : Cliquez sur « forme contour » et cliquez sur « pas de contour » pour que la bordure ne soit pas visible.

Étape 7 : Répétez les mêmes étapes de 1 à 6 pour les numéros 2 et 3.

Étape 8 : Enregistrez le fichier PowerPoint dans un lecteur local.

Étape 9 : Accédez à la page du site SharePoint et modifiez la page.

Étape 10 : Ajoutez la « visionneuse de fichiers ", sélectionnez ce PowerPoint et enregistrez/publiez la page.

Ensuite, cliquez sur le numéro un sur l'image. Il accédera à la page de test 1.

Connaissances SharePoint faciles à utiliser

J'espère que ce didacticiel vous aidera à mettre en œuvre le mappage d'images dans SharePoint en ligne. Pour toute autre question ou information sur ce sujet, contactez nos experts dès aujourd'hui. Il aime développer des applications Web et fournir des solutions techniques aux clients !

En savoir plus sur cet auteur