Introduction
Une icône est ce qui rend une vignette reconnaissable avant même la lecture de son titre : le logo Outlook, un symbole PDF, un téléphone. Smart Tiles est fourni avec cinq jeux d'icônes qui couvrent les cas courants d'un intranet (symboles génériques, types de documents, applications Microsoft 365, services Azure et produits Vitextra) et accepte n'importe quelle image personnelle lorsque ces jeux ne suffisent pas. Cet article décrit les jeux d'icônes, le volet des icônes et les paramètres qui contrôlent l'affichage des icônes.
Les jeux d'icônes
| Jeu | Contenu | Usage type |
|---|---|---|
| Standard icon | La police d'icônes Fluent UI utilisée dans tout Microsoft 365 : plus de mille symboles monochromes (personnes, documents, calendriers, paramètres, flèches, etc.). | Destinations génériques : Help Desk, Holidays, Policies. |
| File type icon | Les icônes colorées de types de fichiers de SharePoint : Word, Excel, PowerPoint, PDF, images, archives et autres formats. | Liens vers un document ou un modèle précis. |
| App Icon | Les logos des applications Microsoft 365 : Outlook, Teams, OneDrive, Planner, Forms, Power BI et d'autres. | Liens qui ouvrent une application ou sa version web. |
| Azure | Les icônes des services Azure. | Portails destinés aux équipes informatiques et aux développeurs. |
| Vitextra | Les icônes des produits Vitextra. | Liens vers des pages créées avec d'autres composants WebPart Vitextra. |
Les icônes standard sont dessinées dans la Font Color de la vignette : une icône standard blanche sur une vignette bleue devient ainsi une icône bleue sur une vignette blanche d'un simple changement de couleur. Les quatre autres jeux sont des images en couleur et conservent leurs propres couleurs sur n'importe quel arrière-plan.
Choisir une icône
- Ouvrez la page en mode édition et cliquez sur le bouton … de la vignette.
- Pointez sur Tile Icon et choisissez le jeu : Standard icon, File type icon, App Icon, Azure ou Vitextra.
- Dans le volet Select icon qui s'ouvre à droite, faites défiler les icônes ou saisissez une partie du nom dans la zone de recherche : mail, calendar, xlsx.
- Cliquez sur l'icône, puis sur Apply.
L'icône actuellement utilisée par la vignette est mise en évidence à l'ouverture du volet, ce qui permet de choisir facilement une icône voisine du même jeu.
📝 Remarque
Une vignette qui pointe vers une vidéo YouTube affiche un bouton de lecture à la place de son icône. L'icône choisie pour une telle vignette est conservée et réapparaît si le lien est remplacé par une autre adresse.
Images personnalisées
Le dernier élément du sous-menu Tile Icon, Custom image, remplace l'icône par une image de votre choix : un logo d'entreprise, une photo de produit ou une icône dessinée par vos designers. L'image est saisie sous forme d'URL ou choisie dans une bibliothèque de documents du site. Choisir ensuite une icône dans l'un des cinq jeux supprime à nouveau l'image personnalisée. La procédure est décrite dans KB10244. Utiliser une image personnalisée comme icône de vignette.
Paramètres d'icônes du composant WebPart
Quatre paramètres du groupe Appearance du volet des propriétés s'appliquent aux icônes de toutes les vignettes :
| Paramètre | Effet |
|---|---|
| Icon size | Six niveaux : 20, 24, 32, 40, 48 et 64 px. La taille s'applique à tous les jeux ainsi qu'aux images personnalisées. |
| Icon Indent | L'espace entre l'icône et le titre, de 0 à 30 px. |
| Shadow | Une ombre portée douce sous l'icône. Elle donne de la profondeur aux icônes standard plates et détache les icônes en couleur d'une image d'arrière-plan. |
| Show Titles | Lorsque les titres sont masqués, l'icône est centrée dans la vignette et en devient l'unique contenu. |
💡 Astuce
Dans la mesure du possible, restez dans un seul jeu au sein d'un même panneau. Une rangée d'icônes standard monochromes dans une seule couleur de police se lit comme un ensemble ; un mélange d'icônes standard, d'applications et de types de fichiers paraît plus chargé et attire le regard sur les logos plutôt que sur les titres.
❗ Important
Les icônes des jeux sont livrées avec le composant WebPart et ne nécessitent donc aucune autorisation supplémentaire. Les images personnalisées sont chargées depuis l'adresse que vous indiquez ; les visiteurs doivent disposer d'un accès en lecture à cet emplacement.
