Pratiques et outils de développement et de conception SharePoint

Cet article fournit des informations sur les options de développement et de conception disponibles dans SharePoint. Vous trouverez également des informations sur la manière d'utiliser le modèle de provisionnement à distance pour appliquer la conception de la marque à un site SharePoint.

Notes

Le code dans cet article est fourni tel quel, sans garantie d’aucune sorte, expresse ou implicite, y compris mais sans s’y limiter, aucune garantie implicite d’adéquation à un usage particulier, à une qualité marchande ou une absence de contrefaçon.

Termes et concepts

Tableau 1. Principaux concepts et termes en lien avec la conception et le développement dans SharePoint

Terme ou concept Définition Plus d’informations
Gestionnaire de conception Fonctionnalité activée dans des sites de publication ou d’équipe SharePoint avec la publication activée, utilisée pour importer et gérer des éléments de personnalisation de site et les exporter vers un package de conception. Utilisez le Gestionnaire de conception pour importer des éléments de personnalisation créés dans d’autres outils, tels qu’Adobe Photoshop ou Adobe Dreamweaver, dans SharePoint.

SharePoint Designer n’est pas disponible pour une utilisation avec des sites d’équipe OneDrive Entreprise ou SharePoint dans lesquels la publication n’est pas activée.
Package de conception Conçu pour être utilisé avec des sites de publication SharePoint, contient des éléments de personnalisation stockés dans le Gestionnaire de conception. Manuel d’utilisation des composites SharePoint
Approvisionnement à distance Modèle qui implique l’approvisionnement de sites à l’aide de modèles et de code qui s’exécute en dehors de SharePoint dans un complément hébergé par un fournisseur. - Techniques d’approvisionnement de site et approvisionnement à distance dans SharePoint 2013
- Approvisionnement de site en libre service à l’aide d’applications pour SharePoint 2013
Site web racine Premier site web à l’intérieur d’une collection de sites. Le site web racine est parfois appelé « Racine d’application web ».
Solutions en bac à sable fichiers .wsp qui contiennent des assemblys, les autres composants non compilé et un XML fichier manifeste. Une solution bac à sable utilise un code de confiance partielle. Solutions en bac à sable
SharePoint Designer Un concepteur HTML et un outil de gestion des ressources de conception pour la gestion des éléments de personnalisation dans SharePoint. SharePoint Designer prend principalement en charge les flux de travail personnalisés. - Nouveautés du développement de sites SharePoint
fichier .wsp Un fichier solution SharePoint. Un fichier .wsp est un fichier .cab qui catégorise les éléments de site et les organise avec un fichier manifest.xml. Vue d’ensemble des solutions

Options de développement

Lorsque vous utilisez SharePoint en tant que plateforme de développement, vous devez créer un environnement pour développer, tester, créer et déployer votre contenu. Pour plus d’informations sur les options de développement, voir Modèle objet de flux de travail SharePoint et API ALM (Application Lifecycle Management).

Tableau 2. Options de développement, de test et d’acceptation dans SharePoint

Option À prendre en considération
Team Foundation Server - Situé dans Visual Studio Team Services pour faciliter l’accès.
- Inclut un système centralisé de gestion du code source et du cycle de vie.
Environnements cloud de test et d’acceptation - Utilisent un client distinct pour les tests d’acceptation.
- Environnement de test distinct pour les tests locaux.
Environnements locaux de test et d’acceptation - Utilisé pour des déploiements SharePoint locaux.
- Hébergés par les clients localement ou dans Microsoft Azure.

En général, vous avez au moins besoin des clients suivants, même si cela peut varier en fonction de vos exigences :

  • Client développeur. En guise de meilleure pratique, approvisionnez et utilisez votre propre site de développeur. Vous éviterez ainsi de mélanger vos données avec l’environnement de production. Pour créer et approvisionner un site de développeur, voirConfigurer un environnement de développement pour les compléments SharePoint sur Office 365.

  • Client de test/intégration. Utilisez ce site pour vous assurer que les fonctionnalités et les nouvelles applications fonctionnent sur plus d’une collection de sites et contre les services et les données dans l’environnement de production. Configurez l’environnement pour inclure des fonctionnalités en préversion. (Pour ce faire, dans votre console d’administrateur client, choisissez Paramètres du service, puis, sous le paramètre Mises à jour, sélectionnez Première publication.) Vous pouvez utiliser Visual Studio Team Services pour exécuter des tests automatisés et d’autres tests d’intégration continue.

  • Client de production. Publication testées, acceptée et approuvée applications à ce client. Vous pouvez créer un site développeur sur ce client pour développer et tester des applications sont de petits dans l’étendue ou ont isolé impact. En général, évitez de vos environnements de développement et de production.

