Procédure pas à pas : Importer une page maître personnalisée et la page de site avec une imageWalkthrough: Import a custom master page and site page with an image

Cette procédure pas à pas montre comment importer une page maître personnalisée SharePoint et une page de site qui ont une image dans un Visual StudioVisual Studio projet SharePoint.This walkthrough demonstrates how to import a SharePoint custom master page and a site page that has an image into a Visual StudioVisual Studio SharePoint project.

Cette procédure pas à pas montre comment effectuer les tâches suivantes :This walkthrough shows how to accomplish the following tasks:

  • Créer une page maître personnalisée et une page de site à l’aide d’une image dans SharePoint Designer.Create a custom master page and a site page by using an image in SharePoint Designer.

  • Exporter une page maître personnalisée, une image et une page de site à une solution SharePoint (.wsp) fichier.Export a custom master page, image, and site page to a SharePoint solution (.wsp) file.

  • Importer et déployer le .wsp de fichiers dans un Visual StudioVisual Studio projet SharePoint en utilisant le projet de Package de Solution SharePoint importation.Import and deploy the .wsp file into a Visual StudioVisual Studio SharePoint project by using the Import SharePoint Solution Package project.

    Note

    Il est possible que pour certains des éléments de l'interface utilisateur de Visual Studio, votre ordinateur affiche des noms ou des emplacements différents de ceux indiqués dans les instructions suivantes.Your computer might show different names or locations for some of the Visual Studio user interface elements in the following instructions. L’édition de Visual Studio dont vous disposez et les paramètres que vous utilisez déterminent ces éléments.The Visual Studio edition that you have and the settings that you use determine these elements. Pour plus d’informations, consultez Personnaliser l’IDE.For more information, see Personalize the IDE.

PrérequisPrerequisites

Vous devez disposer des composants suivants pour terminer cette procédure pas à pas :You must have the following components to complete this walkthrough:

  • Éditions prises en charge Microsoft WindowsMicrosoft Windows et SharePoint.Supported editions of Microsoft WindowsMicrosoft Windows and SharePoint.

  • Visual Studio.Visual Studio.

  • SharePoint Designer 2010.SharePoint Designer 2010.

Créer des éléments dans SharePoint DesignerCreate items in SharePoint Designer

Cet exemple montre comment créer trois éléments dans SharePoint Designer pour l’exportation : une page maître personnalisée, une page de site qui fait référence à la page maître personnalisée et un fichier image à afficher sur la page du site.This example shows how to create three items in SharePoint Designer for export: a custom master page, a site page that references the custom master page, and an image file to appear on the site page. L’image est ajoutée au dossier /images/ dans SharePoint.The image is added to the /images/ folder in SharePoint.

Pour créer une page maître personnalisée dans SharePoint DesignerTo create a custom master page in SharePoint Designer

  1. Dans SharePoint Designer, dans le volet de Navigation, choisissez le Pages maîtres objet de site.In SharePoint Designer, in the Navigation pane, choose the Master Pages site object.

  2. Sur le Pages maîtres ruban, choisissez Page maître vierge.On the Master Pages ribbon, choose Blank Master Page.

  3. Choisissez la nouvelle page maître, puis, dans le Pages maîtres ruban, choisissez modifier le fichier.Choose the new master page, and then, on the Master Pages ribbon, choose Edit File.

  4. En bas de SharePoint Designer, choisissez le Code onglet.At the bottom of SharePoint Designer, choose the Code tab.

  5. Remplacez le balisage existant par le balisage suivant.Replace the existing markup with the following markup.

    <%@ 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="<P N='InDesign' T='False' /><P N='ID' T='ctl00' /><P N='Page' ID='1' /><P N='TemplateControl' ID='2' /><P N='AppRelativeTemplateSourceDirectory' R='-1' />"></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, choisissez le Pages maîtres onglet et renommer la page maître en tant que mybasic1.master.Save the page, choose the Master Pages tab, and rename the master page as mybasic1.master.

Ajouter une image à la base de données contenu dans SharePoint DesignerAdd an image to the content database in SharePoint Designer

Vous pouvez maintenant ajouter une image à afficher sur la page du site.Now you can add an image to display on the site page. L’image est déployée sur la base de données de contenu SharePoint.The image is deployed to the SharePoint content database.

