Webflow Editor – Wie Kunden Ihre Website selbst pflegen können

Webflow Editor – Wie Kunden Ihre Website selbst pflegen können

Mit dem Webflow Editor können Kunden ihre eigene Website selbständig pflegen und neue Inhalte  einfügen. Dank des visuellen On-Page-Editors können diese Änderungen direkt umgesetzt werden.

Welche Vorteile bietet der Webflow Editor?

Nach der Veröffentlichung einer neuen Website möchten Kunden gerne Inhalte wie Text oder Bilder selbst pflegen und austauschen können. Gerade wenn es sich um kleinere Änderungen handelt, ist der Aufwand oft sehr groß, um dafür extra Agenturen oder Entwickler zu engagieren. Dadurch entstehen Kosten- und Zeitaufwände. Webflow biete hier die perfekte Lösung.

Mit Hilfe des visuellen Editors können Kunden solche Änderungen bequem auf der jeweiligen Seite vornehmen und sich das Ergebnis in der Vorschau anzeigen lassen. Wenn sie mit dem Ergebnis zufrieden sind, können die neuen Inhalte mit einem Klick veröffentlicht werden.

Wie funktioniert der Webflow Editor?

Damit Kunden Zugang zum Editor bekommen, müssen sie eingeladen werden. In den Einstellungen des Webflow Projekts gibt es einen Reiter mit „Editor“. Dort kannst du einfach die E-Mail Adresse des jeweiligen Kunden eingeben und diese erhalten eine Einladung per E-Mail. Das funktioniert aber nur, wenn die Seite mit einem CMS- oder Business-Siteplan verbunden ist. Ausführliche Informationen zu den Preisplänen findest du in meinem Artikel „Webflow Preispläne einfach erklärt“ 

Der Bearbeitungsmodus ist ganz einfach zu erreichen, indem du am Ende deiner URL ein „/?edit“ ergänzt. Danach öffnet sich am unteren Ende des Browsers ein Login-Feld. Nun muss man nur noch die entsprechenden Login-Daten ausfüllen und kann sich einloggen.

Welche Elemente können mit dem Webflow Editor bearbeitet werden?

Der Editor an sich ist sehr einfach und intuitiv zu bedienen. Bei Mouse-Over über die verschiedenen Inhaltselemente erscheint ein Rahmen mit Icon am rechten Rand. Bei Klick auf das Icon können Kunde das entsprechende Element bearbeiten.

‍

Texte und Rich-Text-Elemente

Textstellen mit dem Webflow Editor zu bearbeiten ist fast selbsterklärend. Sobald der Kunde mit dem Mauszeiger über ein Textfeld fährt, kann er auf das „Bearbeiten-Icon“ klicken und den Text bearbeiten. Ebenso kann der Text kursiv & fett formatiert oder eine Verlinkung eingefügt werden. Überschrift Hierarchien wie H1–H6 lassen sich auch anpassen.

Rich-Text-Elemente funktionieren ähnlich wie Textstellen und werden häufig für längere Textabschnitte eingesetzt. Bei diesen Elementen hat der Kunde zusätzliche Möglichkeiten zur Inhaltsbearbeitung. Folgende Elemente lassen sich, neben Text, in ein Rich-Text-Element einfügen:

• Bilder
• Videos
• Google Maps
• Bulletpoint Liste
• Nummerierte Liste
  

‍

Bilder

Bilder lassen sich Dank des Editors ähnlich leicht austauschen wie Textinhalte. Mit Klick auf das Icon an der rechten oberen Ecke eines Bildes öffnet sich ein typisches Upload-Fenster, mit dem neue Bilder hochgeladen werden können. Wenn bei Bildern visuelle Effekte hinterlegt sind, wie zum Beispiel ein Schlagschatten, wird dieser auch bei dem neuen Bild übernommen.

‍

Buttons

Bei Mausover über Buttons erscheint am oberen Rand ein Zahnrad Icon. Hier können Kunden entscheiden, ob sie den Text des Buttons bearbeiten wollen oder das Ziel der Verlinkung. Bei den Verlinkungen gibt es folgende Optionen:

• Externer Link (Verlinkung zu einer anderen Website) 
• Interne Seite (Verlinkung zu einer anderen Seiten des Webflow Projekts)
• Section (Verlinkung zu einem bestimmten Seitenabschnitt)
• E-Mail (Verlinkung zu einer E-Mail. Auf Klick öffnet sich automatisch ein Mailprogramm)
• Telefon (Verlinkung zu einer Telefonnummer. Auf mobilen Geräten wird die Nummer direkt angewählt)

‍

SEO Einstellungen & Beschreibungen

Kunden können auch wichtige Einstellungen zu den SEO-Meta-Titel und -Beschreibungen vornehmen. Dadurch vergrößern sich sich die Chancen auch von Suchmaschinen wie Google, Bing usw. gefunden zu werden. Um zu den Einstellungen zu gelangen, muss man bei dem unteren Tab auf den Reiter „Pages“ klicken. 

Hier erhält man eine Übersicht der angelegten Seiten des Webflow Projekts. Über ein Suchfeld in der oberen rechten Ecke, kann man auch nach der gewünschten Seite suchen. Bei Klick auf die jeweilige Seite öffnen sich die Einstellungsmöglichkeiten für SEO-Beschreibungstexte und Open Graph Einstellungen. Nach Eingabe der Texte klickt man auf den grünen „Speichern“ Button.

‍

Open Graph Einstellungen

Die Open Graph Einstellungen sind sehr ähnlich zu den SEO-Einstellungen, nur dass sie für soziale Netzwerke wie Facebook, Twitter oder LinkedIn verwendet werden. In den meisten Fällen reicht es einfach, das Kontrollkästchen anzukreuzen, um dieselben Inhalte wie die SEO Einstellungen zu übernehmen. Bei Bedarf können sie aber auch angepasst werden.

‍

CMS-Elemente & Blogartikel

Wenn in einem Weblfow Projekt dynamische CMS-Elemente wie zum Beispiel Blogartikel angelegt sind, können Kunden diese auch bearbeiten oder neue Inhalte anlegen. Hierzu klickt man auf den „Collection“ Tab (allgemeine CMS-Collections) oder den Blog Post“ Tab.

Bei Klick auf „Blog Posts“ öffnet sich genauso wie bei der Seitenübersicht eine Übersicht aller angelegten Blogartikel. Um einen Artikel bearbeiten zu können, muss der Kunde einfach den jeweiligen Blogartikel auswählen, um in die Detailansicht zu gelangen.

‍

Veröffentlichung neuer Inhalte oder Änderungen

Wenn dein Kunde mit den Änderungen zufrieden ist, können diese einfach über den „Publish“ Button am oberen rechten Rand live gestellt werden.

‍

Der Webflow Editor ist gut geeignet, um Kunden die Möglichkeit zu geben, bestehende Inhalte anzupassen bzw. zu aktualisieren. Wenn ein entsprechendes CMS angelegt ist, können auch Blogartikel oder CMS-Collections hinzugefügt werden. Ein Nachteil des Editors ist, dass Kunden keine neuen Unterseiten zur Website hinzufügen können.