Partager via

Procédure pas à pas : importation d'une page maître et d'une page de site personnalisées avec une image

  • Article

Cette procédure pas à pas explique comment importer une page maître personnalisée SharePoint et une page de site qui ont une image dans un projet SharePoint Visual Studio.

Cette procédure pas à pas montre comment effectuer les tâches suivantes :

  • Créer une page maître personnalisée et une page de site à l'aide d'une image dans SharePoint Designer.

  • Exporter une page maître personnalisée, une image et une page de site vers un fichier de solution SharePoint (.wsp).

  • Importer et déployer le fichier .wsp dans un projet SharePoint Visual Studio à l'aide du projet Importer le package de solution SharePoint.

[!REMARQUE]

Il est possible que votre ordinateur affiche des noms ou des emplacements différents pour certains des éléments d'interface utilisateur de Visual Studio dans les instructions suivantes. L'édition de Visual Studio dont vous disposez et les paramètres que vous utilisez déterminent ces éléments. Pour plus d'informations, consultez Paramètres Visual Studio.

Composants requis

Vous devez disposer des composants suivants pour terminer cette procédure pas à pas :

Créer des éléments dans SharePoint Designer

Cet exemple indique comment créer trois éléments dans SharePoint Designer pour l'exportation : une page maître personnalisée, une page de site qui référence la page maître personnalisée, et un fichier image à afficher dans la page de site.L'image est ajoutée au dossier /images/ dans SharePoint.

Pour créer une page maître personnalisée dans SharePoint Designer

  1. Dans SharePoint designer, dans le volet de navigation, choisissez l'objet de site Pages maîtres .

  2. Dans le ruban Pages maîtres , choisissez Masquer la page maître.

  3. Sélectionnez la nouvelle page maître, puis, dans le ruban Pages maîtres , choisissez Modifier le fichier.

  4. En bas de SharePoint designer, choisissez Code tableau.

  5. Remplacez la balise existante par la balise suivante.

    <%@ Master Language="C#" %>
<%@ Register tagprefix="SharePoint" namespace="Microsoft.SharePoint.WebControls" assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<html dir="ltr">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<SharePoint:RobotsMetaTag runat="server" __designer:Preview="" __designer:Values="&lt;P N='InDesign' T='False' /&gt;&lt;P N='ID' T='ctl00' /&gt;&lt;P N='Page' ID='1' /&gt;&lt;P N='TemplateControl' ID='2' /&gt;&lt;P N='AppRelativeTemplateSourceDirectory' R='-1' /&gt;"></SharePoint:RobotsMetaTag>
<title>Web Page</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ContentPlaceHolder id="ContentPlaceHolderMain" 
        runat="server">
      </asp:ContentPlaceHolder>
</form>
</body>
</html>

  6. Enregistrez la page, sélectionnez l'onglet Pages maîtres , et renommez la page maître comme mybasic1.master.

Ajouter une image à la base de données de contenu dans SharePoint Designer

À présent, vous pouvez ajouter une image à afficher dans la page de site.L'image est déployée sur la base de données de contenu SharePoint.

Pour ajouter une image à la base de données de contenu dans SharePoint Designer

  1. Dans le volet de navigation, choisissez l'objet de site Tous les fichiers , puis, dans l'arborescence, sélectionnez le dossier images .

  2. Dans le ruban Tous les fichiers , choisissez fichiers d'importation, choisissez un fichier de votre choix, puis choisissez le bouton OK .Dans cet exemple, le fichier est nommé myimg1.png.

    Vous pouvez également créer un sous-dossier dans lequel organiser les images.

  3. Fermez la boîte de dialogue Importer.

Créer une page de site

Cette page de site de base utilise la page maître personnalisée et affiche l'image que vous avez ajoutée à l'étape précédente.

Pour créer une page de site

  1. Dans le volet de navigation, choisissez l'objet Pages du site .

  2. Dans le ruban Pages , choisissez le bouton Page , choisissez le type de page ASPX , puis nommez le nouveau fichier mycontentpage1.aspx.

    Vous pouvez également créer un sous-dossier dans lequel organiser les pages de site.

  3. Dans les pages de site liste, sélectionnez MyContentPage1.aspx pour ouvrir sa page de propriétés, puis, en bas de la page, cliquez sur le lien Modifier le fichier .

    Si un message s'affiche et indique que cette page ne contient aucune zone qui sont modifiable en mode sans échec et ne demande pas si vous souhaitez ouvrir cette page en mode avancé, choisissez le bouton oui .

  4. En bas de la page, choisissez le bouton Code .

  5. Remplacez la balise existante par la balise suivante.

    <%@ Import Namespace="Microsoft.SharePoint.ApplicationPages" %>
