Großen Blog zu Webflow umziehen – Tipps & Hacks

Blog mit mehr also 150 Beiträgen zu Webflow migrieren

In diesem Beitrag zeige ich dir, wie du einen bestehenden Blog effektiv zu Webflow migrieren kannst. Dafür erstellen wir eine eigene CSV Datei mit allen Bloginhalten, die wir anschließend in Webflow hochladen können.

Falls du ein Plugin in deinem alten CMS findest, welches dir deine Blogbeiträge in eine CSV Datei exportiert, verwende dieses auf jeden Fall! Damit sparst du dir viel Zeit und Frust! Diese Anleitung ist für alle diejenigen, die kein Plugin bzw. Erweiterung finden können.

Der mit Abstand aufwändigste Weg wären alle Beiträge einzeln in das CMS zu überführen. Damit du das nicht machen musst, zeige ich dir heute ein paar Einblicke in meinen Prozess, der dir hoffentlich einiges an Arbeit abnimmt.

Ich habe dir alles nochmal ausführlich in den Videos zusammengefasst. Die Textinhalte in diesem Artikel sind eher als Stichpunkte zu verstehen.

Eine Webflow CSV Datei für den Blog-Import erstellen

Wenn du nicht mittels Plugin die Möglichkeit hast, Bloginhalte in eine CSV Datei zu exportieren, musst du diese CSV Datei selber erstellen.

Viele Informationen kannst du aus deiner MySql Datenbank exportieren (siehe Video).

Ich habe teilweise auch Informationen wie den Titel, das Veröffentlichungsdatum oder die Teaser-Beschreibung aus meinem RSS-Feed des Blogs gezogen.

RSS Feed in CSV Datei konvertieren: scooterlabs.com/hacks/rss2csv.php (liefert dir Titel, Datum und Zusammenfassung des Beitrags)

Die absoluten Links zu den Teaser Bildern werden leider nicht mit exportiert. Darum kümmern wir uns im nächsten Schritt.

Den absoluten Pfad zu allen Blog Teaser-Bildern bekommen

Um nur die Pfade zu den Bildern zu bekommen, habe ich den kompletten RSS-Feed Code kopiert und in eine Tabelle (bei mir Numbers) eingefügt.

1. Kompletten RSS-Feed Code kopieren und in eine Tabelle einfügen
2. Tabelle filtern nach <enclosure → alles kopieren
3. Auf https://www.convertcsv.com/url-extractor.htm einfügen um nur noch die URLs kopieren zu können

SEO Meta Beschreibungen importieren

In deiner MySQL Datenbank zum Blogbereich navigieren und die Tabelle ggf. filtern, so dass nur deine veröffentlichten Beiträge oder nur Beiträge einer bestimmten Kategorie angezeigt werden. CSV Datei aus der mysql Datenbank exportieren.

Sobald ich die Datei direkt in Numbers geöffnet habe, gab es ein Codierungsfehler bei Umlauten. Deshalb habe ich die CSV Datei erst auf https://www.convertcsv.com/csv-viewer-editor.htm hochgeladen und dann wieder mit utf-8 Encoding runtergeladen. Anschließend in Numbers geöffnet und nach Veröffentlichungsdatum der Beiträge sortiert und die Meta-Description Spalte kopiert (wird alles genauer im Video erklärt).

Leere Zeilen in Numbers suchen und löschen

Beim Kopieren von einer in eine andere Tabelle kommt es manchmal vor, dass eine Leerzeile bzw. der Text erst in der zweiten Zeile anfängt. Ich weiß nicht warum, aber du kannst in einer Tabelle einfach nach \n suche und alles mit nichts (nichts eintrage) ersetzen.

Reihenfolge der zu importierenden Beiträge umkehren

Falls du die Reihen in der CSV Datei umkehren möchtest, damit die Beiträge auch von alt nach neu in Webflow angelegt werden, musst du in der Tabelle eine weitere Spalte mit Zahlen (1,2,3,4...) davor setzen und die ganze Tabelle danach sortieren (von groß nach klein).

In Webflow eine Blog-CMS Kollektion anlegen

In diesem Video legen wir zusammen eine CMS Kollektion für den neuen Blog an, um anschließend alle Blogbeiträge über eine CSV Datei in Webflow zu importieren.

Anschließend rufen wir die Datein auf einer BLog-Übersichtsseite ab und ich zeige dir, wie du einzelne Bloginhalte inklusive Text-Formatierungen oder Bilder einfach in ein Webflow Rich-Text Element reinkopieren kannst.

301 Redirects in Webflow importieren

Während du eine CSV Datei für den Import erstellst, kann es vorkommen, dass du auch die Titel von einigen Blogbeiträgen ändern willst. Dadurch ändert sich eventuell auch der Slug (Alias) des Beitrags. Dadurch werden diese Beiträge nicht mehr unter dem alten Link erreichbar sein und es wird auch für Suchmaschinen eine 404-Fehlerseite ausgegeben. Deshalb ist es wichtig, das du für diese geänderten Beiträge ein 301 Redirect in den Webflow Projekteinstellungen anlegst.

Damit du nicht alle 301 Redirects einzeln anlegen musst, zeige ich dir in diesem Video, wie du diese über einen Trick in der Browser-Console in Webflow importieren kannst.

Eine bestehende Struktur mit allen Unterseiten einer Website auslesen

Das kann hilfreich sein um zu sehen, welche 303 Redirects du eventuell noch zusätzlich in deinem Webflow Projekt anlegen musst. Folgende Tool kannst du dafür nutzen: https://www.xml-sitemaps.com

‍