Einen Webflow-Bereich für beliebte Beiträge als Collection List ohne Code erstellen

Update, Oktober 2026: Dies ist ein Workaround aus dem Jahr 2021, und zwei seiner Bausteine gibt es inzwischen nicht mehr. Universal Analytics hat am 1. Juli 2023 die Datenverarbeitung eingestellt, wodurch das unten verwendete Google-Analytics-Add-on für Google Sheets nicht mehr funktioniert, und Webflow hat die v1-API, die wir aus Google Sheets aufrufen, am 31. März 2025 abgekündigt. Der Ansatz bleibt als Dokumentation dessen stehen, wie wir es damals gelöst haben. Um ihn heute nachzubauen, brauchst du GA4 (das in Schritt 3 verwendete API-Connector-Add-on hat einen integrierten Google-Analytics-(GA4)-Connector; prüfe den aktuellen Preis, denn seine OAuth-Connectors haben bisher über die kostenlose Testphase hinaus einen bezahlten Tarif erfordert) und die Webflow-v2-API.

Wir machen uns nichts vor: Das war nicht einfach. Es hat viel Ausprobieren gebraucht, aber am Ende haben wir es geschafft. Es gibt wahrscheinlich deutlich einfachere Wege, indem man direkt die Webflow-API und die Google-Analytics-API abfragt und die Seitenaufrufe dann per Webflow-API zurück nach Webflow schreibt. Wir haben uns aber für Webflow als Plattform entschieden, weil wir keine Programmierer sind, sondern ein Webflow-Studio, und wir wollten No-Code. Versprochen, das ist eine No-Code-Lösung, nur Copy und Paste und ein paar Tabellenkenntnisse. Wir haben schon länger darüber nachgedacht und hatten seit ein paar Monaten eine halbe Lösung, haben dann aber aufgegeben (wir hatten damals im Webflow-Forum darüber geschrieben, aber dieser Thread ist nicht mehr verfügbar). Heute jedenfalls saßen wir da und warteten auf Feedback eines Kunden in Figma und beschlossen, es zum Laufen zu bringen, und seltsamerweise hat es diesmal geklappt. Es läuft erst seit ein paar Stunden, aber wir haben einen neuen Beitrag im Blog veröffentlicht, ihn angeklickt, und etwas später hat Zapier auch für den neuen Beitrag die Seitenaufrufe in Webflow aktualisiert. Also los.

Fangen wir am Anfang an. Wir gehen davon aus, dass du keine Felder in deinem CMS als Pflichtfelder markiert hast, denn sonst musst du sie beim Aktualisieren eines Live-Items über Zapier ausfüllen. Mit dieser Annahme wird alles einfacher. (Falls du doch Pflichtfelder hast, musst du sie in Zapier mit den Daten aus dem Webflow-Beitragsexport befüllen, den wir später anlegen.)

Unsere ursprüngliche Idee war diese: Wenn wir die Seitenaufrufe unserer Blogbeiträge aus Google Analytics in eine Google-Tabelle bekommen, könnten wir die Collection List in Webflow um ein Seitenaufruf-Feld erweitern und die Collection List dann einfach nach diesem Feld sortieren. Es stellte sich als komplizierter heraus, und vorab: Wenn du eine bessere Lösung hast oder auch nur einen der Schritte unten einfacher machen kannst, schreib uns bitte unbedingt einen Kommentar. Wir haben einige Webflow-Expertinnen und -Experten gefragt, und bisher gab es keinen einfachen Weg. Wir wollen das so einfach wie möglich machen. Es lässt sich leicht umsetzen, ist im Moment aber nicht ganz simpel, und als Webflow-Designer versagen wir damit vorerst.

Wie gesagt, unsere Annahme war falsch. Wir brauchten nicht nur die Seitenaufrufe; um einen Beitrag über Zapier zu aktualisieren, brauchten wir drei Dinge:

• Den Beitrag (die ID des Collection-List-Items)
• Den Beitragsnamen (der Name des Collection-List-Items)
• Die Seitenaufrufe des jeweiligen Beitrags aus Google Analytics

Leider gibt es keinen einfachen Weg, Name und ID aus Webflow mit Zapier oder sonst etwas herauszuholen, ohne die API zu benutzen, und darauf wollten wir verzichten. Also haben wir uns eine Lösung ausgedacht, die all das in einer Google-Tabelle erledigt und dann Zapier nutzt, um die Seitenaufrufe nach Webflow zu übertragen.

Beginnen wir mit einer Liste dessen, was du brauchst, und warum:

