Procédure pas à pas : ajout d’un bouton au Ruban serveur

Article
09/24/2014

Dernière modification : lundi 7 février 2011

S’applique à : SharePoint Foundation 2010

Dans cet article
Création d’un projet SharePoint
Ajout d’une nouvelle fonctionnalité
Définition de l’action personnalisée
Déploiement de la personnalisation

Cette rubrique indique comment ajouter un nouveau bouton au Ruban serveur dans Microsoft SharePoint Foundation.

Conditions requises

Microsoft SharePoint Foundation 2010

Outils de développement SharePoint dans Microsoft Visual Studio 2010

Création d’un projet SharePoint

Pour ajouter un nouveau bouton, vous commencez par créer un projet SharePoint vide.

Pour créer un projet SharePoint

Démarrez Microsoft Visual Studio 2010.
Dans le menu Fichier, pointez sur Nouveau, puis cliquez sur Projet.
Dans Types de projets, sous Visual Basic ou C#, sélectionnez Projet SharePoint vide.
Tapez AjouterUnBoutonAuRuban comme nom de projet. Cliquez sur OK.
Dans l’Assistant Personnalisation de SharePoint, sélectionnez Déployer en tant que solution bac à sable (sandbox), puis cliquez sur Terminer.

Ajout d’une nouvelle fonctionnalité

Vous personnalisez le Ruban à l’aide d’une fonctionnalité. Les étapes suivantes permettent d’ajouter une nouvelle fonctionnalité à votre solution.

Pour ajouter un nouveau Composant fonctionnel

Dans l’Explorateur de solutions, cliquez avec le bouton droit sur Fonctionnalités, puis cliquez sur Ajouter une fonctionnalité.
Affectez au Composant fonctionnel le titreBouton de Ruban personnalisé.
Dans l’Explorateur de solutions, cliquez avec le bouton droit sur Fonctionnalité1, puis cliquez sur Renommer. Tapez BoutonRubanPersonnalisé en tant que nouveau nom.
Dans l’Explorateur de solutions, cliquez avec le bouton droit sur le projet BoutonRubanPersonnalisé, pointez sur Ajouter, puis sélectionnez Nouvel élément.
Dans la boîte de dialogue Ajouter un nouvel élément, sélectionnez le modèle Élément vide. Tapez BoutonRubanPersonnalisé en tant que nom.

Définition de l’action personnalisée

Vous définissez le bouton de Ruban à l’aide du code XML du Ruban dans une action personnalisée. Pour une explication détaillée du code XML du Ruban, voir XML du Ruban serveur.

Pour définir l’action personnalisée

Ouvrez le fichier Elements.xml.

Collez le code XML suivant dans le fichier Elements.xml. Ce code XML ajoute un nouveau bouton à l’onglet Bibliothèque du groupe Partage et suivi pour une bibliothèque de documents.

Important

Vous devez remplacer les attributs Image32by32 et Image16by16 par des URL d’image valides.

<?xml version="1.0" encoding="utf-8"?>
<Elements xmlns="https://schemas.microsoft.com/sharepoint/">
  <CustomAction 
    Id="Ribbon.Library.Actions.AddAButton"
    Location="CommandUI.Ribbon"
    RegistrationId="101"
    RegistrationType="List"
    Title="Add a Ribbon Button">
    <CommandUIExtension>
      <CommandUIDefinitions>
        <CommandUIDefinition
          Location="Ribbon.Library.Share.Controls._children">
          <Button Id="Ribbon.Library.Share.NewRibbonButton"
            Command="NewRibbonButtonCommand"
            Image16by16="Insert an image URL here."
            Image32by32="Insert an image URL here."
            LabelText="Hello World"
            TemplateAlias="o2" />
        </CommandUIDefinition>
      </CommandUIDefinitions>
      <CommandUIHandlers>
        <CommandUIHandler 
          Command="NewRibbonButtonCommand"
          CommandAction="javascript:alert('Hello, world');" />
      </CommandUIHandlers>
    </CommandUIExtension>
  </CustomAction>
</Elements>

Déploiement de la personnalisation

Dans la mesure où le projet a été configuré en tant que solution en bac à sable (sandbox), il est déployé dans la galerie de solutions.

Pour déployer la personnalisation

Appuyez sur la touche F5. Les Outils de développement SharePoint dans Visual Studio 2010 génèrent et déploient automatiquement le Composant fonctionnel.
Accédez à une bibliothèque de documents dans votre site ou sous-site.
Cliquez sur l’onglet Bibliothèque ; dans le groupe Partage et suivi, cliquez sur le bouton Hello World.

Partager via