Promats ist eine Marke, die universelle PVC-Automatten-Serien herstellt. Zur Zielgruppe gehören Händler und Einzelhändler in der Türkei ebenso wie Distributoren im Ausland. Die Website soll die Produktserien verständlich präsentieren, die Stärke der Fertigung zeigen und Besucher mit dem passenden Produkt zu einer Angebotsanfrage führen. promats.com.tr basiert auf derselben Infrastruktur wie Paspas ERP, das System, mit dem das Unternehmen seine Produktion steuert; Webinhalte und eingehende Anfragen werden an einem Ort verwaltet.

Ausgangslage und Anforderungen

Die bisherigen Webinhalte von Promats lagen in einem Standard-CMS. Produktbilder, Produktmerkmale und Seitentexte waren in unterschiedlichen Formaten gespeichert; die Website funktionierte, ließ sich vom Team des Kunden aber nur mühsam pflegen. Zur gleichen Zeit stellte die Marke ihre Positionierung von fahrzeugspezifischen Matten auf universelle Mattenserien um. Dafür mussten Startseite, Produkt- und Produktionsseite auf Basis eines vom Kunden erstellten Inhaltsdokuments auf Türkisch und Englisch neu geschrieben werden.

Der Auftrag umfasste drei Punkte: die vorhandenen Inhalte verlustfrei auf eine moderne Next.js-Website übertragen, Angebotsanfragen direkt an den Vertriebsprozess des Unternehmens anbinden und dem Content-Team ein Panel geben, mit dem es Seiten ohne Entwickler aktualisieren kann.

Lösung und Umfang

Startseite

Die Startseite beginnt mit einem Hero-Slider, in dem jede Folie eine eigene Überschrift, einen eigenen Text und einen eigenen Button hat; Design, Produktion und Robustheit werden nacheinander thematisiert. Darunter folgen ein Karussell der Produktserien, eine Einführung zu den Produkten und der Bereich „Warum Promats“, dessen Badge-Leiste eigens gezeichnete Icons verwendet.

Produkte und Produktdetail

Die Produktseite listet 20 Mattenserien, darunter Orbital, Maximum, Star Plus, Icon, Pars, Professional, Premium, Extra Plus, New Generation und ihre Chrom-Varianten. Jede Serienkarte hebt ihr wichtigstes Merkmal mit Badges hervor, die so platziert sind, dass sie das Bild nicht verdecken. Die Detailseite einer Serie verbindet Bildbereich, Maße und ein Akkordeon in dieser Reihenfolge: Beschreibung, Technische Daten, 5-teiliges Komplettset, Reinigung und Pflege, Vorteile, Material, universelle Passform und FAQ. Ein Block „Informationen anfordern“ am Ende führt zum Anfrageformular.

Produktion, Unternehmen und Inhalte

Die Produktionsseite erläutert mit Überschriften und Galerie den Fertigungsablauf, Produkt- und Materialentwicklung, Werkzeugbau, Qualitätskontrolle und Versand. Die Seite „Über uns“ zeigt Unternehmensidentität, Arbeitsgrundsätze und das ISO-9001:2015-Siegel. Auf der englischen Seite gibt es für internationale Käufer die Seiten OEM Manufacturing und Become a Partner, dazu Ressourcen (technische Fachartikel), Blog, FAQ, Suche sowie Datenschutz-, Cookie- und Nutzungsbedingungsseiten.

Angebot und Kontakt

Das Kontaktformular arbeitet in zwei Modi. Im Angebotsmodus wählen Besucher eine oder mehrere Serien aus, und die Anfrage landet als Anfragedatensatz direkt im Angebotsmodul des ERP; der Vertrieb kann daraus ein Angebot erstellen, ohne sie in ein anderes System zu übertragen. Allgemeine Kontaktnachrichten erzeugen eine Panel-Benachrichtigung und eine Sofortnachricht. Die OEM-Seite hat ein eigenes Kontaktformular. Angebotsabsendungen und erfolgreiche Übermittlungen werden als getrennte Analytics-Ereignisse erfasst.

Admin-Panel

Die Webinhalte werden im Bereich Website des ERP-Panels gepflegt. Nach der ersten Auslieferung haben wir die Felder ermittelt, die das Content-Team in der Praxis nicht bearbeiten konnte, und den Bereich entsprechend neu aufgebaut:

• Formulare für Slider und „Warum Promats“: Überschrift, Text und Button werden in getrennten Feldern erfasst; das von der Website erwartete HTML wird daraus erzeugt, und ein Test bestätigt, dass die Ausgabe byte-genau den bestehenden Datensätzen entspricht.
• Seiteninhalte: feldbasierte Formulare für Produkte, Produktion und Über uns statt rohem JSON, das nur noch im Bereich „Erweitert“ steht.
• Rich-Text-Editor: aus Word eingefügte Inhalte werden von überflüssigen Stilen und Klassen befreit, nur erlaubte Tags bleiben erhalten, unsichere Links werden blockiert.
• Produktformular: rund 30 Inhaltsfelder, SEO-Felder und Veröffentlichungsstatus, dazu ein Reiter „Merkmale“ für die 297 Produktmerkmale (Typ, Text, Bild, Reihenfolge).
• Editoren für Galerie, Menü, statische Texte, Artikel und Theme.
• Badges für Veröffentlichung und Indexierbarkeit: Die Liste zeigt, ob ein Produkt online ist und ob es nach seinem SEO-Wert indexierbar ist.

Nach jedem Speichern im Panel werden die betroffenen Seiten neu erzeugt; Änderungen gehen ohne Deployment live.

Technische Architektur

Die Website ist mit Next.js, React und TypeScript umgesetzt. Die API läuft als eigenes Webmodul im selben Bun- und Fastify-Backend wie das ERP; die Daten liegen in MySQL in eigenen Tabellen für Produkte, Produktmerkmale, Sonderseiten, Seitengalerien, Startseitenbereiche, Menüs, statische Texte, Artikel und Sprachen. Öffentliche Endpunkte sind rein lesend; Admin-Endpunkte erfordern Anmeldung und Administratorrechte.

Türkische und englische Inhalte hängen an einem Sprachdatensatz, die URLs sind je Sprache lokalisiert (zum Beispiel /tr/uretim und /en/production). Die Sitemap erzeugt alle Seiten-, Serien- und Artikel-URLs in beiden Sprachen. Die unterschiedlichen Bildpfad-Formate aus dem alten CMS werden in der API nach einer einzigen Regel vereinheitlicht, abgesichert durch Regressionstests. Inhaltsaktualisierungen wurden nicht von Hand im Panel, sondern über nachvollziehbare Skripte mit vorheriger Sicherung eingespielt.

Integrationen

Der Produktkatalog wird dem Angebotswerkzeug TeklifRota über einen versionierten Produktvertrag bereitgestellt; Seriennamen, Bilder und Beschreibungen fließen von diesem Endpunkt in Angebotsdokumente. Angebotsanfragen sind mit den Angebots- und Kundenmodulen des ERP verbunden, Kontaktnachrichten mit den Panel-Benachrichtigungen.

Ergebnis

promats.com.tr präsentiert heute 20 universelle Mattenserien auf Türkisch und Englisch, zusammen mit der Darstellung von Produktion und Qualität. Zwei Revisionsrunden des Kunden wurden anhand des Inhaltsdokuments und der Screenshots Punkt für Punkt umgesetzt und live geschaltet. Seitentexte, Slider, Produktmerkmale und Galerien werden im Panel gepflegt, und eingehende Angebotsanfragen werden im selben ERP bearbeitet, das auch die Produktion steuert.