• Thema

  • Technologie

CSS-Trick: So änderst du den Cursor auf einer Website

Ein Webdesign-Trend, den man in letzter Zeit immer häufiger sieht: Einzigartige Cursor auf der Website. Dabei ist das ganz einfach umzusetzen, ich zeige dir, wie.

Du brauchst deinen neuen Cursor entweder als PNG oder auch als SVG-Datei. Die Grösse sollte maximal 100px betragen.

Hier ein Beispiel

Wenn du mit WordPress arbeitest, lädst du diese Datei in die Mediathek. Dort kopierst du den Link der hochgeladenen Datei.

Dann braucht’s nur noch etwas CSS:

html {
	cursor: url('/wp-content/uploads/2022/05/mein-cursor.svg'), auto;	
}

Zwischen die Anführungszeichen setzt du den kopierten Link.

Und schon hat deine Website einen eigenen Cursor:

Über mich

  • Simea Merki

    Jeden Tag Menschen helfen, das zu sagen, was sie zu sagen haben. Mit Wirkung und Vision, trotzdem ressourcensparend. Ob es dabei um Websites, Webshops, Content Systeme, Texte oder auch Design geht, ist zweitrangig. Im Vordergrund stehst du und deine Vision. Mit massgeschneiderten und innovativen Ideen geben wir beim Familienunternehmen morntag unser Allerbestes, deine Message zu unterstützen.

Was denkst du dazu?
yeah!
1
wooow
0
what?
0
meh.
1
hahaha
0
Das könnte dich auch interessieren:
Ad - SiteGround Webhosting - Einfache Site-Verwaltung. Mehr erfahren.
Beitrag teilen
Was denkst du dazu?
Was denkst du dazu?
yeah!
1
wooow
0
what?
0
meh.
1
hahaha
0
Diskussion

5 Antworten

    1. Hi Toni
      Klar, kein Problem! Es gibt immer verschiedene Orte, wo man CSS hinzufügen kann. Am einfachsten ist es wahrscheinlich unter Design > Customizer > CSS. Hilft das? 🙂
      Liebe Grüsse Simea

  1. Bitte bitte nicht. Websiten, die sich an meinem Cursor oder meiner Scrollbar zu schaffen machen werden asap geschlossen und geblockt. Das ist ein NoGo.

    1. Soll ich ganz ehrlich sein? Auf diesen Kommentar habe ich gewartet! 😂 Eigentlich sollten solche Tutorials immer einen Disclaimer haben: “Wir übernehmen keine Haftung für etwaige Design-Unfälle”. Ich bin bei dir, das Feature muss man mit Vorsicht geniessen.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

 

Hinweis: Es kann bis zu zwei Stunden gehen, bis dein Kommentar auf der Website erscheint. Bitte poste deinen Kommentar nur einmal 😉

Aktuelle Jobangebote
  • Grafik / Prepress / Druck / Verpackung / Werbetechnik | Medienjobs und Stellen für Profis

  • Neue Beiträge als E-Mail
    jeden Dienstag die neusten Blogposts in deiner Inbox
    Unsere Partner:

    Dein Gerät ist aktuell offline.