Auf dieser Seite
In einem vorherigen Post haben wir dir gezeigt, wie du Videos konvertieren und ihre Dateigröße so ändern kannst, dass du sie einfacher auf deinem Wix Blog oder deiner Webseite verwenden kannst.
Während sich dieser vorherige Artikel auf deine eigenen Videodateien und das Erstellen deiner Webseite bezogen hat, zeigen wir dir in dem aktuellen Post, wie du einen Videorekorder installieren kannst, um Videos von deinen Seitenbesuchern zu erhalten.
Die Screenshots unten sind für Wix, die hier beschriebene Methode funktioniert aber auch, um einen Webcamrekorder auf anderen Plattformen zum Erstellen von Webseiten laufen zu lassen, solange du benutzerdefinierten Code in den Administrator-Einstellungen der Plattform einfügen kannst.
Einen Wix-Videorekorder erstellen und einfügen
Mit dieser Methode können Nutzer entweder mit ihrer Webcam ein Video direkt auf deiner Wix Seite aufnehmen oder du kannst sie Videodateien hochladen lassen, die sie schon auf ihrem Computer haben.
In beiden Fällen können die Videos an deinen YouTube, Dropbox, Google Drive, Amazon S3 oder Microsoft Azure Account gesendet werden. Um die Clips jedoch einfach auf deiner Webseite anzeigen zu können, nachdem Nutzer sie zu dir hochgeladen haben, ist es am sinnvollsten, sie an YouTube zu senden, da du sie von dort aus über den Wix-Editor einbetten kannst.
Um den Wix-Videorekorder einzurichten, benutzen wir unsere HTML5-Video und JavaScript-Webcam-API. Dies ist ein Widget, das du auf einer Webseite einbetten kannst, um Videos von Nutzern und Seitenbesuchern zu sammeln. Man kann es auf jeglichen Webseiten nutzen, für die Verwendung auf einer Wix Seite sind jedoch einige Schritte notwendig, die auf anderen Seiten so nicht durchgeführt werden müssen.
*************As recommended by Wix, the best way to embed a recording and video uploading widget like the Clipchamp API is via backend code, see https://support.wix.com/en/article/accessing-3rd-party-services#backend-service-call.
A developer or software engineer in your team or at your web agency will be able to follow these instructions in combination with the steps described at https://help.clipchamp.com/collect/getting-started/initial-setup-of-the-clipchamp-api.
*************A 2nd method using Custom Code blocks in the frontend of your website is described below. Note that it might not work in some circumstances, if that is the case then the method recommended by Wix through the backend code of your site is the best alternative.**************
1) Logge dich in der Administration deiner Wix Webseite ein
Du wirst später eine neue Seitenvorlage erstellen müssen und etwas HTML-Code in die Einstellungen kopieren.
2) Registriere dich in einem zweiten Browsertab für eine kostenlose Testversion der Clipchamp Video-API
Die Registrierung für einen Testaccount unserer API ist erforderlich, um deinen API-Schlüssel zu erhalten, den du in einem der folgenden Schritte brauchst. Du musst zudem ein Upload-Ziel für Nutzervideos festlegen. Für die Registrierung ist keine Kreditkarte nötig und du kannst die Testversion jederzeit kündigen.
register-clipchamp-trial
3) Lege YouTube als Upload-Ziel fest, um Nutzervideos dort hinzusenden
Nachdem du einen Testaccount eröffnet hast, gehe zu den API-Einstellungen unter https://util.clipchamp.com/de/api-setup/integrations, klicke auf YouTube und verbinde die Clipchamp API mit deinem YouTube Account, sodass Videos, die deine Nutzer einsenden, auf deinen Kanal oder eine gesonderte Playlist hochgeladen werden können.
4) Gehe dann auf https://util.clipchamp.com/de/api-setup/install
Auf dieser Seite werden 2 Codeschnipsel angezeigt, die benötigt werden, um den Button für den Videorekorder in eine Seite einzubetten. Du kannst die Anweisungen ignorieren, die auf der Seite selbst stehen, da sie für Webseiten außerhalb von Wix gelten.
In deinem Fall musst du beide Codeschnipsel kopieren und in den HTML-Editor einer neuen Seite einfügen, die du auf Wix erstellst
5) Erstelle eine neue Seite auf Wix und öffne die „HTML-Einstellungen“
Im HTML-Editor, kopiere den Codeschnipsel aus dem ersten Abschnitt auf der Clipchamp Seite auf Schritt 4 wie folgt:
6) Kopiere dann den Code aus dem zweiten Abschnitt direkt unter den ersten Schnipsel im HTML-Editor
7) Speichere die Seite und schau sie dir in der Vorschau an
Wenn der Code korrekt eingefügt wurde, sollte die Vorschau einen neu eingebetteten Button zur Videoaufnahme anzeigen. Yeah!
8) Letzter Schritt – autorisiere deine Videobutton-Domains
Damit der Rekorder funktioniert, musst du 2 Domains in deinen Clipchamp API-Einstellungen wie folgt freigeben:
Die erste Domain: Kopiere die URL, die Wix benutzt, um den eingebetteten Clipchamp-Button auf deiner Wix Seite anzuzeigen und füge sie zur Liste der autorisierten Domains in deinen Clipchamp API-Einstellungen unter https://util.clipchamp.com/de/api-setup/domains hinzu. Beachte, dass dies nicht die Domain ist, die in der Adressleiste deines Browsers angezeigt wird (wir nehmen an, du benutzt Chrome), sondern die URL des iframe, in dem sich der Video-Button auf deiner Seite befindet.
Du erhältst diesen Domainnamen, indem du den Mauszeiger ein paar Pixel unter den Clipchamp-Button in der Seitenvorschau bewegst und dann per Rechtsklick „Quelltext anzeigen“ wählst. In Chrome öffnet dies einen neuen Browsertab. Gehe zur Adressleiste des Tabs und kopiere den Domainnamen von dort. In unserem Beispiel sieht die Domain so aus
Die zweite Domain: Dieser Domainname folgt der Namenskonvention yourwebsitename-wixsite-com.fileusr.com, so bspw. moestavern-wixsite-com.fileusr.com. Passe sie an den Namen deiner Webseite an und füge sie zur Liste deiner Clipchamp-Domains hinzu, dann kannst du deine Wix Testseite mit dem eingebetteten Button zur Aufnahme darauf veröffentlichen, um zu überprüfen, ob er korrekt angezeigt wird.
Du kannst den Namen der zweiten Domain auch finden, indem du dir den Quellcode deiner Wix Seite anschaust
Nachdem du diese 2 Domainnamen in deinen Clipchamp API-Einstellungen gespeichert hast, kann der Button des Videorekorders und Hochlade-Widgets auf deiner Wix Seite genutzt werden, sodass deine Besucher Aufnahmen und andere Videos an deinen YouTube-Kanal senden können.
Eingesendete Videos auf deiner Seite anzeigen
Wenn du Videos benutzen möchtest, die in deinen YouTube-Kanal hochgeladen wurden, um sie auf deiner Webseite anzuzeigen, schaue dir bitte die folgenden Anweisungen der Wix-Hilfe an.
Dies sind alle notwendigen Schritte, um Videos von deinen Seitenbesuchern zu sammeln, wenn du Wix benutzt. Wir haben diese auch in einem kurzen Hilfsartikel über das Thema zusammengefasst.
Wenn du keine Plattform zur Erstellung von Webseiten benutzt, schaue dir bitte dieses separate Tutorial für die Installationsanweisungen an, um die HTML-Video-API auf jeglicher Webseite einzubetten.
Die API kann für viele unterschiedliche Anwendungen verwendet werden, zum Beispiel um Videoreferenzen von Kunden zu erhalten, wenn du einen Onlineshop betreibst oder Videokommentare von den Lesern auf deinem Blog zu bekommen.
Eine letzte Anmerkung – unser Videorekorder-Widget beinhaltet eine breite Palette an Optionen, du kannst zum Beispiel das Branding ändern, die Farben und andere Stilelemente sowie eine Reihe an Einstellungen anpassen, die Einfluss auf die Videoeingabe und -ausgabe haben.
Da dies Optionen für Experten sind, haben wir diese nicht in diesem Post abgedeckt, du kannst aber gerne einen Blick auf die API-Dokumentation werfen und entscheiden, welche der Parameter du zu deinem Wix-Videorekorder hinzufügen möchtest. Kopiere dazu einfach jegliche Optionen in deinen Codeschnipsel ein, den du in den HTML-Editor in Schritt 6 eingefügt hast.