• Google Analytics: Du brauchst es, um deine Seitenaufrufe zu erfassen, und du musst Google Universal Analytics statt GA4 verwenden, da das Google-Analytics-Add-on für Google Sheets UA und nicht GA4 nutzt (jedenfalls 2021; siehe den Update-Hinweis oben). Hilfe zur Einrichtung von Google Analytics in Webflow findest du in diesem Beitrag zur Installation des Google Tag Managers und danach in diesem Beitrag zum Hinzufügen von Google Analytics mit dem Tag Manager.
• Eine Google-Tabelle, in der du das alles umsetzt. Sie ist kostenlos, melde dich einfach an. Deine Google-Tabelle enthält einen geplanten Import aus Google Analytics, einen geplanten Import deiner Blog-Collection-List aus Webflow und ein paar zusätzliche Tabellenblätter für Berechnungen und Aufräumarbeiten. Du könntest das wahrscheinlich mit deutlich weniger Aufwand machen als wir, aber auch unsere Tabellenkenntnisse sind schwach. Wenn du also etwas vereinfachen kannst, melde dich gern in den Kommentaren.
• Das Google-Analytics-Add-on für Google Sheets (nicht mehr verfügbar, siehe den Update-Hinweis). Wir haben es über den Workspace Marketplace installiert. Damit kannst du die neuesten Seitenaufrufe deiner Blogbeiträge direkt aus Google Analytics in Google Sheets importieren und den Import täglich oder stündlich planen.
• Das Mixed Analytics API Connector Add-on für Google Sheets. Hier bekommst du es. Damit importierst du deine Webflow-Blogbeiträge aus dem CMS ohne Code direkt in Google Sheets. So erhältst du die Collection-List-ID jedes Items und den Item-Namen, die du beim Aktualisieren der Live-Items über Zapier brauchst. Wir haben bezahlt, damit es keine Einschränkungen bei Nutzungsmenge und -häufigkeit gab.
• Zapier prüft die Tabelle auf neue Seitenaufrufe und aktualisiert sofort das Seitenaufruf-Feld in der Collection List deines Webflow-Blogs, sobald neue Seitenaufrufe aus GA importiert wurden. Wir haben dafür bereits ein bezahltes Konto, da wir Zapier für viele andere Dinge nutzen, aber mit einem kostenlosen Konto kommst du wahrscheinlich auch aus.
• Wir hatten unsere Google-Tabelle früher hier geteilt, damit du mitverfolgen konntest, aber sie ist nicht mehr verfügbar, daher sind die Formeln unten die Referenz. (Urteile bitte nicht über unsere Seitenaufrufe, unsere Beiträge über Webflow Analytics und Ähnliches interessieren kaum jemanden.)

Schritt 1: Google Analytics einrichten, falls noch nicht geschehen

Du kannst diesen beiden Beiträgen folgen, um das über den Google Tag Manager zu machen und dann Google Analytics hinzuzufügen. Das ist der Weg, den wir jedes Mal gehen würden, und wir haben die Beiträge speziell für Webflow geschrieben. Wenn du dich damit aber nicht wohlfühlst, richte einfach ein Google-Analytics-Universal-Analytics-Konto (GA3) ein und füge den UA-Code in den Projekteinstellungen deines Webflow-Projekts hinzu. Wenn du das noch nicht eingerichtet hast, warte besser einen Tag, bis Daten eintrudeln, sonst hast du keine Ahnung, was du tust, weil alle Kennzahlen leer sind. (Heute bedeutet das GA4; unser Beitrag über das Hinzufügen von Google Analytics 4 zu Webflow mit Cloudflare Zaraz zeigt eine Möglichkeit dafür.)

Schritt 2: Google-Analytics-Seitenaufrufe in Google Sheets importieren

Erstelle eine Google-Tabelle. In dieser Tabelle machen wir alles, also leg sie ordentlich ab und verlier sie nicht.

Sobald das erledigt ist, füge das Google-Analytics-Add-on hinzu.

• Gehe zu Add-ons, dann Add-ons abrufen, und suche nach Google Analytics.
• Erstelle einen neuen Bericht (Add-ons -> Google Analytics -> Neuen Bericht erstellen).

Du brauchst Folgendes:

