+++ Achtung: Einbindung funktioniert nur für aktive/laufende Matchplays +++

Diese Version ersetzt die Anleitung Turnierbaum in Webseite einbinden. Wir vermeiden mit der neuen Version die Einbindung eines JavaScriptes und vereinfachen die Nutzung der Funktion damit erheblich.

Wie kann ich den Turnierbaum EINES Matchplays in die Webseite integrieren?

Zunächst einmal muss man festhalten, dass jedes einzelne Matchplay in die Webseite separat eingebunden werden muss. Das macht deshalb Sinn, weil nicht jedes Matchplay die notwendige Teilnehmerzahl hat, um auf den Seiten des Clubs präsent zu sein. Der Organisator hat so die Möglichkeit zu entscheiden, ob und und wo der Baum angezeigt wird. Wichtig: Aktuell kann man EIN MATCHPLAY pro Seite darstellen bzw. man kann nicht zwei Turnierbäume auf einer Seite darstellen. Ein Beispiel für die Einbindung nach zusätzlichen Anpassungen finden Sie HIER!


Was wird dazu benötigt?

Zunächst möchten wir erklären welche Informationen benötigt werden und wo Sie diese finden können

  • Der API Code für das Matchplay (Kann im Adminbereich generiert werden). 
  • Die jeweilige MatchplayID zur Darstellung eines bestimmten Matchplays. Diese finden Sie in der Adresszeile im Browser des jeweilgen Matchplays
  • "Tenant" in der Vorlage ersetzen. Der Tenant ergibt sich aus der persönlichen Adresse https://DeinClub.matchplaytime.com. "DeinClub" wäre hier der Tenant.
  • Das unten stehende Script als Vorlage (wo man den Test Code durch den eigenen API Code ersetzt)
  • Zur individuellen Anpassung an die Webseite noch das CSS File zur Einbindung in die Webseite. Damit können Sie Farben, Schriftgrössen an Ihre Webseite anpassen. Einmal erstellt, funktioniert es wie eine Vorlage.
  • HTML Kenntnisse und für die individuelle Anpassung auch CSS Kenntnisse (Wie Styles eingebunden werden wird hier nicht erklärt weil es einem Webmaster vorbehalten sein sollte). Achtung: Wir können nicht die Einbindung kostenlos mit übernehmen. In der Regel weiss Ihre Webagentur, wie das funktioniert. Wir erstellen Ihnen dazu aber gerne ein Angebot!


Hört sich nach einer Menge Aufwand an? Keine Sorge, nach einmal einbinden mit unseren Vorlagen und Anleitungen eine Sache von wenigen Minuten.



1. Schritt: API Code generieren

Der API Code ist die Grundvoraussetzung zur Einbindung in die Webseite. Ohne diesen Code lässt sich auch keine der ohnehin verfügbaren IDs nutzen. 






2. Schritt: Matchplay ID & Tenant finden

Jedes Matchplay hat in der URL eine ID enthalten. Einfach auf MatchplayTime in das gewünschte Matchplay gehen und in der Adresszeile die ID rauskopieren. Wenn Sie auf auf ein Matchplay in Ihrem Portal klicken, müssten Sie die ID nach ..matchplays/ kopieren. Das ist Ihre Matchplay-ID:



Jetzt noch den Tenant übernehmen und ebenfalls im Formular ersetzen. Der Tenant ist Ihre praktisch die Information, mit der wir Ihre Subdomain anlegen. Oben im Beispiel DeinClub mit Ihrem Namen oder Ihrer Abkürzung ersetzen. Das ist Ihr Tenant. FERTIG!



3. Schritt: API Code und Matchplay ID in die Vorlage kopieren sowie einbinden

Hier beginnt nun die wesentliche Änderung zur vorherigen Lösung. Sie müssen nicht mehr das JavaScript vorher einbinden. Wenn Sie das jedoch schon gemacht haben, wird das auch weiter funktionieren. Sie können jedoch für die Zukunft auf diese einfachere Variante umstellen. 


Bitte beachten Sie die im Beispiel HTML unten die Kommentare die innerhalb von '<!--..-->' stehen. Diese können theoretisch nach der Nutzung gelöscht werden und dienen hier ausschliesslich der Erklärung. 


<!DOCTYPE html>
<html lang="en">
<head>...</head>
<body>
<!-- Positionieren Sie diesen Teil beliebig auf Ihrer Webseite -->
<!-- "Machplay-ID" mit Ihrer ID ersetzen -->
<!-- "apiKey" mit Ihrem Code ersetzen -->
     <mpt-playoff matchplayId="2838570f-029c-........-1bbf1e2a3252" tenant="yoomani"
        apiKey="$2a$10$Fss6Q8xFGXv9/.......qfSc78RiN6pP7Y1lDFgJnFlmW" theme="dark" />
<!-- Ende der Anleitung -->

</body>

<!-- Beginn - An dieser Stelle wird mit dem untenstehenden Script die Funktion aktiviert und aufgerufen -->
<script type="text/javascript" src="https://connect.matchplaytime.com/mpt-plugins.js"></script>
<!-- ENDE -->

</html>

Nachdem man das oben aufgeführte Script mit dem eigenen API Code und Matchplay ID aktualisiert hat, muss man es in die HTML Seite übernehmen und einfügen. 


Wichtig: Um die Funktion generell zu aktivieren muss auf der Webseite nach dem '</body>' Tag das oben sichtbare Script eingefügt werden. Damit ruft man die Funktion generell auf. 


Sie können oben im Text alle Codes kopieren oder sich weiter unten die Vorlage downloaden, um per Copy & Paste plus der jeweiligen Aktualisierungen einfach zu starten. 

HTML


Linkvorschläge: