Erstelle deine Website
mit dem Wix Editor

Hallo und willkommen zu unserer ersten Lektion zum Wix Editor.

In dieser Lektion zeige ich dir, wie du mit dem Wix Editor arbeitest.

Legen wir los.

Werfen wir zunächst einen Blick auf einige der Designvorlagen von Wix.

Wix bietet Hunderte von Designvorlagen, aus denen du wählen kannst.

Darunter Unternehmens- und Dienstleistungsvorlagen, Designvorlagen für Shops oder Kreative oder für deine Community und Blogs.

Du kannst auch leere Vorlagen wählen, wenn du ganz von vorne anfangen möchtest.

In diesem Fall wählen wir eine Designvorlage.

Dazu scrollen wir nach unten und sehen uns um.

Du siehst, es gibt einige wirklich schöne Designvorlagen.

Nehmen wir doch diese Vorlage hier auf der rechten Seite.

Die gefällt mir sehr gut.

Sie sieht sehr professionell aus.

Klicken wir auf „Bearbeiten“.

Super.

Wir haben unsere Designvorlage und können loslegen.

Werfen wir einen Blick auf ein paar nützliche Buttons und Tools für die Bearbeitung der Website.

Zunächst gibt es das Desktop-Symbol.

Es bedeutet, dass wir die Desktop-Version unserer Website bearbeiten.

Hier können wir auf die mobile Ansicht umschalten, um die mobile Version zu bearbeiten.

Das sehen wir uns in einer anderen Lektion an.

Hier haben wir „Speichern“.

Damit kannst du deine Arbeit zwischendurch speichern und verlierst keinen Fortschritt.

Hier ist die Vorschau.

Damit kannst du vorm Veröffentlichen prüfen, ob die Website deinen Vorstellungen entspricht.

Und „Veröffentlichen“.

Gehen wir zum linken Panel.

Oben haben wir das Panel „Hinzufügen“.

Hier können wir verschiedene Elemente zu unserer Website hinzufügen.

Wie du siehst, können wir Streifen, Text, Bilder, Buttons, Galerien, dekorative Elemente, interaktive Elemente und mehr hinzufügen.

Dann gibt es das Panel „Menüs & Seiten“.

Hier kannst du alle Seiten deiner Website sehen.

Dann gibt es noch das „Website-Design“.

Hier siehst du das ausgewählte Website-Design.

Mit nur einem Klick kannst du hier das gesamte Erscheinungsbild deiner Website ändern.

Du kannst dein Design auch individuell anpassen.

Als Nächstes haben wir den App-Markt von Wix.

Hier siehst du Hunderte von Apps, die du mit deiner Website verlinken kannst.

Dann gibt es „Mein Unternehmen“.

Hier kannst du die Apps verwalten, die du bereits hinzugefügt hast.

Als Nächstes haben wir die „Medien“.

Hier kannst du deine eigenen Medien hochladen.

Du siehst auch die Dateien der Website, die du bereits hochgeladen hast.

Außerdem gibt es das Fotostudio, den Video Maker, kostenlose Bilder und Videos von Wix.

Der letzte Button ist das Tool „Ascend“.

Es kann dir dabei helfen, den Traffic auf deine Website zu lenken und deine Website zu bewerben.

Gehen wir auf die rechte Seite.

Hier haben wir die Buttons „Rückgängig“ und „Wiederherstellen“.

Als Nächstes haben wir „Rauszoomen“ und „Neu anordnen“.

Rauszoomen und „Neu anordnen“ sind super.

Du kannst herauszoomen und die Reihenfolge deiner Inhalte deinem Wunsch entsprechend anpassen.

Als Nächstes haben wir „Tools“.

Hier gibt es eine Tool-Leiste, das Panel „Ebenen, Lineale, Rasterlinien“ und „An Objekt anpassen“.

Ich finde das Tools-Panel wirklich hilfreich beim Bearbeiten meiner Website.

Hier drüben haben wir die Suche.

Hier kannst du nach allem suchen, was du im Editor brauchen könntest.

Du kannst zum Beispiel eine Box hinzufügen.

Geben wir „Box“ ein.

Wenn du mit dem Mauszeiger über Vorschläge für Boxen fährst, werden dir links Boxen vorgeschlagen.

Dasselbe gilt auch für Diashowboxen und Multistatus-Boxen.

Das Suchfeld ist sehr praktisch.

Nachdem wir nun alle Tools kennengelernt haben, geht es jetzt ans Eingemachte: Werfen wir einen Blick auf den Editor.

Der Bereich, den du hier siehst, heißt „Above the Fold“.

Das ist der erste Bereich, den die Besucher deiner Website sehen, er ist daher sehr wichtig.

Hier sollten wir die Aufmerksamkeit der Besucher auf uns ziehen.

Das geht folgendermaßen: Wir müssen ihnen mitteilen, wer wir sind, was wir tun und wohin sie klicken sollen.

Wenn es sich um einen Shop handelt, gibst du den Namen deines Shops an und erklärst, was du in deinem Shop verkaufst.

Du kannst auch einen „Jetzt kaufen“-Button hinzufügen, der deine Besucher dorthin weiterleitet.

Werfen wir einen Blick auf die Seitenstruktur.

Bei Wix haben wir eine Kopfzeile, eine Seite und eine Fußzeile.

Die Kopf- und Fußzeile sind Master-Elemente.