• Deine View-ID aus Google Analytics. Das Add-on hilft dir bei der Einrichtung dabei.
• Ein Start- und ein Enddatum, also von wann bis wann der Bericht gelten soll. Wir haben den Jahresbeginn bis heute gewählt (trag einfach gestern im Feld für das Enddatum ein, wenn du den Bericht täglich laufen lässt, oder heute bei stündlicher Ausführung).
• Welche Messwerte du sehen willst. Wir haben Nutzer und Seitenaufrufe gewählt, aber du brauchst nur die Seitenaufrufe.
• Welche Dimensionen du abrufen musst. Wir haben Seitentitel und Seitenpfad gewählt, aber du brauchst nur den Pfad.
• Und wir haben einen Filter hinzugefügt, damit wir nur die Seitenaufrufe unserer Blogbeiträge erhalten. Unsere Collection List heißt einfach posts, das heißt, der Seitenpfad aller unserer Blogbeiträge beginnt mit /post/, also ist unser Filter auf enthält /post/ gesetzt.

Das war es schon. So sollte es in der Tabelle aussehen, wenn du fertig bist:

Teste es nun, indem du den Bericht ausführst: Add-ons -> Google Analytics -> Berichte ausführen.

Du erhältst ein neues Tabellenblatt mit dem Bericht, das etwa so aussieht:

Wenn alles funktioniert hat, kannst du den Bericht jetzt planen. Unserer läuft stündlich, weil das Enddatum auf heute gesetzt ist, aber du kannst ihn auch einfach einmal täglich ausführen lassen, wenn dir das reicht.

Schritt 3: Beiträge aus Webflow importieren