Pour ajouter une image à la base de données contenu dans SharePoint DesignerTo add an image to the content database in SharePoint Designer

  1. Dans le volet de Navigation, choisissez le tous les fichiers objet de site et, dans l’arborescence de commandes, choisissez le images dossier.In the Navigation pane, choose the All Files site object, and then, in the tree view, choose the images folder.

  2. Sur le tous les fichiers ruban, choisissez importer des fichiers, choisissez un fichier de votre choix, puis le OK bouton.On the All Files ribbon, choose Import Files, choose a file of your choice, and then choose the OK button. Dans cet exemple, le fichier est nommé myimg1.png.In this example, the file is named myimg1.png.

    Si vous le souhaitez, vous pouvez créer un sous-dossier pour vous aider à organiser les images.Optionally, you can create a subfolder to help organize the images.

  3. Fermer le importation boîte de dialogue.Close the Import dialog box.

Créer une page de siteCreate a site page

Cette page de site de base utilise la page maître personnalisée et affiche l’image que vous avez ajouté à l’étape précédente.This basic site page uses the custom master page and displays the image that you added in the previous step.

Pour créer une page de siteTo create a site page

  1. Dans le volet de Navigation, choisissez le Pages de Site objet.In the Navigation pane, choose the Site Pages object.

  2. Sur le Pages ruban, choisissez le Page bouton, choisissez la ASPX page, tapez, puis nommez le nouveau fichier mycontentpage1.aspx.On the Pages ribbon, choose the Page button, choose the ASPX page type, and then name the new file mycontentpage1.aspx.

    Si vous le souhaitez, vous pouvez créer un sous-dossier pour vous aider à organiser les pages du site.Optionally, you can create a subfolder to help organize the site pages.

  3. Dans la liste de pages de site, choisissez MyContentPage1.aspx pour ouvrir sa page de propriétés, puis, en bas de la page, choisissez le modifier le fichier lien.In the site pages list, choose MyContentPage1.aspx to open its properties page, and then, at the bottom of the page, choose the Edit file link.

    Si un message s’affiche et indique que cette page ne contient pas toutes les régions qui sont modifiables en mode sans échec et vous demande si vous souhaitez ouvrir cette page en mode avancé, choisissez le Oui bouton.If a message appears and says that this page doesn't contain any regions that are editable in safe mode and asks whether you want to open this page in advanced mode, choose the Yes button.

  4. En bas de la page, choisissez le Code bouton.At the bottom of the page, choose the Code button.

  5. Remplacez le balisage existant par le balisage suivant.Replace the existing markup with the following markup.

    <%@ 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 mis à jour.Save the updated site page.

Exporter les éléments à partir de SharePointExport the items from SharePoint

Exporter les éléments à partir de SharePoint à une solution SharePoint (.wsp) fichier.Export the items from SharePoint to a SharePoint solution (.wsp) file.

Pour exporter des éléments à partir de SharePoint DesignerTo export items from SharePoint Designer

  1. Dans SharePoint Designer, dans le volet de Navigation, choisissez le Site d’équipe objet, puis, dans le Site ruban, choisissez enregistrer comme modèle.In SharePoint Designer, in the Navigation pane, choose the Team Site object, and then, on the Site ribbon, choose Save As Template.

  2. Dans le enregistrer comme modèle boîte de dialogue, entrez un nom de fichier et le nom du modèle, sélectionnez le inclure du contenu case à cocher, puis choisissez le OK bouton.In the Save as Template dialog box, enter a file name and template name, select the Include Content check box, and then choose the OK button.

    Cette opération enregistre le contenu du site dans le .wsp fichier.This saves the contents of the site in the .wsp file.

  3. Une fois que les exportations de la solution, choisissez le galerie de solutions lien pour afficher la liste des fichiers de solution disponible.After the solution exports, choose the Solution Gallery link to display the list of available solution files.

  4. Ouvrez le menu contextuel pour le nouveau .wsp de fichiers, puis choisissez enregistrer la cible sous à l’enregistrer dans le système.Open the shortcut menu for the new .wsp file, and then choose Save target as to save it to the system.

Importer les éléments dans Visual StudioImport the items into Visual Studio

