Partager via


Ajouter un extrait de code Modifier le panneau des modes 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.

Un panneau en Mode modifier est un extrait de code que vous pouvez utiliser pour afficher les instructions ou les autres auteurs de contenu aux personnes voient le contenu du panneau uniquement lorsqu'ils modifient une page. En revanche, cet extrait de code peut également être configuré pour afficher son contenu uniquement en mode normal (affichage) plutôt qu'en mode édition.

Présentation du Panneau de configuration en Mode modifier

Dans un site de publication, aux auteurs de contenu avec les autorisations nécessaires peuvent créer ou modifier des pages qui se trouvent dans la bibliothèque de Pages. En règle générale, un auteur choisit de créer ou modifier une page, puis ajoute le contenu vers les divers champs de page.

En tant que concepteur, vous pouvez ajouter un panneau en Mode modification à une page maître ou la mise en page et le contenu de cet extrait sera visible par les auteurs de contenu uniquement lorsqu'ils choisissent modifier une page basée sur cette mise en page ou une page associée à cette page maître. Par exemple, vous pouvez utiliser un panneau en Mode Modifier pour afficher le contenu suivant uniquement aux auteurs de contenu lorsque la page est en mode édition :

  • Un champ de page, tels que Schedule Publishing Date, qui est important pour l'auteur du contenu, mais pas pour les visiteurs de l'affichage de la page sur le site actif.

  • Description du type de contenu doit être entré dans un champ de page.

  • Une note aux créateurs de contenu qu'ils doivent prendre en compte l'aspect de la page pour différents canaux.

Vous pouvez également placer des liens vers des feuilles de style différents dans un panneau de configuration en Mode modifier afin que vous pouvez fournir des styles différents pour le mode d'édition et le mode d'affichage.

Lorsque les notes pour les auteurs de contenu sont spécifiques au type de contenu basé sur lequel cette mise en page, vous devez ajouter le panneau de configuration en Mode Modifier pour une mise en page. Vous pouvez également ajouter cet extrait de code à une page maître lorsque les notes pour les auteurs sont appliquent à toutes les pages qui seront associés à cette page maître — par exemple, si le panneau de configuration contient des instructions permettant de fournir du contenu pour un canal de périphérique spécifique qui utilise cette page maître.

Vous pouvez également définir un panneau en Mode Modifier pour afficher son contenu qu'en mode normal, plutôt qu'en mode édition, si vous disposez d'un scénario dans lequel il est utile ou utile d'afficher le contenu uniquement aux visiteurs du site (mais pas les auteurs de contenu) lorsqu'ils modifient une page.

Insérer un panneau de configuration du Mode Édition

Comme tous les extraits de code, vous ajoutez cet extrait de code à partir de la galerie d'extraits de code. Pour accéder à la galerie d'extraits de code, vous devez d'abord sélectionner une page maître ou la mise en page à modifier.

Pour insérer un panneau de configuration du Mode Édition

  1. Accédez à votre site de publication.

  2. Dans le coin supérieur droit de la page, sélectionnez l'icône d'engrenage de paramètres, puis choisissez Gestionnaire de conception.

  3. Dans le Gestionnaire de conception, dans le volet de navigation de gauche, choisissez Modifier les pages maîtres ou Modifier des mises en page, en fonction du type de fichier que vous modifiez.

  4. Sélectionnez le nom de la page maître ou la mise en page que vous souhaitez ajouter l'extrait de code.

  5. 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.

  6. Sur le ruban, sous l'onglet Création, choisissez Modifier le panneau de configuration en Mode, puis choisissez le mode que vous souhaitez que votre extrait à afficher dans.

  7. 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 les plus importantes pour le fonctionne de cet extrait de code particulier. Pour modifier le Mode panneau, la propriété PageDisplayMode définira Edit ou Display, selon le mode que vous avez sélectionné dans le ruban.

  8. 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.

  9. Sur le côté gauche de la galerie d'extraits de code, sous Extrait de code HTML, choisissez Copier dans le Presse-papiers.

  10. 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.

  11. Dans le fichier HTML, collez l’extrait de code à l’endroit où vous souhaitez que le balisage s’affiche.

    Si vous ajoutez à une mise en page du Panneau de configuration en Mode modifier, veillez à coller l'extrait de code à l'intérieur de PlaceHolderMain de sorte que le panneau de configuration est visible par les auteurs de contenu en mode édition. Vous pouvez coller l'extrait de code immédiatement avant un champ de page spécifique, ou vous pouvez placer un ou plusieurs champs de page à l'intérieur du Panneau de configuration en Mode modifier.

  12. Remplacez le

    class="DefaultContentBlock" avec votre propre contenu spécifique, par exemple, avec des notes ou des instructions pour les auteurs de contenu, ou des champs de page spécifiques qui sont utiles pour les auteurs, mais pas les visiteurs du site.

  13. Enregistrez la page, puis actualisez l'aperçu côté serveur dans le Gestionnaire de conception pour vous assurer que le panneau de configuration en Mode Modifier s'affiche comme prévu.

Comprendre le balisage d'extrait de code

Les deux parties les plus importantes d’un extrait de code du panneau en mode Édition sont la propriété PageDisplayMode et le

class="DefaultContentBlock". La propriété PageDisplayMode détermine si le contenu du panneau est affiché uniquement en mode édition ou en mode d'affichage/régulière (autrement dit, chaque fois que la page n'est pas en mode édition).

Remarque

[!REMARQUE] Cette propriété n'apparaît pas dans le balisage, sauf si vous remplacez la valeur Display. Lorsque la propriété n'apparaît pas dans le balisage, le mode par défaut pour l'extrait de code est en mode édition.

Lla

class="DefaultContentBlock" est ce que vous remplacez par votre propre contenu, qui peut inclure d’autres extraits de code et contrôles.


<div data-name="EditModePanelShowInEdit">
    <!--CS: Start Edit Mode Panel Snippet-->
    <!--SPM:<%@Register Tagprefix="Publishing" Namespace="Microsoft.SharePoint.Publishing.WebControls" Assembly="Microsoft.SharePoint.Publishing, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c"%>-->
    <!--MS:<Publishing:EditModePanel runat="server" PageDisplayMode="Display" CssClass="edit-mode-panel">-->
        <!--PS: Start of READ-ONLY PREVIEW (do not modify)--><!--PE: End of READ-ONLY PREVIEW-->
        <div class="DefaultContentBlock" style="border:medium black solid; background:yellow; color:black; margin:20px; padding:10px;">
        You should replace this div with content that renders based on your Edit Mode Panel Properties.
        </div>
        <!--PS: Start of READ-ONLY PREVIEW (do not modify)--><!--PE: End of READ-ONLY PREVIEW-->
    <!--ME:</Publishing:EditModePanel>-->
    <!--CE: End Edit Mode Panel Snippet-->
</div>

Voir aussi