Die aktuelle Seite in Teams teilen

Wie man Besuchern auf einer Website die einfache Möglichkeit gibt, diese zu teilen.

Es ist ja ganz praktisch, wenn ich einen interessanten Artikel, den ich im Netz gefunden habe, auf einfache Art mit etwa meinen Kollegen teilen kann. Falls seine Website haben und diese Funktionalität für Microsoft Teams anbieten wollen, dann geht dieses zum Glück recht einfach.

Öffnen Sie einfach die folgende Website und scrollen Sie nach unten

https://developer.microsoft.com/en-us/microsoft-teams/share-to-teams

Wählen Sie zunächst den Button-Stil und konfigurieren Sie einige Einstellungen.

buttonstyle

Danach können Sie sich ein "Code-Schnipsel" runterladen, welches Sie einfach an der entsprechenden Stelle ihrer Website platzieren können.

copyCode

Damit wird der Teilen-Knopf dann auf Ihrer Seite eingefügt. Beim Klick darauf wird Teams dann aus den Metadaten ihrer Website automatisch den Titel, ein Bild und die Beschreibung erzeugen.

Das funktioniert soweit einwandfrei.... In den meisten Fällen.

Falls Sie den Teilen-Knopf allerdings dynamisch mittels Javascript einfügen oder wie ich innerhalb einer React-Applikation, dann wird das leider nicht so einfach funktionieren. Glücklicherweise gibt es da aber noch einen anderen Weg.

Das Teilen einer Website in Teams lässt sich nämlich auch dadurch bewerkstelligen, dass der Benutzer eine bestimmte URL von Microsoft aufruft (Das ist das, was das Codeschnipsel im Hintergrund auch tut).

Danach kann der Benutzer dann dort die Seite in Teams teilen.

teilen

Wenn man dann den Aufruf dieser "Teilen" Seite im Javascript noch mittels "window.open" in einem Popup öffnet, dann kommt man in React zu folgender Implementierung.

	  
        <button
          onClick={()=>{
            window.open(`https://teams.microsoft.com/share?href=${articleurl}&referrer=365Knoten.de`,"In Teams teilen","width=800,height=600,status=yes,scrollbars=yes,resizable=yes");
          }}
          <svg .... ></svg>
        </button>
	

Das funktioniert wunderbar. Probieren Sie es doch gleich unten aus.

Hat dir das gefallen? Vielleicht magst du auch...

Kanal-Kalender in MS Teams

Wie füge ich in Teams zu einem Kanal einen Kalender hinzu?

Teams erstellen mit dem PNP Provisioning Schema

So geht es

Stubenhocker HEC Telefontalk - Sven Sieverding zu LowCode und PowerApps