Hier beginnen

Erste Schritte

Vielen Dank für den Kauf der Coin X-Vorlage. In dieser kurzen Anleitung decken wir alle Grundlagen ab, wie man grundlegende Elemente (d.h. Farben, Schriftarten, CMS-Inhalte, etc.) der Coin X Webflow-Vorlage bearbeitet.

Wenn Sie mit Webflow noch nicht sehr vertraut sind, empfehlen wir Ihnen den Webflow 101 Crash Course der Webflow University, in dem Sie alle Grundlagen erlernen, um sofort loslegen zu können.

Styling

Beginnen wir mit dem Styling der Vorlage.

Farben

Die Coin X-Vorlage ist mit Farbfeldern aufgebaut, d. h. Sie können ein Farbfeld leicht bearbeiten, um es auf der gesamten Website zu aktualisieren.

Um dies zu tun, müssen Sie nur auf die Registerkarte "Stil" in der rechten Seitenleiste gehen, dann scrollen Sie zu "Farben" im Abschnitt "Typografie", und wenn Sie auf die Farbe klicken, können Sie alle Farbfelder sehen und sie so bearbeiten, dass sie auf der gesamten Website in jeder gewünschten Farbe aktualisiert werden.

Schriftarten

Die Coin X-Vorlage verwendet eine einzige Schriftart für die gesamte Seite, die im Selektor Body (Alle Seiten) eingestellt ist, sodass Sie die Schriftart auf der gesamten Website mit einem Klick aktualisieren können.

Klicken Sie auf einer beliebigen Seite einfach auf die orangefarbene Auswahloption oben rechts auf der Registerkarte Stil und wählen Sie dann Körper (Alle Seiten). Danach können Sie zum Abschnitt Typografie gehen und die Schriftart in eine beliebige Schriftart für Ihre Unternehmensmarke ändern.

Falls Sie eine benutzerdefinierte oder hochwertige Schriftart benötigen, die nicht in Webflow verfügbar ist, können Sie jederzeit zu Projekteinstellungen > Schriftarten gehen und benutzerdefinierte Schriftarten hochladen oder Ihr Adobe Fonts-Konto verbinden.

Grafiken und Icons

Bei einigen Symbolen oder Grafiken in der Vorlage handelt es sich um normale Bilder/Grafiken, so dass diese beim Aktualisieren aller Farben weiterhin die Farbe der Vorlage haben.

Das liegt daran, dass es sich bei diesen Grafiken um Bilder handelt (PNG, JPG, SVG usw.), so dass eine Aktualisierung des Webflow-CSS (Styling) keine Auswirkungen auf sie hat. Wenn Sie diese Grafiken wiederverwenden möchten, können Sie sie jederzeit herunterladen und mit einer beliebigen Designsoftware (z. B. Photoshop, Illustrator, Sketch, Figma usw.) bearbeiten oder direkt Ihre eigenen Bilder/Grafiken hochladen, die zu Ihrer Marke passen.

Seiten bearbeiten

Jetzt ist es an der Zeit, mit den nächsten Schritten zur Bearbeitung Ihrer Website-Seiten fortzufahren. Normalerweise gibt es 2 Arten von Inhalten, die bearbeitet werden, und zwar die folgenden.

Statischer Inhalt

Statische Inhalte sind alle Inhalte, die nicht auf einem CMS basieren, d. h. nicht dynamisch sind (wie z. B. ein Blogbeitrag).

Sie können all diese Inhalte leicht erkennen, da sie im Navigator auf der linken Seite grau dargestellt werden und einen blauen Rahmen aufweisen, wenn Sie darauf klicken oder den Mauszeiger darüber bewegen.

Wenn Sie diese Art von Inhalt bearbeiten möchten, können Sie einfach darauf doppelklicken, und Sie können direkt dort etwas eingeben.

Dynamischer Inhalt (CMS)

Dynamische Inhalte sind alle Inhalte, die dynamisch sind und automatisch auf der Grundlage der im CMS-Bereich in der linken Seitenleiste (direkt unter dem Seiten-Symbol) hinzugefügten Inhalte generiert werden.

Sie können all dies leicht erkennen, da es im Navigator auf der linken Seite als lila angezeigt wird und einen lila Rahmen aufweist, wenn Sie darauf klicken oder den Mauszeiger darauf setzen.

Dieser Inhalt sollte direkt im CMS-Bereich aktualisiert werden. Dies soll Ihnen die Aktualisierung sehr erleichtern, da es sehr wahrscheinlich ist, dass er ständig aktualisiert werden muss (z. B. durch Hinzufügen eines neuen Blogbeitrags).

Wenn Sie eine komplette, automatisch generierte CMS-Seite bearbeiten möchten (z. B. einen Blog-Beitrag), finden Sie diese Seite am unteren Ende aller Seiten im Abschnitt Seiten in der linken Seitenleiste zur Bearbeitung.

Produkte (eCommerce)

