Version vom 10. Dezember 2021, 08:48 Uhr von Margit Link-Rodrigue (Diskussion | Beiträge) (Die Seite wurde neu angelegt: „ == Icons anpassen == Sie können den Navigationslinks in der Hauptnavigation individuelle Symbole zuweisen, indem Sie das Styling mittels CSS anpassen. Nehmen…“)
(Unterschied) ← Nächstältere Version | Aktuelle Version (Unterschied) | Nächstjüngere Version → (Unterschied)

Icons anpassen[Bearbeiten | Quelltext bearbeiten]

Sie können den Navigationslinks in der Hauptnavigation individuelle Symbole zuweisen, indem Sie das Styling mittels CSS anpassen. Nehmen wir an, Sie haben einen Link Softwarekatalog.

Um ein Buch-Symbol hinzuzufügen:

  1. Öffnen Sie die Seite MediaWiki:Common.css im Bearbeitungsmodus.
  2. Fügen Sie folgende Zeilen am Ende der Seite hinzu und speichern Sie sie ab.
a#n-Softwarekatalog::before {
    content: '\e970';
    font-family: 'entypo';
    margin-left: -20px;
    padding-right: 4px;
    vertical-align:middle;
}

Der Navigationslink hat nun ein Buchsymbol.

Navigations-Icon
Navigations-Icon

Damit die Änderung sichtbar wird, ist in der Regel ein Leeren des Browser-Caches (F5-Taste) notwendig. Sollte das angepasste Symbol nicht angezeigt werden, nachdem Sie den Browser-Cache geleert haben, folgen Sie der Anleitung Navigationslinks mit Sonderzeichen.

Verfügbare Symbole[Bearbeiten | Quelltext bearbeiten]

Alle verfügbaren Symbole können Sie auf einer Übersichtsseite hier einsehen.

In der oberen Zeile können Sie sich durch verschiedene Schriftarten klicken, darunter finden Sie die Icons mit den zugehörigen Zeichenschlüsseln. In MediaWiki:Common.css müssen Sie die Einträge font-family (Schriftart) und content (Zeichenschlüssel) entsprechend anpassen. Alternativ können Sie auch die BlueSpice

Navigationslinks mit Sonderzeichen[Bearbeiten | Quelltext bearbeiten]

Bei der Verwendung von Sonderzeichen kann es zu Schwierigkeiten kommen, da diese im HTML-Code der Browser-Seite umgewandelt werden. In diesem Fall klicken Sie mit der rechten Maustaste auf den entsprechenden Eintrag und wählen Sie, abhängig vom verwendeten Browser, "Untersuchen" aus, um die Developer Toolbar zu öffnen. Dort wird Ihnen die ID des Links angezeigt.

Developer Toolbar
Developer Toolbar

Wenn Sie zum Beispiel die Linkbeschreibung Einführung in Semantic MediaWiki mit dem Buchsymbol darstellen wollen, kopieren Sie den Wert aus der ID des Links und fügen Sie folgende Formatierungsanweisung in MediaWiki:Common.css ein:

a#n-Softwarekatalog::before,a[id="n-Einf.C3.BChrung-Semantic-MediaWiki"]::before  {content: '\e970';
    font-family: 'entypo';margin-left: -20px;
    padding-right: 4px;vertical-align:middle;
}

Nach dem Speichern von Common.css und dem erneuten Laden der Seite (über Tastaturtaste F5) wird Ihnen nun das gewünschte Symbol angezeigt.




Feedback zur Dokumentation ist im Community-Forum möglich.