Editor X: Einen benutzerdefinierten Cursor hinzufügen

5 Min. Lesezeit
Editor X wird zu Wix Studio, unserer neuen Plattform für Agenturen und Freelancer.Mehr über Wix Studio erfahren
Ein benutzerdefinierter Cursor verleiht deiner Website einen einzigartigen Branding-Touch. Wende einen benutzerdefinierten Cursor auf eine Seite, einen Abschnitt oder ein bestimmtes Element an, mit dem Besucher interagieren (z. B Container, Bild usw.). Verwende einen unserer vielen Vorschläge oder lade deinen eigenen Cursor hoch und stelle die Größe so ein, dass er deinen Bedürfnissen entspricht.
Tipp:
Du kannst jede JPG-, PNG- oder SVG-Datei verwenden. Um sicherzustellen, dass der Cursor sichtbar ist, vergewissere dich, dass er einen klaren Rand in einer Farbe hat, die sich vom Hintergrund abhebt.
Beispiel für eine Website mit benutzerdefinierten Cursors, die auf verschiedene Abschnitte der Seite angewendet werden
In diesem Artikel erfährst du mehr über folgende Themen:
Tipp:
Du kannst einem übergeordneten Element und seinem untergeordneten Element verschiedene Cursor hinzufügen, um das Erlebnis noch besser anzupassen. Wenn Besucher mit dem untergeordneten Element interagieren, sehen sie seinen spezifischen Cursor, nicht den, den du auf das übergeordnete Element angewendet hast.

Einen benutzerdefinierten Cursor hinzufügen

Ändere den Cursor, der angezeigt wird, wenn Besucher mit einer Seite, einem Abschnitt oder einem Element interagieren. Du kannst aus vielen verschiedenen Designs wählen oder deine eigene Bilddatei hochladen (z. B. JPG, PNG, SVG).
Hinweis:
Änderungen, die du an deinem Cursor vornimmst, werden nicht auf der Arbeitsfläche angezeigt, da du deine Website bearbeitest. Um deinen Cursor in Aktion zu sehen, öffne die Vorschau oder deine Live-Website.

Um einen benutzerdefinierten Cursor hinzuzufügen:

  1. Wähle die entsprechende Seite, den entsprechenden Abschnitt oder das entsprechende Element im Editor X aus.
  2. Klicke oben auf das Symbol für Inspektor .
  3. Klicke auf den Tab Design .
  4. Klicke auf Cursor.
  5. Füge deinen Cursor hinzu:
    1. Klicke auf + Hinzufügen.
    2. (In der Medienverwaltung) Wähle einen der vorgeschlagenen Cursor oder klicke auf + Bild oder .svg hinzufügen, um deine eigene Datei hochzuladen.
    3. Wenn du fertig bist, klicke auf Hinzufügen.
  6. (Optional) Klicke oben rechts auf Vorschau, um zu sehen, wie der Cursor auf deiner Website aussieht.
Screenshot des Inspektor-Panels, in dem ein Cursor in der Kopfzeile der Seite hinzugefügt wird
Wie geht es weiter?
  • Wenn du einen Cursor auf eine Seite anwendest, kannst du auf Auf weitere Seiten anwenden klicken, um ihn schnell zu anderen Website-Seiten hinzuzufügen.
  • Du kannst deinen Cursor für jeden Breakpoint anpassen und ein anderes Bild oder eine andere Größe auswählen.

Die Größe des benutzerdefinierten Cursors ändern

Ändere die Größe deines Cursors, damit er auf deiner Website ideal aussieht.
Wir empfehlen, die Größe des Cursors zwischen 16 x 16 und 128 x 128 Pixel zu halten. Wenn der Cursor größer als die empfohlene Größe ist, zeigt der Browser deines Besuchers ihn möglicherweise überhaupt nicht an. Wenn es kleiner ist, können Besucher ihn sehen, aber nicht deutlich.

Um die Größe des benutzerdefinierten Cursors zu ändern:

  1. Wähle die entsprechende Seite, den entsprechenden Abschnitt oder das entsprechende Element im Editor X aus.
  2. Klicke oben auf das Symbol für Inspektor .
  3. Klicke auf den Tab Design .
  4. Klicke auf Cursor.
  5. Ziehe den Schieberegler unter Größe.
Screenshot des Inspektor-Panels, wenn du den Schieberegler unter Cursor ziehst, um die Größe des Cursors zu ändern
Tipp:
Die Vorschau, die du unter Medien siehst, zeigt an, wie dein Cursor auf deiner Live-Website in der von dir festgelegten tatsächlichen Größe aussieht.

Den benutzerdefinierten Cursor ändern

Du kannst einen zuvor hinzugefügten benutzerdefinierten Cursor jederzeit ersetzen. Wähle einen unserer Vorschläge oder lade eine neue Datei hoch.

Um den benutzerdefinierten Cursor zu ändern:

  1. Wähle die entsprechende Seite, den entsprechenden Abschnitt oder das entsprechende Element im Editor X aus.
  2. Klicke oben auf das Symbol für Inspektor .
  3. Klicke auf den Tab Design .
  4. Klicke auf Cursor.
  5. Klicke auf Medien ändern.
  6. (In der Medienverwaltung) Wähle einen neuen Cursor oder lade einen neuen hoch.
  7. Klicke auf Aktualisieren.
Screenshot des Inspektor-Panels, bei dem du unter Cursor auf Medien ändern klickst, um einen neuen auszuwählen

Den benutzerdefinierten Cursor entfernen

Du kannst deine Meinung jederzeit ändern und den benutzerdefinierten Cursor entfernen. Das bedeutet, dass deine Besucher wieder den normalen Standard-Cursor sehen.

Um den benutzerdefinierten Cursor zu entfernen:

  1. Wähle die entsprechende Seite, den entsprechenden Abschnitt oder das entsprechende Element im Editor X aus.
  2. Klicke oben auf das Symbol für Inspektor .
  3. Klicke auf den Tab Design .
  4. Klicke auf Cursor.
  5. Klicke neben Medien ändern auf das Symbol für Entfernen .

War das hilfreich?

|