Der vollständige Webflow + Swarmify-Leitfaden für Video-Hosting
Veröffentlicht: 2020-10-06Benutzt du Webflow? Wenn ja, bietet Ihnen Swarmify genau das, was Sie brauchen, um superschnelle und qualitativ hochwertige Videoerlebnisse zu liefern.
Was sind gute Inhalte? Was ist eine Landingpage? Was ist eine Webseite?
Vorbei sind die Zeiten, in denen das Erstellen von Websites den Webentwicklern von feuerspeienden Drachen vorbehalten war.
Heutzutage können Sie unglaubliche Websites in der Zeit erstellen, die der nächste Mann braucht, um ein Sandwich aufzuessen.
Dank Website-Buildern wie Webflow müssen Sie nichts über Codierung wissen, um im Handumdrehen bemerkenswerte Websites zu erstellen.
Für den heutigen Beitrag habe ich in weniger als 30 Minuten eine Beispiel-Website erstellt ( Sie werden es in einer Minute sehen )! Und ich bin kein professioneller Webentwickler. Nicht einmal in meinen Träumen :)
Tools wie Webflow haben viele der Hürden beseitigt, die technisch nicht versierte Leute wie Sie und mich davon abgehalten haben, Websites zu erstellen.
Jetzt...
Wenn Sie Videos auf Ihrer Webflow-Website verwenden, möchten Sie, dass diese schnell und ohne Verzögerung geladen werden.
Sie möchten Ihren Benutzern nur die besten Seherlebnisse bieten, und nicht weniger.
Langsame Videos, die während der Wiedergabe puffern, werden Ihre Besucher nur verärgern und sie in die Berge und direkt in die wartenden Arme Ihrer Konkurrenten rennen lassen.
Das willst du nicht, weil du schlau bist. Auch, weil Ihnen jetzt die SmartVideo-Technologie von Swarmify zur Verfügung steht.
Mit SmartVideo können Sie Ihren Benutzern vollständig angepasste und professionelle Videoerlebnisse bieten.
Sie können Videos liefern, die 12x schneller sind als der Durchschnitt der Spieler in der Branche. Besser noch, die proprietäre SmartVideo-Bereitstellungslösung reduziert Stall-Outs um das 8-fache.
Und im heutigen Beitrag zeigen wir Ihnen genau, wie Sie Swarmify mit Webflow integrieren können, um Videos für eine bessere Benutzerbindung und mehr Umsatz zu beschleunigen!
Lassen Sie uns kurzerhand den Anker lichten und in See stechen :)
Was ist Webflow?

