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 y trouverez également des informations sur la façon d’utiliser le modèle d’approvisionnement à distance pour appliquer des éléments de personnalisation à un site SharePoint.

Remarque

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. Termes et concepts clés du développement et de la conception 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 de l'application web.
Solutions en bac à sable	Fichiers .wsp contenant des assemblys, d'autres composants non compilés et un fichier manifeste XML. Une solution en bac à sable utilise le code de confiance partielle.	Solutions en bac à sable
SharePoint Designer	Concepteur HTML et outil de gestion des éléments de conception pour la gestion des éléments de personnalisation dans SharePoint. SharePoint Designer prend en charge principalement les flux de travail personnalisés.	- Nouveautés du développement de sites SharePoint
fichier .wsp	Fichier de 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 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. Publiez des applications testées, acceptées et approuvées sur ce client. Vous pouvez publier un site du développeur sur ce client pour développer et tester des applications ayant une étendue limitée ou un impact isolé. En règle générale, éviter d'amalgamer vos environnements de développement et de production.

Outils de conception

Utilisez des outils de développement et de conception web standard, tels que du code HTML, des images, ou des fichiers CSS et JavaScript pour créer des éléments de personnalisation de site SharePoint. Par exemple, vous pouvez utiliser Adobe DreamWeaver et Adobe PhotoShop pour concevoir les fichiers HTML, CSS, JavaScript et image que vous utilisez pour personnaliser vos sites SharePoint. Vous pouvez également utiliser SharePoint Designer pour créer, gérer et personnaliser des éléments de personnalisation, ou créer des solutions personnalisées dans Visual Studio.

Packages de conception SharePoint et fichiers .wsp

Les packages de conception sont des fichiers .wsp créés par le gestionnaire de conception qui suivent des règles prévisibles pour la constitution de packages d'éléments de conception. Ils sont essentiellement des solutions en bac à sable (sandbox). Si vous utilisez un autre outil pour constituer des packages d'éléments de personnalisation dans un fichier .wsp, l'état de vos éléments de personnalisation sera moins fixe et prévisible.

Le package de conception inclut 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 package de conception inclut la mise en page, le type de contenu personnalisé qu’elle utilise et toutes les colonnes de site personnalisé. Le package de conception comprend également plusieurs fichiers liés aux mises en page composées qui ont été appliquées à votre site SharePoint, dont les fichiers téléchargés vers les emplacements suivants :

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

Si vous avez appliqué à un site composées avant l’application de personnalisation, le package de conception incluront fichiers avec les extensions .themedcss et .themedpng. Pour appliquer les éléments de personnalisation d’un package de conception à un site SharePoint, exportez le package de conception et utilisez le modèle d’approvisionnement à 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 SSOM, CSOM ou JSOM, vous pouvez utiliser les 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 des sites de publication. Bien qu’il soit possible d’utiliser l’API de package de conception pour appliquer une personnalisation à des sites d’équipe dont la fonctionnalité de publication est activée, cela peut générer 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 personnaliser un site SharePoint Online dépendent de votre édition de SharePoint Online et du type de site que vous voulez créer. Par exemple, l’édition Petite entreprise inclut un site d’équipe et un site public. Elle n’inclut pas de site de publication. Vous pouvez utiliser le complément Générateur de site de SharePoint Online pour la personnalisation de site public.

L’édition Entreprise inclut une collection de sites d’équipe dans l’application de site web racine 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 de personnalisation SharePoint pour le site de publication dans l’édition SharePoint Online Entreprise.

Voir aussi

• Ressources de la communauté de développeurs SharePoint (SharePoint PnP)
• Modèles et pratiques de développement Office 365 sur GitHub
• Solutions de personnalisation et de mise en service du site pour SharePoint