Outils de conception

Utilisez des outils de conception et de développement Web standard, tels que des fichiers HTML, des images, des fichiers CSS et des fichiers JavaScript, pour créer des actifs de marque pour les sites SharePoint. Par exemple, vous pouvez utiliser Adobe DreamWeaver et Adobe PhotoShop pour concevoir les fichiers HTML, CSS, JavaScript et images que vous utilisez pour créer la marque de vos sites SharePoint. Vous pouvez également utiliser le concepteur SharePoint Designer pour créer, gérer et personnaliser les ressources d'image de marque, ou créer des solutions personnalisées dans Visual Studio.

Packages de conception SharePoint et fichiers .wsp

Conception packages sont fichiers .wsp créés par le Gestionnaire de conception qui obéissent aux règles prévisibles pour les ressources de conception d’emballage. Ils sont essentiellement, solutions en mode sandbox. Si vous utilisez un autre outil de personnalisation des éléments dans un fichier .wsp package, vos éléments de personnalisation sera dans un état moins fixe et de prévisibilité.

Le package de conception comprend tous les fichiers qui ont été personnalisés. Par exemple, si vous créez une mise en page qui utilise un type de contenu personnalisé, le paquet de conception inclut la mise en page, le type de contenu personnalisé qu'elle utilise et toutes les colonnes de site personnalisées. Le dossier de conception comprend également plusieurs fichiers liés à tout aspect composé qui a été appliqué à votre site SharePoint, y compris les fichiers téléchargés aux emplacements suivants :

  • la bibliothèque d'éléments de site ;
  • la bibliothèque de styles ;
  • Galerie de pages maîtres

Si vous avez appliqué des looks composés à un site avant d'appliquer une stratégie de marque personnalisée, le pack de conception comprendra des fichiers portant les extensions .themedcss et .themedpng. Pour appliquer les ressources de stratégie de marque d'un pack de conception à un site SharePoint, exportez le pack de conception et utilisez le modèle de provisionnement à distance pour appliquer le contenu du package de conception.

SharePoint inclut les API que vous pouvez utiliser pour travailler avec des packages de conception. Si vous utilisez des modèles SSOM, CSOM ou JSOM, vous pouvez vous servir des classes DesignPackage ou DesignPackageInfo.

Utilisation du modèle CSOM de package de conception pour appliquer les contenus de packages de conception à un site SharePoint

Les exemples suivants montrent comment utiliser les API de package de conception dans le modèle d’approvisionnement à distance pour appliquer les contenus de packages de conception à un site SharePoint.

Ce code a été conçu pour être utilisé avec les sites de publication. Bien qu’il soit possible d’utiliser l’API Packages de conception pour appliquer la personnalisation aux sites d’équipe pour lesquels la fonctionnalité de publication est activée, cela peut entraîner des problèmes de prise en charge à long terme.

using Microsoft.SharePoint.Client;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Microsoft.SharePoint.Client.Publishing;
namespace ProviderSharePointAppWeb
{
    public partial class Default : System.Web.UI.Page
    {
        protected void Page_PreInit(object sender, EventArgs e)
        {
            Uri redirectUrl;
            switch (SharePointContextProvider.CheckRedirectionStatus(Context, out redirectUrl))
            {
                case RedirectionStatus.Ok:
                    return;
                case RedirectionStatus.ShouldRedirect:
                    Response.Redirect(redirectUrl.AbsoluteUri, endResponse: true);
                    break;
                case RedirectionStatus.CanNotRedirect:
                    Response.Write("An error occurred while processing your request.");
                    Response.End();
                    break;
            }
        }