Also, was ist dieses Tier, das wir Webflow nennen? Für den Uneingeweihten ist Webflow ein amerikanisches Unternehmen mit Sitz in San Francisco.
Sie bieten eine Software as a Service (SaaS)-Plattform für die Erstellung und das Hosting von Websites, alles in einem Paket gebündelt.
Webflow bietet Ihnen einen raffinierten Drag-and-Drop-Website-Builder, der kinderleicht zu bedienen ist. Darüber hinaus bieten sie Ihnen eine Menge Funktionen, die das Erstellen reaktionsschneller Websites so einfach wie Abrakadabra machen.
Wenn Ihre Website fertig ist, müssen Sie für das Webhosting nicht woanders hingehen. Webflow bietet Ihnen erstklassiges Hosting, das perfekt für alle Unternehmen ist, ob groß oder klein.
Namhafte Marken wie Zendesk, Dell, Rakuten und Upwork vertrauen unter anderem auf Webflow, was bedeutet, dass Sie in sicheren Händen sind.
Unter uns, ich habe noch nie zuvor einen so intuitiven Website-Builder verwendet. Webflow bläst Unternehmen wie Weebly, Squarespace und Wix komplett aus dem Wasser.
Und sie trinken auch ihr eigenes Kool-Aid. Die offizielle Website von Webflow wurde erstellt, Sie haben es erraten - Webflow!
Webflow-Hauptfunktionen
Webflow ist beliebt und am bekanntesten für die folgenden Hauptfunktionen.
- Ein intuitiver Drag-and-Drop-Website-Builder, mit dem Sie Websites visuell erstellen können
- Dutzende schöne vorgefertigte Vorlagen, die Sie bis zum Umfallen anpassen können
- Tonnenweise Website-Elemente
- E-Commerce-Funktionalität
- Superschnelles und robustes Amazon S3-Hosting
- Unbegrenzte Stile
- Möglichkeit, benutzerdefinierten HTML-, CSS- und JS-Code hinzuzufügen
- Flexible Preispläne
- Leistungsstarkes Content-Management-System (CMS)
- Viele Integrationen von Drittanbietern
- Kostenloser Plan, um das Wasser zu testen
- Viele Interaktionen und Animationen
- Benutzerdefinierten Domänennamen verbinden
- Verwenden Sie ihre Subdomain, z. B. swarmify.webflow.io , um eine kostenlose Website zu hosten
- Professionelle Unterstützung
Wenn Sie ein Frontend-Webentwickler (oder nur der normale Joe) sind, der nach einem benutzerfreundlichen, aber leistungsstarken Website-Builder sucht, ist Webflow sehr zu empfehlen.
Es ist das perfekte Werkzeug, um Zeit zu sparen und Ihren ohnehin schon anstrengenden Arbeitstag zu optimieren. Wenn Sie bereits Webflow-Benutzer sind, wissen Sie bereits, dass Webflow ein perfekter Website-Builder ist.
Trotzdem bieten sie Ihnen nicht die richtigen Tools zum Optimieren von Videos. Wenn Sie YouTube verwenden, zeigt der Videoplayer auf Ihrer Webflow-Website weiterhin lästiges YouTube-Branding und Links an, die Ihre Benutzer ablenken und Ihren Datenverkehr stehlen.
Und während Webflow schnelles Hosting verwendet, werden die Videos, die Sie von YouTube oder einer anderen Quelle verwenden, zwischengespeichert und brauchen immer noch Zeit zum Laden.
Hier kommt Swarmify ins Spiel. Wir bieten Ihnen genau das, was Sie zum Optimieren von Videos auf Ihrer Webflow-Website benötigen, unabhängig davon, ob Sie YouTube, Vimeo oder eine andere Website zum Hosten Ihrer Videos verwenden.
Was ist Swarmify?

Swarmify wurde bereits 2013 als Videobeschleunigungsplattform eingeführt. Der Dienst läuft auf derselben Infrastruktur, die Streaming-Giganten wie Netflix und Hulu nutzen.
Sie können Ihre Videos speichern, wo immer Sie möchten, und SmartVideo von Swarmify verwenden, um Ihren Benutzern Videos mit blitzschneller Geschwindigkeit bereitzustellen.
Hier ist ein Beispielszenario, um zu veranschaulichen, was ich meine:
- Laden Sie Videos auf YouTube oder Vimeo hoch, um von den sozialen Vorteilen zu profitieren, und betten Sie sie wie gewohnt auf Ihrer Website ein
- Integrieren Sie SmartVideo mit unserem WordPress-Plugin oder Quick Snippet in Ihre Website
- SmartVideo lädt Ihre YouTube/Vimeo-Videos hinter den Kulissen herunter und lädt sie in unser globales Bereitstellungsnetzwerk hoch
- SmartVideo liefert Ihre jetzt schnelleren Videos in einem übersichtlichen Videoplayer, der fantastisch aussieht
- Alles geschieht automatisch im Hintergrund. Tatsächlich konvertiert SmartVideo alle YouTube-Videos auf Ihrer Website automatisch. Einmal installieren und fertig!
SmartVideo verwendet die hauseigene EdgeAI, um ein Abwürgen während der Wiedergabe zu verhindern, und eine SmartCDN-Lösung, die sicherstellt, dass Ihre Besucher überall auf der Welt schnelle und pufferfreie Videos genießen können.
Wenn Sie viele Videos verwenden, können langsame Geschwindigkeiten das Engagement beeinträchtigen und zu weniger Verkäufen führen. SmartVideo hilft Ihnen, dieses Problem ohne riesige Rechnungen und Speicher-/Bandbreitenbeschränkungen zu umgehen.
Hauptmerkmale von Swarmify
Swarmify-Benutzer lieben SmartVideo dank der folgenden Funktionen.
- Sauberer, übersichtlicher und ablenkungsfreier Videoplayer
- Sofortstart - SmartVideo-Videos werden durchschnittlich 12x schneller abgespielt als andere Player (siehe unsere Demo hier)
- Optimiertes Seherlebnis auf mehreren Geräten
- Automatische YouTube/Vimeo-Konvertierungen - Hosten Sie bereits Videos auf YouTube oder Vimeo? SmartVideo konvertiert sie automatisch
- Kontinuierliche Streaming-Optimierung - Während der Wiedergabe überwacht SmartVideo kontinuierlich das Videoerlebnis jedes einzelnen Benutzers und verhindert Ausfälle, bevor sie auftreten.
- Unterbrechungsfreie Wiedergabe - SmartVideo bietet Ihnen 8x weniger Pufferung während der Wiedergabe als andere Player im Durchschnitt.
- Unbegrenzt alles - Genießen Sie unbegrenzte Bandbreite und Speicherplatz
- Professioneller Support, unterstützt von einem Team leidenschaftlicher Entwickler
- Einfache Installation und Implementierung
- Lesen Sie hier mehr über unsere Funktionen
Videos sind ein wichtiger Bestandteil des digitalen Marketings. Sie können die erstaunlichen Vorteile der Verwendung von Videos als Marketingstrategie nicht ignorieren.
Allerdings ist Ihre Videoladegeschwindigkeit ein Teil der Bereitstellung einer besseren Benutzererfahrung auf Ihrer Website.
Um schnelle und verzögerungsfreie Videoerlebnisse auf Ihrer Webflow-Website anzubieten, benötigen Sie eine Lösung wie SmartVideo.
Mit schnellen Videos genießen Sie eine bessere Benutzerbindung, mehr Conversions, niedrigere Absprungraten und mehr Umsatz. Es ist ein Kinderspiel.
Außerdem, wer will schon ein Video sehen, das eine Ewigkeit und eine Reise um die Sonne zum Laden braucht?