Klicken wir auf die Kopfzeile und sehen sie uns an.

Wir gehen zum Tools-Panel, zu Ebenen und klicken auf Kopfzeile.

Wir sehen jetzt, dass die Kopfzeile offen ist.

Wie du siehst, sind die Elemente innerhalb der Kopfzeile alle orange.

Das liegt daran, dass sie auf allen Seiten sein werden.

Jedes orangefarbene Element wird auf alle Seiten angewendet.

Das ist wichtig zu wissen.

Hier oben haben wir auch einige unserer wichtigsten Elemente.

Der Name unseres Unternehmens, ein Logo, unser Menü und einen Call-to-Action.

Du solltest das Menü in der Kopfzeile platzieren.

Nur so wird es auf allen Seiten angezeigt und die Besucher deiner Website können sich auf ihr zurechtfinden.

Gehen wir weiter nach unten.

Als Nächstes haben wir die Seite.

Diese Seite besteht hauptsächlich aus Streifen.

Hier siehst du, dass wir ein Textfeld haben.

Ich zeige dir, wie du einen Text bearbeiten kannst.

Mit einem Doppelklick können wir einen Text löschen.

So einfach ist das.

Wir doppelklicken erneut und fügen den Text so wieder ein.

Perfekt.

Wir scrollen weiter nach unten und sehen uns den Rest der Website an.

Hier siehst du die Streifen, die wir hinzugefügt haben, und die hinzugefügten Elemente.

Hier unten können wir in die Fußzeile klicken.

Die Fußzeilenelemente sind genauso wichtig wie die Kopfzeile.

Du kannst hier sehen, dass wir zum Beispiel Instagram, Facebook, Twitter, TikTok und YouTube platziert haben.

Wir haben auch Allgemeine Unternehmensbedingungen, Liefer- und Rücksendebedingungen und die Datenschutzerklärung eingefügt.

Scrollen wir wieder nach oben und werfen einen Blick auf den Kopfzeilenbildlauf.

Wir können hier in die Kopfzeile klicken und zu Einstellungen gehen.

Derzeit ist der Kopfzeilenbildlauf „Fixiert“ eingestellt.

Gehen wir zur Vorschau und sehen uns an, wie das aussieht.

Du kannst hier in der Vorschau beim Runterscrollen sehen, dass die Kopfzeile beim Scrollen in Position bleibt.

Gehen wir zurück und wählen einen anderen Kopfzeilenbildlauf.

Wir klicken auf die Kopfzeile, gehen zu Einstellungen und wählen dieses Mal „Verschwindet“.

Gehen wir in die Vorschau und sehen uns an, wie das aussieht.

Wie du siehst, verschwindet dieses Mal beim Scrollen die Kopfzeile komplett.

Gehen wir zurück.

Bei dieser Website entscheide ich mich für „Fixiert“.

Perfekt.

Wir haben jetzt einen Blick auf einige Tools und Buttons geworfen.

Außerdem habe ich dir die Seitenstruktur erklärt, einschließlich der Kopfzeile, der Seite und der Fußzeile.

Jetzt möchte ich dir noch etwas anderes zeigen, das wirklich cool ist.

Gehen wir zum Panel „Hinzufügen“ und runter zu „Social Media“.

Hier wählen wir eine der Social-Media-Leisten.

Nehmen wir diese graue und ziehen sie hierhin.

Wie du siehst, wird sie an den Streifen angehängt.

Jetzt fixieren wir sie auf dem Bildschirm.

Klicke dafür mit der rechten Maustaste und wähle „Position fixieren“.

Du kannst genau auswählen, wo dieses Element fixiert wird.

Zum Beispiel unten, links.

In diesem Fall wählen wir die rechte Mitte.

Super.

Aber wie du siehst, fehlt noch etwas.

Mal sehen, was wir noch tun können.

Wenn wir auf „Layout“ gehen, können wir von horizontal auf vertikal umstellen.

Wir machen das jetzt.

Super.

Jetzt sehen wir, dass sie beim Scrollen mitläuft.

Das ist nützlich für Elemente, die du die ganze Zeit auf der Website anzeigen möchtest, während dein Besucher dort ist.

Jetzt zeige ich dir einen neuen Trick.

Wir klicken mit der rechten Maustaste und wählen „Auf allen Seiten anzeigen“.

Schau, was passiert, wenn wir darauf klicken.

Wie du siehst, hat sich die Box um dieses Element von blau zu orange geändert.

Das bedeutet, dass es jetzt auf allen Seiten angezeigt wird, wie die anderen Master-Elemente.

Werfen wir einen Blick auf die Vorschau und sehen uns an, wie das aussieht.

Perfekt.

Wie du hier sehen kannst, bleibt die Social-Media-Leiste beim Scrollen in Position.

In dieser Lektion habe ich dir alle Buttons und Tools gezeigt, die du brauchst, um eine professionelle Website zu erstellen.

Ich habe dir außerdem die Seitenstruktur erklärt und wie wichtig der Bereich „Above the Fold“, die Kopfzeile, die Seite und die Fußzeile sind.

Wir haben auch ein Element auf dem Bildschirm fixiert und eingestellt, dass es auf allen Seiten angezeigt wird.

Ich hoffe sehr, dass dir diese Lektion gefallen hat, und ich freue mich darauf, dich in Lektion 2 zu sehen.

In Lektion 2 werden wir uns mit Layouts beschäftigen.