<%@ Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register Tagprefix="Utilities" Namespace="Microsoft.SharePoint.Utilities" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register Tagprefix="asp" Namespace="System.Web.UI" Assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" %>
<%@ Import Namespace="Microsoft.SharePoint" %>
<%@ Assembly Name="Microsoft.Web.CommandUI, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Page Language="C#" Inherits="Microsoft.SharePoint.WebControls.LayoutsPageBase" MasterPageFile="../_catalogs/masterpage/mybasic1.master" meta:progid="SharePoint.WebPartPage.Document" %>

<asp:Content ID="Main" ContentPlaceHolderID="ContentPlaceHolderMain" runat="server">
<img alt="My Image" longdesc="My image from images folder" src="../images/myimg1.png" />
</asp:Content>

  6. Enregistrez la page de site mise à jour.

Exporter les éléments de SharePoint

Exportez les éléments de SharePoint vers un fichier solution SharePoint (.wsp).

Pour exporter des éléments de SharePoint Designer

  1. Dans SharePoint designer, dans le volet de navigation, choisissez l'objet Site d’équipe , puis, dans le ruban Site , choisissez Enregistrer comme modèle.

  2. Dans la boîte de dialogue Enregistrer comme modèle , entrez un nom de fichier et un nom de modèle, activez la case à cocher Inclure le contenu , puis choisissez le bouton OK .

    Le contenu du site est alors enregistré dans le fichier .wsp.

  3. Une fois la solution exporte, cliquez sur le lien Galerie Solutions pour afficher la liste des fichiers solution sont disponibles.

  4. Ouvrez le menu contextuel du fichier .wsp, puis choisissez Enregistrer la cible sous pour l'enregistrer dans le système.

Importer des éléments dans Visual Studio

Importez le fichier .wsp dans Visual Studio. Une fois que le contenu importé, vous pouvez le personnaliser, ajoutez des éléments, puis le déployer.

Pour importer des éléments à partir du fichier .wsp dans Visual Studio

  1. Dans Visual Studio, créez un projet Importer le package de solution SharePoint 2010 .

  2. Dans la page Sélectionner les éléments à importer , sous Module dans la colonne Type , activez les cases à cocher pour que les fichiers dans le tableau suivant pour l'importation.

    Nom de fichier

    Description

    _catalogsmasterpage_

    Page maître personnalisée.

    images_

    Fichier image dans le système de fichiers SharePoint.

    SitePages_

    Page de site.

  3. Choisissez le bouton Terminer pour importer les éléments sélectionnés.

  4. Dans Explorateur de solutions, sélectionnez le nœud de _catalogsmasterpage_, et affectez à sa propriété Résolution de conflit de déploiement à Automatique.

    Cela permet de s'assurer que tous les éventuels conflits de déploiement sont résolus automatiquement.

  5. Si votre nouvelle page maître porte le même nom qu'une page existante, assurez-vous que la page existante n'est pas marquée comme page maître par défaut ou page maître personnalisée dans SharePoint Designer.

    Si une page maître existante est marquée comme page maître par défaut ou page maître personnalisée, vous obtenez une erreur de déploiement qui indique que la page maître ne peut pas être supprimée.Pour éviter ce problème, procédez comme suit :

    • Si la page maître existante est définie comme page maître par défaut, définissez temporairement une autre page maître comme page maître par défaut.Après avoir déployé les fichiers sur SharePoint, définissez votre nouvelle page maître comme page maître par défaut.

    • Si la page maître existante est définie comme page maître personnalisée, définissez temporairement une autre page maître comme page maître personnalisée.Après avoir déployé les fichiers sur SharePoint, définissez votre nouvelle page maître comme page maître personnalisée.

  6. Dans la barre de menus, sélectionnez Générer, Déployer la solution.

  7. Ouvrez le site SharePoint pour afficher les éléments déployés.

Un autre manière d'importer des fichiers dans Visual Studio et de les déployer sur SharePoint consiste à ajouter les fichiers dans des modules dans Visual Studio.Pour plus d'informations, consultez Comment : importer une page maître ou un thème et Utilisation de modules pour inclure des fichiers dans la solution.

Voir aussi

Concepts

Importation d'éléments d'un site SharePoint existant

Autres ressources

Développement de solutions SharePoint

Création de contrôles réutilisables pour les composants WebPart ou les pages d'application