Absolut niemand! Nicht mal du.
Lassen Sie uns Swarmify in Ihre Webflow-Website integrieren, um Ihre Videos zu beschleunigen und ein Lächeln auf die Gesichter Ihrer geschätzten Kunden zu zaubern.
Hinweis : Um Swarmify mit Webflow zu integrieren, benötigen Sie ein aktives Swarmify-Konto und einen kostenpflichtigen Plan für Webflow.
Noch am Zaun? Sei nicht . Melden Sie sich noch heute bei Swarmify an und profitieren Sie von unserem exklusiven Rabatt von 50 % . Neugierig? Erfahren Sie hier mehr.
Lassen Sie uns jedoch das Video-Hosting von Swarmify in Ihre Webflow-Website integrieren.
So fügen Sie Swarmify zu Webflow hinzu
„Bevor wir zu Webflow kommen, konfigurieren wir zuerst Ihr SmartVideo-Snippet. Melden Sie sich bei Ihrem Swarmify-Dashboard an und klicken Sie auf Konfiguration , wie unten gezeigt.

Wählen Sie als Nächstes aus, ob Sie YouTube-Videos in Ihrem Webflow haben:

Wenn Sie oben Ja auswählen, stellt SmartVideo sicher, dass alle YouTube-Videos auf Ihrer Webflow-Website automatisch konvertiert werden. Klicken Sie auf die Schaltfläche Weiter .
Wählen Sie auf dem nächsten Bildschirm aus, ob Ihre Webflow-Site Hintergrundvideos enthält:

Möchten Sie die Farben Ihres Videoplayers an Ihre Webflow-Site anpassen? Sie können dies im nächsten Bildschirm tun:

Klicken Sie auf Weiter .
Als nächstes können Sie die Form der Wiedergabetaste ändern, wenn Sie dies wünschen. Ich bevorzuge die standardmäßige sechseckige Schaltfläche, aber Sie haben die Möglichkeit, entweder Rechteck oder Kreis zu wählen:

Wählen Sie als Nächstes ein benutzerdefiniertes Wasserzeichen für Ihre Videos aus:

Darin bist du gut, muss ich zugeben :)
Klicken Sie auf Weiter .
Wählen Sie auf dem nächsten Bildschirm aus, ob Sie Anzeigen in Ihren Videos verkaufen möchten, und klicken Sie auf Fertig stellen :

Klicken Sie schließlich wie unten gezeigt auf In die Zwischenablage kopieren .

Jetzt ist Ihr SmartVideo-Snippet für Ihre Webflow-Website bereit.
Was nun?
Wir werden Swarmify jetzt zu Ihrer Webflow-Website hinzufügen.
Hier ist die Beispiel-Website, mit der ich wie versprochen arbeite:

