Handbuch:Erweiterung/ContentDroplets/Symbol: Unterschied zwischen den Versionen

(Die Seite wurde neu angelegt: „==Anwendung== ===Bootstrap Icons=== #'''Finden''' Sie ein Bootstrap-Icon [https://de.wiki.bluespice.com/w/skins/BlueSpiceDiscovery/resources/bootstrap/icons/index.html auf der '''Liste der aktuell unterstützten Icons.'''] #'''Markieren''' Sie den "class"-Namen (im Format ''bi bi-meinIcon'') aund '''kopieren''' Sie ihn in Ihre Zwischenablage (Strg+c). #'''Gehen''' Sie zurück auf Ihre Wikiseite. #'''Öffnen''' Sie den Droplets-Dialog im VisualEditor. #'…“)
 
(kein Unterschied)

Aktuelle Version vom 24. Juli 2023, 16:44 Uhr

Anwendung

Bootstrap Icons

  1. Finden Sie ein Bootstrap-Icon auf der Liste der aktuell unterstützten Icons.
  2. Markieren Sie den "class"-Namen (im Format bi bi-meinIcon) aund kopieren Sie ihn in Ihre Zwischenablage (Strg+c).
  3. Gehen Sie zurück auf Ihre Wikiseite.
  4. Öffnen Sie den Droplets-Dialog im VisualEditor.
  5. Wählen Sie das Droplet Symbol:
    Droplet Menü mit Schritten zum Auswählen des Symbol-Droplets
    Symbol-Droplet einfügen
    1. Suchen Sie das Droplet Symbol.
    2. Klicken Sie auf die Karte Symbol.
    3. Klicken Sie auf Einfügen.
  6. Fügen Sie die Icon-Klasse aus der Zwischenablage ein (Strg+v):
    Vorlagen-Editor
    Vorlagen-Editor
  7. Ändern Sie die Schriftgröße (optional), wenn Sie das Icon größer oder kleiner als die umgebende Schriftgröße darstellen wollen. Kleinere Icons sind meistens nicht kleiner als 0.85em und größere Icons meistens bis höchstens 2.5em.
  8. Farbe: Wenn Sie möchten, dass sich die Farbe vom umgebenden Text unterscheidet, können Sie eine beliebige Webfarbe angeben (z. B. einen Farbnamen wie blue oder einen Hex-Wert wie #0059b3 für ein spezifischeres Blau). Eine Liste der Webfarben finden Sie unter https://www.w3schools.com/colors/colors_picker.asp
  9. Vertikale Ausrichtung: Es sollte nicht erforderlich sein, einen Ausrichtungswert anzugeben. Der Standard ist auf text-top eingestellt und funktioniert normalerweise in Überschriften und im Fließtext. Wenn es schlecht ausgerichtet aussieht, können Sie andere Werte für die vertikale Ausrichtung ausprobieren, z. B. text-bottom. Eine vollständige Liste der möglichen Werte finden Sie unter https://www.w3schools.com/cssref/pr_pos_vertical-align.asp.
  10. Klicken Sie auf Änderungen speichern.

Das Symbol ist nun auf der Seite sichtbar.

Bootstrap Icon bi bi-awards vor einer Hauptüberschrift.
Eingefügtes Bootstrap-Icon


FontAwesome Icons

Die Erweiterung FontAwesome ist ab BlueSpice Version 4.3 gebündelt. In einem unserer nächsten Patches werden wir die Möglichkeit hinzufügen, sie im Symbol-Droplet zu verwenden. In der Zwischenzeit können Sie FontAwesome-Symbole mit der Parser-Funktion {{#fas:...}} im Quellbearbeitungsmodus hinzufügen. Siehe die offizielle MediaWiki-Dokumentation.





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

Keine Kategorien vergebenBearbeiten

Diskussionen