        protected void Page_Load(object sender, EventArgs e)
        {
            // Use TokenHelper to get the client context and Title property.
            // To access other properties, the add-in might need to request permissions
            // on the host web.
            var spContext = SharePointContextProvider.Current.GetSharePointContext(Context);
            
            // Publishing feature GUID to use the infrastructure for publishing. 
            Guid PublishingFeature = Guid.Parse("f6924d36-2fa8-4f0b-b16d-06b7250180fa");

            // The site-relative URL of the design package to install.
            // This sandbox design package should be uploaded to a document library.
            // For practical purposes, this can be a configuration setting in web.config.
            string fileRelativePath = @"/sites/devsite/brand/Dev.wsp";

            //string fileUrl = @"https://SPXXXXX.com/sites/devsite/brand/Dev.wsp";
            
        
            using (var clientContext = spContext.CreateUserClientContextForSPHost())
            {
                // Load the site context explicitly or while installing the API, the path for
// the package will not be resolved.
                // If the package cannot be found, an exception is thrown. 
                var site = clientContext.Site;
                clientContext.Load(site);
                clientContext.ExecuteQuery();
              
                // Validate whether the Publishing feature is active. 
                if (IsSiteFeatureActivated(clientContext,PublishingFeature))
                {
                    DesignPackageInfo info = new DesignPackageInfo()
                    {
                        PackageGuid = Guid.Empty,
                        MajorVersion = 1,
                        MinorVersion = 1,
                        PackageName = "Dev"
                    };
                    Console.WriteLine("Installing design package ");
                    
                    DesignPackage.Install(clientContext, clientContext.Site, info, fileRelativePath);
                    clientContext.ExecuteQuery();

                    Console.WriteLine("Applying design package");
                    DesignPackage.Apply(clientContext, clientContext.Site, info);
                    clientContext.ExecuteQuery();
                }
            }
        }
        public  bool IsSiteFeatureActivated( ClientContext context, Guid guid)
        {
            var features = context.Site.Features;
            context.Load(features);
            context.ExecuteQuery();

            foreach (var f in features)
            {
                if (f.DefinitionId.Equals(guid))
                    return true;
            }
            return false;
        }
 
    }
}

Utilisation de FileCreationInformation pour charger des éléments de personnalisation vers une page maître ou un site d’équipe

Vous pouvez utiliser la fonctionnalité de modèle CSOM SharePoint pour installer et désinstaller des packages de conception et les exporter vers des sites SharePoint Online.

Par exemple, utilisez la méthode SP.Publishing.DesignPackage.install (sp.publishing) ou la méthode DesignPackage.Install pour installer le package de conception sur le site, comme illustré dans l’exemple suivant.

public static void Install(
        ClientRuntimeContext context,
        Site site,
        DesignPackageInfo info,
        string path
)

La classe DesignPackageInfo spécifie les métadonnées qui décrivent le contenu du package de conception à installer. Utilisez la méthode Uninstall pour désinstaller le package de conception du site, comme illustré dans l’exemple suivant.

public static void UnInstall(
        ClientRuntimeContext context,
        Site site,
        DesignPackageInfo info
)

Si vous avez besoin de personnaliser un site d’équipe avec la fonctionnalité de publication activée ou un site de publication sur SharePoint Online, vous pouvez utiliser la méthode ExportEnterprise ou ExportSmallBusiness afin d’exporter les packages de conception pour les modèles de site vers la galerie Solutions. Utiliser le ExportSmallBusiness méthode avec petite entreprise modèle de site et utiliser le ExportEnterprise méthode pour tous les autres modèles de site, comme illustré dans l’exemple suivant.

public static ClientResult<DesignPackageInfo> ExportEnterprise(
        ClientRuntimeContext context,
        Site site,
        bool includeSearchConfiguration
)

Lorsque vous utilisez la méthode ExportSmallBusiness, vous pouvez inclure la configuration de recherche dans le package de conception, comme illustré dans l’exemple suivant. Notez que toutes les méthodes de package de conception opèrent au niveau de la collection de sites. Le nom du package de conception est représenté par la chaîne packageName.

public static ClientResult<DesignPackageInfo> ExportSmallBusiness(
        ClientRuntimeContext context,
        Site site,
        string packageName,
        bool includeSearchConfiguration
)

Options d’outil de conception pour SharePoint Online

Les outils que vous pouvez utiliser pour marquer un site SharePoint Online dépendent de votre édition SharePoint Online et du type de site que vous souhaitez créer. L'édition pour petites entreprises, par exemple, comprend un site d'équipe et un site public. Elle ne comprend pas de site de publication. Vous pouvez utiliser le module complémentaire Site Builder de SharePoint Online pour personnaliser l'image de marque du site public.

L'édition Enterprise comprend une collection de sites d'équipe à la racine de l'application Web pour le domaine qui n'inclut pas la publication. Elle n'inclut pas de site public. Utilisez le gestionnaire de conception pour gérer les éléments d'image de marque du site SharePoint pour le site de publication dans l'édition Enterprise de SharePoint Online.

Voir aussi