Ich habe mir das berühmte Jerusalema -Video von Openmic Productions ausgeliehen. Tolles Lied und Video übrigens. Überall auf der Welt machen Menschen die Jerusalema Dance Challenge.
Wie ich wünschte, ich könnte tanzen.
Lassen Sie uns weiter Swarmify zu Ihrer Webflow-Website hinzufügen.
Melden Sie sich bei Webflow an:

Geben Sie die Details ein und klicken Sie auf die Schaltfläche Anmelden :

Klicken Sie als Nächstes auf die Website, auf der Sie SmartVideo hinzufügen möchten:

Jetzt befinden Sie sich in dem intuitiven Website-Builder, über den wir zuvor gesprochen haben:

Aber wir fügen das SmartVideo-Snippet nicht zu einer einzelnen Seite hinzu. Wir möchten, dass das Snippet auf die gesamte Website angewendet wird.
Also, was mache ich, Freddy?
Klicken Sie auf das Webflow-Symbol (W) (wird beim Mouseover zu einem Hamburger-Menü):

Klicken Sie als Nächstes auf Projekteinstellungen :

Danach klicken Sie auf Benutzerdefinierter Code :

Ja.
Fügen Sie als Nächstes das zuvor kopierte SmartVideo-Snippet in den Abschnitt Head Code ein und klicken Sie wie folgt auf Änderungen speichern :

Mit diesem Snippet ist Ihr Webflow mit Swarmify verbunden. Alle YouTube-Videos auf Ihrer Website werden automatisch konvertiert :)
Fertig.
Das Ergebnis?
Dies:

Beachten Sie den neuen Videoplayer ohne Branding von Drittanbietern.
Denken Sie daran: Wenn Sie YouTube verwenden, verwenden Sie die Einbettung anstelle des direkten Links, dh https://www.youtube.com/embed/fCZVL_8D048 im Gegensatz zu https://www.youtube.com/watch?v=fCZVL_8D048 .
Profi-Tipp : Bitte verwenden Sie den Einbettungslink. Stellen Sie sicher, dass Sie den Einbettungslink verwenden, wenn Sie Videos zu Ihrer Webflow-Website hinzufügen.
Videos woanders hosten?
SmartVideo steht hinter Ihnen
Sehen Sie sich die Top 9 der besten Video-Upload-Sites und Cloud-Speicherdienste an.
Hier ist ein teilbarer Link : https://swarmify.com/blog/top-video-upload-sites-cloud-storage-services/.
Hinzufügen von SmartVideo-Tags
Mithilfe eines SmartVideo-Tags können Sie überall auf Ihrer Webflow-Website ein SmartVideo-Video hinzufügen:
<smartvideo src="path/to/my/video.mp4" width="1280" height="720" class="swarm-fluid" controls></smartvideo>Öffnen Sie die Webflow-Seite, die Sie bearbeiten möchten. In unserem Beispiel ersetze ich den Hero-Bereich durch das gleiche Jerusalema -Video, das wir zuvor verwendet haben. Dieses Mal werde ich jedoch stattdessen das obige SmartVideo-Tag verwenden.
So sieht mein fertiges SmartVideo-Tag aus:
<smartvideo src="https://www.youtube.com/embed/fCZVL_8D048" width="1280" height="720" class="swarm-fluid" controls></smartvideo>Beachten Sie, dass ich path/to/my/video.mp4 durch den Einbettungslink für das Video ersetzt habe.
Klicken Sie als Nächstes auf Hinzufügen (+) und wählen Sie Einbetten aus, wie unten gezeigt:

Fügen Sie als Nächstes Ihr SmartVideo-Tag ein und klicken Sie auf Speichern und schließen :

Wenn ich jetzt meine Beispiel-Website im Frontend überprüfe, sehe ich das konvertierte Video:

So einfach wie A, B, C.
Sag Tschüß?
Webflow-Benutzer werden SmartVideo sehr hilfreich finden. SmartVideo beschleunigt Ihre Videos für ein besseres Benutzererlebnis.
Swarmify SmartVideo liefert 12-mal schnellere Videos als der Branchendurchschnitt. Sie werden Ihre Conversions und Verkäufe mit schnelleren Videos steigern.
Erstelle bis zum nächsten Mal mehr Videos und beschleunige sie mit SmartVideo von Swarmify :)