(Hinweis 2026: Die folgenden Anfragen verwenden die Webflow-v1-API, die am 31. März 2025 abgekündigt wurde und keinen Support mehr erhält. Webflow erstellt keine v1-Site-Tokens mehr, daher würdest du heute ein v2-Site-Token und die v2-Endpunkte unter https://api.webflow.com/v2/ verwenden, wie in Webflows Migrationsleitfaden beschrieben. Die Tabellenschritte bleiben gleich.)

Das brauchst du, um die Beitrags-ID und den Titel zu erhalten, die du beim Übertragen der Seitenaufrufe nach Webflow über Zapier benötigst. Installiere den API Connector für Google Sheets. Das geht wie zuvor über Add-ons oder hier.

Folge nun diesen Schritten, um deine Beiträge zu importieren:

• Hole dir deinen Webflow-API-Schlüssel und speichere ihn irgendwo. Öffne das Dashboard deiner Website, dann Einstellungen und gehe zum Bereich Integrationen, danach API-Zugriff.

• Hole dir deine Site-ID. Gehe in Google Sheets zu Add-ons, dann API Connector, dann Öffnen, dann Erstellen oder Neu hinzufügen.
• Der API-URL-Pfad für diesen Schritt lautet: https://api.webflow.com/sites
• Die Wertepaare sind Authorization: Bearer {API_TOKEN_HERE} und Accept-Version: 1.0.0

Es sollte so aussehen:

Gib dem Feld für das Zielblatt einen Namen, dann benenne die Anfrage, speichere sie und führe sie aus. Du erhältst ein neues Tabellenblatt, das die Site-ID enthält. Es sollte so aussehen:

Als Nächstes importierst du alle deine Collections, um die ID deiner Blogbeitrags-Collection-List zu erhalten.

• Gleicher Ablauf wie zuvor, nur mit einer anderen URL für die Anfrage: https://api.webflow.com/sites/:site\\_id/collections
• Kopiere die obige API-URL in die Seitenleiste des API Connectors und ersetze :site\_id durch die passende site\_id aus dem vorherigen Schritt (im neuen Tabellenblatt heißt sie \_id in der ersten Spalte), zusammen mit den Schlüssel-Wert-Paaren als Header, genau wie im vorherigen Schritt.

Das neu erzeugte Tabellenblatt sieht so aus:

Jetzt holen wir das Schema der Collection List.

• Gleicher Ablauf, nur eine andere URL, und du verwendest die ID der neuen Blog-Collection-List. Deine neue API-Anfrage-URL lautet: https://api.webflow.com/collections/:collection\\_id

Die Einrichtung sollte so aussehen:

Und hier ist unser Schema der Blogbeiträge:

Letzter Schritt: Hol dir die eigentlichen Blogbeiträge, und du bist fertig. Wie zuvor ist hier deine neue URL:

https://api.webflow.com/collections/:collection\\_id/items

Und der Screenshot der Einrichtung:

Und das Ergebnis:

Jetzt hast du alle deine Blog-Inhalte in der Google-Tabelle und die beiden Spalten, die du für Zapier brauchst, items.name und item.id. Der schwierige Teil ist geschafft. Jetzt fehlen nur noch Aufräumen, Formatieren und das Übertragen der Seitenaufrufe nach Webflow über Zapier. Wenn alles geklappt hat, plane den letzten Abruf der Blogbeiträge im API-Add-on, damit er sich aktualisiert, wenn du neue Beiträge erstellst.

Ab hier gehe ich nicht mehr in allzu viele Details, denn ehrlich gesagt sind wir schlecht in Tabellen, und es ist nicht die beste Umsetzung. Wenn du die Details brauchst, reichen dir die Formeln unten. Hätte ich Regex beherrscht, wäre vieles einfacher gewesen, aber ich musste den langen Weg nehmen. Ich gebe dir die groben Züge, und du kannst es besser machen als ich.

Rückwärts gedacht willst du am Ende ein Tabellenblatt mit drei Spalten haben: dem Beitragsnamen, der Beitrags-ID und den Seitenaufrufen des Beitrags. Ich habe dafür eine Pivot-Tabelle benutzt, aber vorher musste ich alles bereinigen und die Seitenaufrufe aus Google Analytics mit der ID und dem Namen aus dem API-Beitragsexport abgleichen.

Ich habe ein Tabellenblatt namens Blog Views angelegt und die beiden Datensätze abgeglichen, indem ich den URL-Slug aus dem Webflow-Seitenexport mit einem bereinigten Slug aus dem Seitenpfad des Google-Analytics-Exports verglichen habe.

Im Blatt Blog Views habe ich das Blatt mit den Statistiken aus Google Analytics abgefragt: =QUERY('Milk Moon Studio GA Blog Posts'!A15:D)

Die Slugs für die Google-Analytics-Statistiken habe ich mit einem Array und dem bisschen Regex, das ich kenne, erzeugt, um /post/ zu entfernen: =ArrayFormula(REGEXREPLACE(B2:B,"/post/",""))

Da war allerlei Müll von Werbeanzeigen, die wir zeitweise auf Facebook geschaltet hatten, aber weil ich mit Regex nicht gut bin, habe ich einfach SPLIT benutzt, um den Facebook-Teil ?fbclid zu entfernen: =ArrayFormula(SPLIT(E2:E, "?"))

Dann habe ich mit einem VLOOKUP-Array die Webflow-IDs den Google-Statistiken zugeordnet: =(arrayformula(IFERROR(vlookup(F2:F,Webflow\_blog\_post\_export!G2:Z,16,FALSE))))

Dann noch eines für die Titel: =(arrayformula(IFERROR(vlookup(H2:H,J2:K,2,FALSE))))

Dann noch eines für Items und Namen auf diesem Blatt: =QUERY(Webflow\_blog\_post\_export!V1:V) und =QUERY(Webflow\_blog\_post\_export!F1:F)

Dann die Pivot-Tabelle, um die Seitenaufrufe aller bereinigten Slugs zu summieren und Seitenaufrufe, Name und ID in einem einzigen Pivot-Tabellenblatt zusammenzuführen.

Von da an ist es einfach.

Gehe zu Zapier und richte einen Zap ein, der Änderungen in der Seitenaufruf-Spalte des Pivot-Blatts als Trigger verwendet. Füge dann Webflow hinzu, wähle die Aktion Update Live Item und nutze die Spalten für Seitenaufrufe, ID und Name, um Webflow zu aktualisieren.

Jetzt musst du nur noch warten, bis die Daten in Webflow ankommen, und die Collection List nach Seitenaufrufen sortieren. (Das ist dieselbe Sortierung von Collection Lists, die du auch für unseren Trick für Blog-Zusammenfassungen verwenden würdest, und du kannst sie mit unserem Hack für nahtlose Paginierung kombinieren, wenn die Liste lang wird.)

Wie gesagt: Wenn du Tipps hast, wie sich das einfacher machen lässt, schreib sie bitte in die Kommentare. Wir hoffen sehr, dass es bei dir funktioniert.

Update

Es läuft jetzt seit etwa 12 Stunden, und alles scheint sich zu aktualisieren und zu funktionieren. Eine Sache ist uns aufgefallen: Während dieser Beitrag geschrieben wurde, hat das Speichern als Entwurf eine der Array-Formeln außer Kraft gesetzt, bis er veröffentlicht war, weil sich die Spaltenzahl im Blatt geändert hatte. Wenn du am Anfang keine Entwürfe hast, solltest du also bedenken, dass eine neue Spalte hinzukommt und sich deine Formeln dadurch nach rechts verschieben.

Mehr How-tos findest du im How-to-Bereich des Blogs, oder in unserem Beitrag über das Erstellen von Text-Spans in dynamischen CMS-Textelementen in Webflow.