Produkte oder eCommerce-Inhalte funktionieren ähnlich wie die dynamischen Inhalte des CMS, allerdings ist dies ausschließlich auf eCommerce-Produkte ausgerichtet.

Sie können eCommerce-Inhalte auf ähnliche Weise wie CMS-Inhalte erkennen, da sie in der linken Seitenleiste im Navigator ebenfalls lila angezeigt werden und einen lila Rahmen haben, wenn Sie darauf klicken oder den Mauszeiger darüber bewegen.

Dieser Inhalt sollte direkt auf der Registerkarte eCommerce in der linken Seitenleiste aktualisiert werden. Dies soll Ihnen die Aktualisierung sehr erleichtern, da es sehr wahrscheinlich ist, dass er ständig aktualisiert werden muss (z. B. Änderung eines Produktpreises oder Hinzufügen von mehr Bestand).

Wenn Sie die automatisch erstellte eCommerce-Seite für Produkte bearbeiten möchten, finden Sie diese Seite fast am unteren Ende aller Seiten direkt über den CMS-Sammlungsseiten zur Bearbeitung.

Nützliche Hinweise

Neben den grundlegenden Erklärungen, die wir oben gegeben haben, geben wir hier noch einige Tipps und Anleitungen, die sich aus den häufigsten Fragen ergeben, die wir erhalten.

Wechselwirkungen

Wenn Sie eine Interaktion in der Vorlage bearbeiten möchten (z. B. um einen Effekt zu entfernen), können Sie die Elemente mit Interaktionen leicht erkennen, da diese in der linken Seitenleiste ein kleines Interaktionssymbol (ein kleiner Donner) haben.

Wenn Sie auf dieses kleine Interaktionssymbol klicken, wird die Registerkarte Interaktionen für dieses Element in der rechten Seitenleiste geöffnet, wo Sie die Interaktion bearbeiten können.

Mobile oder Tablet-Ansicht

Jedes Mal, wenn Sie eine Änderung vornehmen (z. B. einen neuen Abschnitt entwerfen), ist es eine gute Praxis, die obere Navigation des Ansichtsfensters aufzurufen und zu sehen, wie sie auf Tablet und Handy aussieht.

Wenn Sie nur einen Vorlagenabschnitt mit aktualisiertem Text oder Bildern bearbeiten und keine Vorlagenklasse löschen, sollte dies nicht erforderlich sein. Wenn Sie die Vorlage jedoch tiefergehend anpassen, Klassen bearbeiten oder neue Abschnitte erstellen, ist es immer gut, Ihre mobilen und Tablet-Ansichten ständig zu bearbeiten, um sicherzustellen, dass alles perfekt aussieht.

Bearbeitung von Meta Title, Desc und Featured Image

Wenn Sie den Titel, die Beschreibung und das Bild anpassen möchten, die angezeigt werden, wenn Sie Ihre Website an einem beliebigen Ort (z. B. Facebook, Twitter usw.) teilen, können Sie ganz einfach zum Abschnitt Seiten in der linken Seitenleiste gehen, auf das kleine Einstellungssymbol der Seite klicken, die Sie anpassen möchten, und alle diese Einstellungen werden angezeigt.

Bitte beachten Sie, dass es wichtig ist, dies auf Seitenbasis zu ändern.

Backups

Wenn etwas schief geht, z. B. wenn Ihnen die Entwicklung der Website nicht gefällt, wenn Sie einige wichtige Klassen gelöscht haben, die erforderlich waren, damit die Vorlage gut aussieht, oder wenn Sie einfach aus irgendeinem Grund zu einer früheren Version zurückkehren möchten, können Sie jederzeit den Bereich "Backups" aufrufen.

Sie finden es im Abschnitt Einstellungen in der linken Seitenleiste und können dann alle automatischen oder manuellen Sicherungen sehen. Die Wiederherstellung einer alten Sicherung ist nur einen Klick entfernt.

Coin X Webflow-Vorlagenunterstützung

Wie Sie oben sehen konnten, wurde Coin X auf Webflow aufgebaut, wobei die besten Praktiken verwendet wurden, um es Ihnen sehr einfach zu machen, die Vorlage zu bearbeiten und sie an Ihre Bedürfnisse anzupassen.

Wenn Sie jedoch jemals ein Problem finden, Hilfe benötigen oder einfach nur Hallo sagen wollen, können Sie uns gerne eine E-Mail schicken an [email protected] - Wir werden Ihnen gerne helfen.

Kundenspezifisches Design und Entwicklung

Auf der anderen Seite, wenn Sie auf der Suche nach Hilfe, um eine einzigartige und personalisierte Version von Coin X, oder einfach nur eine erstaunliche Website entworfen und entwickelt von Grund auf auf Webflow, fühlen sich frei, in Kontakt mit unserer Webflow Design & Development Agency. Das fantastische Team hinter Coin X Webflow Template kann Ihnen helfen.