Ajouter un extrait de code de zone de composants WebPart dans SharePoint
Importante
Cette option d’extensibilité est disponible uniquement pour des expériences SharePoint classiques. Vous ne pouvez pas l’utiliser avec des expériences modernes dans SharePoint Online, telles que des sites de communication. Nous vous déconseillons d’utiliser l’expérience classique ou les techniques de marque.
Une zone de composants WebPart est un extrait de code que vous pouvez ajouter à une mise en page pour permettre aux auteurs de contenu d’ajouter, de modifier ou de supprimer des composants WebPart dans cette zone.
Introduction à l’extrait de code de zone de composants WebPart
Un composant WebPart est un contrôle serveur qui fournit une fonctionnalité SharePoint spécifique, et une zone de composant WebPart est un conteneur qui détermine la disposition, le comportement et d’autres propriétés des composants WebPart contenus dans cette zone. Par exemple, une zone de composants WebPart peut spécifier si les composants WebPart de la zone :
- Sont organisés selon une disposition horizontale ou verticale.
- Affichent les éléments de l'interface utilisateur courants tels qu'une barre de titre ou une bordure.
- Peuvent être personnalisés par les auteurs de contenu lorsqu'ils modifient une page dans le navigateur.
- Peuvent être personnalisés par les visiteurs du site qui créent un affichage personnel d’un composant WebPart lorsqu’ils consultent une page dans le navigateur.
Dans un site de publication, les auteurs de contenu disposant des autorisations requises peuvent créer ou modifier des pages situées dans la bibliothèque de pages. En tant que concepteur, vous pouvez ajouter une zone de composants WebPart à une mise en page. Lorsqu’un auteur de contenu crée ou modifie une page en fonction de cette mise en page, il peut ajouter, modifier ou supprimer des composants WebPart dans cette zone. Par exemple, vous pouvez ajouter une zone de composant WebPart à une mise en page afin que les auteurs de contenu puissent :
- Afficher les résultats d’une requête de recherche à l’aide d’un composant WebPart Recherche de contenu. Les auteurs peuvent mettre à jour ou modifier la requête de recherche lorsqu’un composant WebPart piloté par la recherche réside dans une zone de composants WebPart.
- Incorporer des clips audio ou vidéo dans une page web à l’aide d’un composant WebPart multimédia.
- Créer des listes de liens hypertextes facilement modifiables, regroupables ou réorganisables à l’aide d’un composant WebPart de lien de synthèse.
- Créer un plan de site qui en répertorie toutes les pages, mis à jour chaque fois qu’une page est ajoutée, supprimée, renommée ou déplacée à l’aide d’un composant WebPart de sommaire.
Quand utiliser des zones de composants WebPart
Lorsqu’une mise en page comprend une ou plusieurs zones de composants WebPart, les zones de composant WebPart sont disponibles sur toutes les pages qui utilisent cette disposition, ce qui permet aux auteurs d’insérer des composants WebPart sur ces pages. Si vous autorisez les auteurs à insérer des composants WebPart sur des pages, vous réduisez votre contrôle sur l’expérience utilisateur du site. Par exemple, un auteur peut insérer un composant WebPart Table des matières sur une page qui expose des parties de votre site auxquelles vous ne souhaitez pas que les visiteurs accèdent à partir de la page active.
Si vous souhaitez contrôler complètement l’affichage d’un composant WebPart sur votre site et si vous souhaitez que ce composant WebPart apparaisse sur toutes les pages d’un certain type, ajoutez le composant WebPart directement à une mise en page. Si vous souhaitez qu’un composant WebPart apparaisse sur toutes les pages d’un site, vous pouvez également ajouter un composant WebPart directement à une page master.
Remarque
Les zones de composants WebPart sont disponibles sur les mises en page, mais pas sur les pages maîtres. Le but des zones est de permettre aux auteurs de modifier les composants WebPart ; or, les auteurs ne modifient généralement pas les pages maîtres.
Vous pouvez également ajouter des zones de composants WebPart à une mise en page, mais restreindre leur utilisation. Par exemple, vous pouvez ajouter des composants WebPart à une zone, puis définir une propriété de cette zone afin que les auteurs de contenu puissent modifier les propriétés des composants WebPart existants, mais pas ajouter ou supprimer des composants WebPart de la zone. Les zones de composants WebPart ont un ensemble de propriétés qui servent un double objectif. Vous pouvez utiliser un sous-ensemble de propriétés pour organiser la disposition et le format des composants WebPart sur la page. Vous pouvez utiliser un autre sous-ensemble de propriétés pour fournir un niveau supplémentaire de protection contre la modification (ou « verrouillage ») des composants WebPart au sein de la zone.
Pour obtenir différents niveaux de contrôle sur la façon dont les composants WebPart sont présentés sur votre site, vous pouvez :
- Ajoutez des composants WebPart directement à une page master ou à une mise en page. Cela signifie que les auteurs de contenu ne peuvent pas modifier les composants WebPart.
- Ajouter des composants WebPart à des zones sur les mises en page, mais limiter ces zones uniquement aux composants WebPart par défaut ajoutés.
- Ajouter des zones de composants WebPart aux mises en page et octroyer aux auteurs de contenu le contrôle complet sur les composants WebPart apparaissant dans ces zones, ainsi que sur leur configuration.
Les propriétés d’une zone de composants WebPart permettent de spécifier si les auteurs de contenu sont autorisés à modifier les éléments suivants :
- La mise en page des composants WebPart dans la zone par l’ajout, la suppression, le redimensionnement ou le déplacement des composants WebPart.
- Les paramètres de composant WebPart pour tous les utilisateurs (affichage partagé d’un composant WebPart).
- Leurs paramètres personnels de composant WebPart (affichage personnel d’un composant WebPart).
Le tableau 1 indique les propriétés importantes à prendre en compte lorsque vous souhaitez limiter une zone de composants WebPart.
Tableau 1. Propriétés de zone de composants WebPart utilisées pour restreindre les auteurs de contenu
| Nom de la propriété | Description |
|---|---|
| AllowLayoutChange | Indique si les composants WebPart dans la zone peuvent être fermés, réduits, supprimés ou restaurés. Si la valeur est False, les utilisateurs ne peuvent pas fermer, réduire, supprimer ou restaurer des composants WebPart dans la zone, faire glisser des composants WebPart vers une autre zone ou réorganiser ou déplacer des composants WebPart dans la zone. Les utilisateurs ne peuvent pas non plus ajouter de composants WebPart à partir du catalogue de composants WebPart, et plusieurs propriétés qui affectent l’interface utilisateur des composants WebPart dans la zone sont désactivées. Cette propriété n’affecte pas la possibilité de modifier la disposition par programmation. Si la valeur est définie sur True, les utilisateurs disposant des autorisations appropriées peuvent effectuer ces actions. |
| LockLayout | Spécifie si les composants WebPart de la zone peuvent être ajoutés, supprimés, redimensionnés ou déplacés. Cette propriété fonctionne de la même façon, que la page du composant WebPart soit en mode personnel ou partagé. Si la valeur est True, les propriétés de composant WebPart spécifiques pour chaque composant WebPart de la zone affectée sont les suivantes : Zone (ZoneID), Ordre des composants (PartOrder),Visible sur la page (IsVisible),Hauteur (Hauteur),Largeur (Largeur), Autoriser la fermeture (AllowRemove) et IsIncluded (la commande Fermer dans le menu du composant WebPart). Les autres propriétés du composant WebPart ne sont pas affectées. Si la valeur est définie sur False, les propriétés de composant WebPart déterminent si des modifications peuvent être effectuées (avec les autorisations de site appropriées). |
| AllowCustomization | Indique si les valeurs de propriété partagées des composants WebPart au sein de la zone peuvent être modifiées. Si la valeur est définie sur True, les utilisateurs disposant des autorisations appropriées peuvent apporter des modifications aux composants WebPart dans la zone pour tous les utilisateurs. Si la valeur est False, les utilisateurs ne peuvent pas apporter de modifications aux composants WebPart dans la zone de l’interface utilisateur en mode partagé. Toutefois, les modifications peuvent toujours être apportées par programmation et à l’aide de la page Maintenance du composant WebPart. |
| AllowPersonalization | Indique si les valeurs de propriété personnelles des composants WebPart au sein de la zone peuvent être modifiées. Si la valeur est définie sur True, les utilisateurs disposant des autorisations appropriées peuvent apporter des modifications personnelles aux composants WebPart dans la zone. Si la valeur est définie sur False, les utilisateurs ne peuvent pas apporter de modifications personnelles aux composants WebPart via l’interface utilisateur, excepté s’il s’agit d’un composant WebPart privé et qu’ils disposent des autorisations appropriées. |
Remarque
Vous ne pouvez pas insérer une zone de composants WebPart à l’intérieur d’un volet Canaux des appareils. Si vous souhaitez autoriser les auteurs à ajouter des composants WebPart à une page, ou si vous n’accordez aucune importance au poids de la page pour les appareils mobiles, vous pouvez ajouter un champ de page Éditeur de texte enrichi au volet Canaux des appareils, puis inviter les auteurs à ajouter des composants WebPart dans ce champ. Vous pouvez ajouter des composants WebPart directement dans le volet Canaux des appareils (sans zone de composants WebPart). Pour plus d’informations, voir How to: Add a Device Channel Panel snippet in SharePoint.
Insertion d’un extrait de code de zone de composants WebPart
Comme tous les extraits de code, celui-ci s'ajoute à partir de la galerie d'extraits de code. Pour y accéder, vous devez d'abord sélectionner une mise en page à modifier. Les zones de composants WebPart peuvent être ajoutées aux mises en page, mais ne peuvent pas être ajoutées à master pages.
Pour insérer un extrait de code de zone de composants WebPart
Accédez à votre site de publication.
Dans le coin supérieur droit de la page, sélectionnez l'icône d'engrenage de paramètres, puis choisissez Gestionnaire de conception.
Dans le gestionnaire de conception, dans le volet de navigation de gauche, sélectionnez Modifier les mises en page.
Sélectionnez le nom de la mise en page à laquelle vous souhaitez ajouter l’extrait de code.
Pour ouvrir la galerie d'extraits de code, choisissez Extraits de code dans le coin supérieur droit de l'aperçu côté serveur.
Sur le ruban, dans l’onglet Conception, sélectionnez Zone de composants WebPart.
Sur le côté droit de la galerie d'extraits de code, sous À propos de ce composant, sélectionnez ou cliquez sur les en-têtes de section pour développer ou réduire les groupes de propriétés, puis configurez les paramètres personnalisés souhaités.
La section intitulée Important contient les propriétés essentielles au fonctionnement de cet extrait de code. Pour une zone de composants WebPart, l’extrait de code a un ID unique. Une fois l'extrait de code copié dans votre mise en page, vous ne devez pas réutiliser cet ID. Si vous souhaitez ajouter un autre extrait de code de zone de composant WebPart, choisissez Actualiser pour générer un nouvel ID pour l’extrait de code suivant.
Pour obtenir les descriptions des propriétés nécessaires pour limiter une zone de composants WebPart (LockLayout, AllowCustomization et AllowPersonalization), reportez-vous au Tableau 1.
Remarque
Vous pouvez constater que certains noms de propriété apparaissent en gras dans la grille des propriétés de la galerie d’extraits de code. Ces propriétés possèdent des valeurs qui ont été modifiées par rapport à la configuration par défaut de ce composant, mais elles ne sont pas nécessairement pertinentes pour un scénario de concepteur. En d'autres termes, une propriété peut être affichée en gras sans être obligatoirement importante pour votre scénario.
Après avoir configuré toutes les propriétés, choisissez Mettre à jour. Cela met à jour l'extrait de code HTML sur le côté gauche de la page, de sorte que le balisage reflète vos paramètres personnalisés. Vous pouvez toujours choisir Réinitialiser pour restaurer toutes les propriétés sur leurs paramètres par défaut.
Sur le côté gauche de la galerie d'extraits de code, sous Extrait de code HTML, choisissez Copier dans le Presse-papiers.
Dans votre éditeur HTML, ouvrez le lecteur réseau mappé sur votre ordinateur, puis le fichier HTML de la page maître ou la mise en page à laquelle vous ajoutez l’extrait de code.
Pour plus d’informations, voir Guide pratique pour mapper un lecteur réseau à la galerie de pages maîtres SharePoint.
Dans le fichier HTML, collez l’extrait de code à l’endroit où vous souhaitez que le balisage s’affiche.
Lorsque vous ajoutez l'extrait de code à une mise en page, veillez à le coller dans PlaceHolderMain.
Remplacez la balise
<div>avecclass="DefaultContentBlock"par votre propre contenu spécifique.Si vous souhaitez préremplir la zone avec des composants WebPart (par exemple, si la zone limite les auteurs de contenu à la modification des composants WebPart existants uniquement et les empêche d’en ajouter de nouveaux), insérez des extraits de code de composant WebPart à l’endroit où la balise apparaît.
Enregistrez la page, puis actualisez l'aperçu côté serveur dans le gestionnaire de conception pour vous assurer que la page s'affiche comme prévu.
Présentation du balisage d'extrait de code
Les deux parties les plus importantes d’un extrait de code de zone de composant WebPart sont la propriété ID et le commentaire. Chaque zone doit posséder un ID unique. Si vous souhaitez ajouter plusieurs zones de composants WebPart à votre mise en page, veillez à choisir Actualiser dans la galerie d’extraits de code avant de copier chaque extrait de code afin qu’un nouvel ID soit généré. Le commentaire doit être remplacé par tous les composants WebPart que vous souhaitez afficher dans la zone par défaut.
Les propriétés supplémentaires pouvant être utilisées pour limiter l'utilisation des zones par les auteurs de contenu ( AllowCustomization, AllowPersonalization et LockLayout) sont présentées dans le code suivant.
Remarque
Les propriétés AllowCustomization, AllowPersonalization et LockLayout apparaissent dans les marques seulement si vous modifiez leurs valeurs par défaut dans la grille des propriétés.
<div data-name="WebPartZone">
<!--CS: Start web part zone Snippet-->
<!--SPM:<%@Register Tagprefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c"%>-->
<div xmlns:ie="ie">
<!--MS:<WebPartPages:WebPartZone runat="server" ID="x0e5f5212505f48a9aac43df13eeae4f9" AllowCustomization="True" AllowPersonalization="False" FrameType="TitleBarOnly" LockLayout="True" Orientation="Vertical">-->
<!--MS:<ZoneTemplate>-->
<!--DC: Replace this comment with default web parts for new pages. -->
<!--ME:</ZoneTemplate>-->
<!--ME:</WebPartPages:WebPartZone>-->
</div>
<!--CE: End web part zone Snippet-->
</div>