Hinzufügen einer Microsoft Teams-Registerkarte zu SharePoint

Sie können eine vielfältig nutzbare Integration zwischen Microsoft Teams und Sharepoint erhalten, indem Sie eine Microsoft Teams-Registerkarte in SharePoint als SPFx-Webpart hinzufügen. In diesem Dokument erfahren Sie, wie Sie eine Registerkarte aus einer Microsoft Teams-Beispiel-App in SharePoint verwenden.

Umfassende Integration zwischen Microsoft Teams und SharePoint

Mit der November-Version von Microsoft Teams und SharePoint-Framework Version 1.7 verfügen Entwickler über zwei leistungsstarke Funktionen:

Microsoft Teams-Registerkarten in SharePoint

Ab SharePoint-Framework Version 1.7 können Sie Ihre Microsoft Teams-Registerkarten in SharePoint hosten. Registerkarten, die in SharePoint gehostet werden, weisen eine ähnliche ganzseitige Darstellung auf, in der alle Features von Microsoft Teams-Registerkarten verfügbar sein werden, während der Kontext und die Vertrautheit einer SharePoint-Site erhalten bleiben.

Erstellen Sie umfangreiche App-Funktionen in SharePoint, indem Sie Ihre Teams-App in SharePoint integrieren.

Screenshot: Registerkarte in der SharePoint-Ansicht

SharePoint-Framework in Microsoft Teams

Sie können Ihre Teams-Registerkarten auch mithilfe von SharePoint-Framework implementieren. SharePoint-Framework-Webparts werden automatisch innerhalb von SharePoint gehostet, ohne dass externe Dienste wie Azure nötig sind. SharePoint-Entwicklern vereinfacht dies den Entwicklungsprozess für Microsoft Teams-Registerkarten erheblich. Weitere Informationen zu SharePoint-Framework in Microsoft Teams finden Sie unter Verwenden des SharePoint-Frameworks in Microsoft Teams.

Integrieren Sie Ihre SharePoint-Webparts in Microsoft Teams und überlassen Sie SharePoint die Hostingverwaltung.

Screenshot: Webpart, das als Registerkarte verfügbar gemacht wird

Einführung

Die hier verwendete Registerkarte wird bereits in Azure gehostet, um sich auf die erforderlichen Integrationsarbeiten zu konzentrieren.

Die verwendete Beispiel-App ist eine Talentmanagement-Anwendung. Sie wird für die Verwaltung des Einstellungsprozesses von Bewerbern für offene Positionen in einem Team verwendet. Erstellen Sie eine Microsoft Teams-Beispiel-App, und laden Sie sie in Microsoft Teams. Erstellen Sie keine echte Talentverwaltungsanwendung.

Vorteile dieses Ansatzes

  • Erreichen Sie mit Ihrer bestehenden Microsoft Teams-Registerkarte SharePoint-Benutzer.
  • Laden Sie Ihr App-Manifest direkt in den SharePoint-App-Katalog hoch. Microsoft Teams-Anwendungspakete werden jetzt von SharePoint unterstützt.
  • Die Benutzer konfigurieren die Registerkarte auf einer Seite wie jedes andere SharePoint-Webparts.
  • Ihre Registerkarte kann auf ihren Kontext genauso wie innerhalb Microsoft Teams zugreifen.

Um eine Microsoft Teams-Registerkarte in SharePoint hinzuzufügen, führen Sie die folgenden Schritte aus:

Testen der Beispiel-App

Laden Sie das Beispiel-App-Manifest herunter.

  1. Öffnen Sie Microsoft Teams.

  2. Wählen Sie Apps>Apps verwalten>Apps verwalten aus.

  3. Wählen Sie Benutzerdefinierte App hochladen aus.

    Screenshot: Option zum Hochladen einer benutzerdefinierten App in Teams

  4. Die hochzuladende Datei befindet sich im Ordner Downloads. Es heißt TalentMgmt-Azure.zip. In der folgenden Abbildung wird der entsprechende Bildschirm angezeigt:

    Screenshot: Ordner

  5. Sie können den Installations- oder Zustimmungsbildschirm für die Talentmanagement-App sehen. Wählen Sie das Team aus, das Sie installieren möchten.

  6. Klicken Sie auf Installieren, und beginnen Sie mit dem Experimentieren mit der App.

Hinweis

Die SharePoint-Erweiterungsbefehle werden auf der Registerkarte Teams-Dateien nicht unterstützt. Sie können eine SharePoint-Seite, -Liste oder -Dokumentbibliothek als Registerkarte in Teams hinzufügen.

Verwenden der Registerkarte "Teams" in SharePoint

  1. Laden Sie Ihr Microsoft Teams-App-Paket in Ihren SharePoint-App-Katalog hoch, und stellen Sie es bereit, indem Sie https://YOUR_TENANT_NAME.sharepoint.com/sites/apps/AppCatalog/Forms/AllItems.aspxbesuchen. Beispiel: https://contoso.sharepoint.com/sites/apps/AppCatalog/Forms/AllItems.aspx.

  2. Wenn Sie dazu aufgefordert werden, aktivieren Sie die Option Diese Lösung allen Sites in Ihrer Organisation zur Verfügung stellen. In der folgenden Abbildung wird der entsprechende Bildschirm angezeigt:

    Screenshot: Dialogfeld

  3. Erstellen Sie auf Ihrer Website eine neue Seite, indem Sie oben rechts die Zahnradschaltfläche und dann Seite hinzufügen auswählen. In der folgenden Abbildung wird der entsprechende Bildschirm angezeigt:

    Screenshot: Optionen für Office 365 Einstellungen

  4. Sie können die Erstellungsumgebung für SharePoint-Seiten sehen. Benennen Sie Ihre Seite als Meine Microsoft Teams-Registerkarte.

  5. Öffnen Sie die Webpart-Toolbox durch Anklicken der +-Schaltfläche, und wählen Sie Ihre Microsoft Teams-Registerkarte namens Contoso HR aus. Webparts werden alphabetisch sortiert. Wenn es sich um eine lange Liste handelt, können Sie die Suchleiste verwenden, um sie zu finden. Dadurch wird ein Webpart im Canvas erstellt, das Ihre Microsoft Teams-Registerkarte enthält. In der folgenden Abbildung ist die Registerkartenansicht zu sehen:

    Screenshot: Registerkartenansicht

  6. Wählen Sie die Schaltfläche Veröffentlichen aus, nachdem Sie die Bearbeitung abgeschlossen haben.

  7. Wählen Sie Seite zu Navigation hinzufügen aus, um in der linken Navigationsleiste einen Schnellverweis auf Ihre Seite zu erhalten. Die folgende Abbildung zeigt die Registerkarte in SharePoint:

    Screenshot: Registerkarte in SharePoint

Erkunden von App-Seiten in SharePoint

Nachdem Ihre Seite veröffentlicht wurde, können Sie erkunden, wie Sie Ihre Microsoft Teams-App in eine umfassendere Lösung innerhalb SharePoint verwandeln. Dadurch wird die aktuelle Seite in eine App-Seite konvertiert, die das normale SharePoint-Seitenlayout mit ganzseitiger Darstellung der Microsoft Teams-Registerkarte aufweist.

Die folgende Abbildung zeigt die vollständige Benutzeroberfläche der Teams-App in SharePoint:

Screenshot: Teams-App in SharePoint

Codebeispiel

Beispielname Beschreibung SPFx
SPFx-Webpart SPFx-Webpartbeispiele für Registerkarten, Kanäle und Gruppen Anzeigen

Siehe auch