Importer le .wsp votre fichier en Visual StudioVisual Studio.Import the .wsp file into Visual StudioVisual Studio. Une fois que le contenu est importé, vous pouvez personnaliser il, ajouter d’autres éléments et ensuite de le déployer.After the content is imported, you can customize it, add more items, and then deploy it.

Pour importer des éléments à partir du fichier .wsp dans Visual StudioTo import items from the .wsp file into Visual Studio

  1. Dans Visual StudioVisual Studio, créer un importer un Package SharePoint 2010 Solution projet.In Visual StudioVisual Studio, create an Import SharePoint 2010 Solution Package project.

  2. Sur le sélectionner les éléments à importer page sous Module dans le Type colonne, sélectionnez les cases à cocher pour que les fichiers dans le tableau suivant pour l’importation.On the Select items to import page, under Module in the Type column, select the check boxes for only the files in the following table for import.

    Nom du fichierFile Name DescriptionDescription
    _catalogsmasterpage__catalogsmasterpage_ La page maître personnalisée.The custom master page.
    images_images_ Le fichier image dans le système de fichiers SharePoint.The image file in the SharePoint file system.
    SitePages_SitePages_ La page du site.The site page.
  3. Choisissez le Terminer bouton pour importer les éléments sélectionnés.Choose the Finish button to import the selected items.

  4. Dans l’Explorateur de solutions, choisissez le _catalogsmasterpage_ nœud et définissez la valeur de son Deployment Conflict Resolution propriété automatique .In Solution Explorer, choose the _catalogsmasterpage_ node, and set the value of its Deployment Conflict Resolution property to Automatic.

    Cela permet de garantir que les conflits de déploiement sont résolus automatiquement.This helps ensure that any deployment conflicts are resolved automatically.

  5. Si votre nouvelle page maître a le même nom qu’une page existante, assurez-vous que la page existante n’est pas marquée comme une Page maître par défaut ou une Page maître personnalisée dans SharePoint Designer.If your new master page has the same name as an existing page, make sure that the existing page is not marked as either a Default Master Page or a Custom Master Page in SharePoint Designer.

    Si une page maître existante est marquée en tant que Page maître par défaut ou Page maître personnalisée, vous obtiendrez une erreur de déploiement qui stipule que la page maître ne peut pas être supprimée.If an existing master page is marked as either Default Master Page or Custom Master Page, you will get a deployment error that states that the master page cannot be deleted. Pour éviter ce problème, procédez comme suit :To avoid this problem, do this:

    • Si la page maître existante est définie en tant que Page maître par défaut, définissez temporairement une autre page maître en tant que Page maître par défaut.If the existing master page is set as Default Master Page, temporarily set another master page as Default Master Page. Après avoir déployé les fichiers sur SharePoint, définissez votre nouvelle page maître en tant que Page maître par défaut.After you deploy the files to SharePoint, set your new master page as Default Master Page.

    • Si la page maître existante est définie en tant que Page maître personnalisée, définissez temporairement une autre page maître en tant que Page maître personnalisée.If the existing master page is set as Custom Master Page, temporarily set another master page as Custom Master Page. Après avoir déployé les fichiers sur SharePoint, définissez votre nouvelle page maître en tant que Page maître personnalisée.After you deploy the files to SharePoint, set your new master page as Custom Master Page.

  6. Dans la barre de menus, choisissez Build > déployer la Solution.On the menu bar, choose Build > Deploy Solution.

  7. Ouvrez le site SharePoint pour afficher les éléments déployés.Open the SharePoint site to view the deployed items.

    Une autre façon d’importer des fichiers dans Visual StudioVisual Studio et les déployer sur SharePoint consiste à ajouter les fichiers dans des modules dans Visual StudioVisual Studio.An alternative way to import files into Visual StudioVisual Studio and deploy them to SharePoint is to add the files into modules in Visual StudioVisual Studio. Pour plus d'informations, voirFor more information, see Comment : importer une page maître ou un thème et utiliser des modules pour inclure des fichiers dans la Solution. How to: Import a master page or theme and Use modules to include files in the Solution.

Voir aussiSee also

Importation d’éléments d’un site SharePoint existant Importing items from an existing SharePoint site
Développer des solutions SharePoint Develop SharePoint solutions
Créer des contrôles réutilisables pour les composants WebPart ou les pages d’applicationCreate reusable controls for web parts or application pages