Comprendre la transformation de la mise en page

Chaque page source transformée présente une certaine disposition, généralement une des dispositions prédéfinies prêtes à l’emploi proposées par SharePoint. Lorsqu’une page est transformée en page moderne, cette dernière prend en charge la disposition de la page . Les pages modernes cibles présentent des fonctionnalités de disposition différentes et dès lors, il apparaît important de comprendre la manière dont la mise en page source est mappée vers la mise en page cible.

Mappage de mise en page de composant WebPart

Mise en page source Mise en page cible
Diagramme illustrant la ligne de colonne supérieure d’un écran. 1 colonne ligne
en-tête, colonne gauche, corps 1 colonne ligne + 2 colonne ligne gauche
en-tête, colonne droite, corps 1 colonne ligne + 2 colonne ligne droite
en-tête, pied de page, 3 colonnes 1 colonne ligne + 3 colonne ligne + 1 colonne ligne
en-tête, pied de page, 3 colonnes, 4 lignes 1 colonne ligne + 3 colonne ligne + 1 colonne ligne
en-tête, pied de page, 4 colonnes 1 colonne ligne + 3 colonne ligne + 1 colonne ligne
colonne gauche, en-tête, pied de page, ligne supérieure 1 colonne ligne + 1 colonne ligne + 3 colonne ligne + 1 colonne ligne
colonne droite, en-tête, pied de page, ligne supérieure 1 colonne ligne + 1 colonne ligne + 3 colonne ligne + 1 colonne ligne

Mappage de mise en page Wiki

Mise en page source Mise en page cible
Capture d’écran du texte d’une colonne à côté d’une icône de colonne unique. 1 colonne ligne
2 colonnes 2 colonne ligne
2 colonnes gauche 2 colonne ligne gauche
en-tête, 2 colonnes 1 colonne ligne + 2 colonne ligne
en-tête, 2 colonnes, pied de page 1 colonne ligne + 2 colonne ligne + 1 colonne ligne
3 colonnes 3 colonne ligne
en-tête, 3 colonnes 1 colonne ligne + 3 colonne ligne
en-tête, 3 colonnes, pied de page 1 colonne ligne + 3 colonne ligne + 1 colonne ligne

Mappage de disposition de page de publication

Les pages de publication n’ayant pas de disposition fixe, le gestionnaire de présentation par défaut utilisé par le transformateur de page de publication fonctionne différemment. Il génère les lignes et colonnes nécessaires en fonction de la position des composants WebPart, telle que définie dans le fichier de mappage de disposition de page utilisé. Ce comportement de disposition est défini par défaut sur AutoDetect dans le fichier de mappage à l’aide de l’attribut PageLayoutTemplate. Si, pour une raison quelconque, vous n’aimez pas la génération de disposition automatique, vous pouvez également utiliser les types de disposition de page Wiki décrits précédemment.

<PageLayout Name="WelcomeLinks" AssociatedContentType="" PageLayoutTemplate="AutoDetect" PageHeader="Custom">

Remplacement de la transformation de disposition par défaut

Si pour une raison quelconque, vous souhaitez transformer des dispositions différemment, vous pouvez ajouter votre propre composant de transformation de disposition comme illustré dans l’extrait de code ci-dessous :

public class MyLayout : ILayoutTransformator
{
  private ClientSidePage page;

  public MyLayout(ClientSidePage page)
  {
    this.page = page;
  }

  public void Transform(PageLayout layout)
  {
    // custom layout transformation...add sections to the target page based upon the recieved page layout
    switch (layout)
    {
        case PageLayout.Wiki_OneColumn:
        case PageLayout.WebPart_FullPageVertical:
        case PageLayout.Wiki_Custom:
        case PageLayout.WebPart_Custom:
            {
                page.AddSection(CanvasSectionTemplate.OneColumn, 1);
                return;
            }
        // add more incoming layouts...
        default:
            {
                page.AddSection(CanvasSectionTemplate.OneColumn, 1);
                return;
            }
    }
  }
}

ILayoutTransformator layoutOverride(ClientSidePage cp)
{
    return new MyLayout();
}

// Now use the custom layout transformator
PageTransformationInformation pti = new PageTransformationInformation(page)
{
    // If target page exists, then overwrite it
    Overwrite = true,
    // Callout to your custom layout handler
    LayoutTransformatorOverride = layoutOverride,
};

// Transform the page using the custom layout handled hooked up
pageTransformator.Transform(pti);