Goldengates – Headless CMS mit Astro und DatoCMS

Goldengates – Headless CMS mit Astro und DatoCMS

Content-Plattform für Edelmetalle mit DatoCMS, Live Preview, Astro Server Islands und Zoho-CRM-Anbindung. Performance von 78 auf 97, Barrierefreiheit von 82 auf 96.

Verwendete Technologien

Astro DatoCMS GraphQL

Highlights

Live Preview Editing
Astro Server Islands mit Zoho-CRM
Zwei eigene DatoCMS-Plugins
Performance 78 → 97
Sechs Sprachen

Content-Plattform für den Edelmetallvertrieb

Golden Gates Edelmetalle AG vertreibt Edelmetalle, Technologiemetalle und Seltene Erden. Die Plattform richtet sich an Privatkunden und den eigenen Vertrieb – in sechs Sprachen: Deutsch, Englisch, Polnisch, Slowakisch, Litauisch und Ungarisch.

Startseite von goldengates.de

Das Ziel des Relaunches: eine wartungsarme, schnelle Content-Plattform, bei der Redakteure Inhalte eigenständig pflegen und sofort im echten Frontend sehen können.

DatoCMS als Headless CMS

DatoCMS übernimmt die zentrale Inhaltsverwaltung. Texte, Bilder, Videos und strukturierte Produktdaten werden an einem Ort gepflegt – unabhängig davon, ob sie auf der Website, in der Kunden-App oder auf Infobildschirmen ausgegeben werden.

Durch die Trennung von Inhalt und Darstellung entfällt der klassische CMS-Wartungsaufwand fast vollständig. Es gibt keine Plugin-Updates, keine Sicherheitspatches und keinen Server, der überwacht werden muss.

Goldengates Startseite in englischer Sprache

Live Preview Editing

Redakteure sehen jede Änderung direkt im echten Frontend – ohne erst zu publizieren. Die Visual-Editing-Ansicht in DatoCMS zeigt links die Seite und rechts das Bearbeitungsformular. Inhalte lassen sich in allen sechs Sprachen inline bearbeiten.

DatoCMS Live Preview mit Visual Editing für die Goldengates-Startseite

Astro und Server Islands für die Zoho-CRM-Anbindung

Das Frontend ist mit Astro umgesetzt. Astro liefert statisches HTML ohne JavaScript – außer dort, wo es wirklich gebraucht wird.

Für die Anbindung an das Zoho-CRM kommen Server Islands zum Einsatz: Nur die dynamischen Komponenten (Terminbuchung, Kontaktformulare) werden serverseitig gerendert. Der Rest der Seite bleibt vollständig statisch. Das Ergebnis ist eine Seite, die sich anfühlt wie ein statischer Build, aber trotzdem live mit dem CRM kommuniziert.

Core Web Vitals nach dem Launch

Die Lighthouse-Werte haben sich durch den Relaunch deutlich verbessert:

  • Performance: 78 → 97
  • Barrierefreiheit: 82 → 96
  • Verwendung aktueller Webstandards: 79 → 100

Das sind keine Laborwerte auf einer leeren Testseite, sondern Messungen auf der produktiven Startseite mit allen Inhalten, Bildern und Drittanbieter-Integrationen.

Zwei eigene DatoCMS-Plugins

Für eine bessere Bearbeitung im DatoCMS-Projekt wurden noch zwei Plugins für den DatoCMS Marketplace entwickelt. Dank Open-Source können diese Plugins auch in anderen Projekten zum Einsatz kommen und andere Entwickler können sich an der Weiterentwicklung beteiligen.

DatoCMS Backend mit Button Extended Plugin und Live Preview

Button Extended

Ein Plugin für fortgeschrittenes Link- und Button-Management. Redakteure konfigurieren Buttons direkt im CMS – mit Auswahl des Link-Typs (Record, Asset, URL, Telefon, E-Mail), Styling-Varianten, Icons, eigenen Titeln, Aria-Labels, Target-Steuerung und NoFollow-Option. Die strukturierte JSON-Ausgabe lässt sich im Frontend sauber auswerten.

Felder im CMS dynamisch ein- und ausblenden, abhängig von einem Dropdown-Wert. Ein visueller Regel-Editor macht die Konfiguration ohne JSON möglich. Damit bleibt das Bearbeitungsformular für Redakteure übersichtlich – es werden nur die Felder angezeigt, die zum aktuellen Kontext passen.