Stampa libroStampa libro

Bilder, Text und Icons in Moodle-Kursen

Sito: Moodle Lernplattform der ZHAW
Corso: Lernaktivitäten Moodle
Libro: Bilder, Text und Icons in Moodle-Kursen
Stampato da: Gast
Data: martedì, 21 luglio 2026, 20:33

Descrizione

Bilder, Text und Icons in Moodle-Kursen

Überall da wo man den Texteditor auf Moodle findet, können Bilder und Icons sowie Text eingefügt werden. Dabei sollte auf folgendes geachtet werden:

  • Bilder sollten vor dem Hochladen auf Moodle immer fürs Web optimiert werden, damit Ladezeiten verkürzt und Speicherplatz eingespart werden kann. Wie Sie Bilder ohne grossen Aufwand verkleinern können, erfahren Sie in den nachfolgenden Kurzanleitungen.
  • Als Alternativen zu Bildern können auch die FontAwesome-Icons der version 4.7 verwendet werden.
  • WICHTIG: Wenn Text aus dem Web oder z.B. aus einer Worddatei kopiert wird, werden jeweils auch versteckte Formatierungen übernommen, was zu Problemen auf Moodle führen kann, so dass ganze Kursabschnitte blockiert und nicht mehr bearbeitet werden können. Diese Formatierungen müssen vor dem Speichern entfernt werden. Im Texteditor kann der eingefügte Text markiert und dann mit folgenden Shotcuts die Formatierung entfernt werden:
    • Windows: STRG + SHIFT + V
    • MacOS:   CMD + SHIFT + V

Sommario

1. Texteditor

Über den Texteditor können nicht nur Text und Bilder eingefügt werden sondern auch H5P-Inhalte direkt aus dem Inhaltsspeicher, Kaltrua-Videos, Audio-Dateien und Links auf andere Seiten. Die wichtigesten Werkzeuge sind in der Tool-Bar aufgeführt, diese kann rechts über die 3 Punkte erweitert werden. Die gesamte Werkzeug-Pallete ist über die verschiedenen Menüs erreichbar.

2. Bilder einfügen

  • Im Texteditor auf das Bild-Icon klicken (oder über das Menü Einfügen die Option Bild wählen)
  • Das Bild kann direkt per Drag&Drop in das dafür vorgesehene Feld eingefügt werden.

  • Bild zur Dekoration: Wenn ein Bild als reine Dekoration verwendet wird und keine Beschreibung für das Bild vorgesehen ist, kann diese Option ausgewählt werden. 
  • Beschreibung für jemanden, der dieses Bild nicht sehen kann: Hier kann mit bis zu 750 Zeichen eine Beschreibung zum Bild hinterlegt werden, welche bspw. durch Screenreader erkannt und vorgelesen wird.
  • Originalgrösse: Wird gewählt, wenn man das Bild in der Grösse, wie man es hochlädt anzeigen möchte.
  • Angepasste Grösse: Bilder sollten wenn möglich immer auf die ungefähr benötigte Grösse vor dem Hochladen auf Moodle verkleinert werden. Kleinere Anpassungen können hier gemacht werden mit Angabe der Breite und Höhe in Pixel. 
  • Proportional: Sollte immer aktiviert bleiben, damit bei Grössenanpassung die Proportionen Breite/Höhe stimmt.

3. FontAwesome-Icons verwenden

Was sind FontAwesome-Icons?

FontAwesome ist eine Icon-Sammlung, welche auf einer Schriftart basiert. Sie können wie ein Text eingefärbt, skaliert und platziert werden.

FontAwesome ist kostenlos und kann auch mit dem Texteditor von Moodle genutzt werden. Alle kostenlosen Icons bis und mit FontAwesome-Version 6.5 stehen zur Verfügung.

 

Für was können FontAwesome-Icons genutzt werden?

Diese Icons können überall da verwendet werden, wo Sie auf Moodle den Texteditor finden. Die Icons lassen sich einfach in einen Fliesstext einfügen und ermöglichen so eine Hervorhebung von Textelementen. Sie können für eine bessere Orientierung auf einer Seite dienen. Die FontAwesome-Icons bieten gegenüber von normalen Bildern den Vorteil, dass sie nicht zugeschnitten werden müssen, sondern direkt in ihrer Grösse angepasst werden können, das verkürzt die Ladezeit einer Webseite.

3.1. Filtereinstellungen Moodle Kurse

Damit die FontAwesome-Icons angezeigt werden, ist der Filter standardmässig in allen Moodle-Kursen aktiviert. Werden die FontsAwesome-Icons nicht angezeigt, kann diese Einstellung wie folgt überprüft werden:

  • Im Moodle-Kurs über das Menü Mehr die Option Filter wählen
  • FontAwesome-Symbole muss auf Standard (An) gesetzt sein.

3.2. FontAwesom-Icons in Moodle verwenden

Die FontAwesome-Icons können im Texteditor mit einem Code eingefügt werden. Eine Übersicht dieser Codes gibt es auf der Webseite von FontAwesome. 

Es können nur die kostenlosen Icons bis Version 6.x verwendet werden. Alle Pro-Icons oder ganz neue Icons der Version 7.x werden in Moodle nicht angezeigt.

Auf der Übersichtsseite kann oben nach kostenlosen Icons (Free) und links nach weiteren Kriterien gefiltert werden. Über das Suchfeld kann nach bestimmten Icons gesucht werden.

  • Auf das gewünschte Icon klicken
  • Den im ScreenShot rot markierten Code braucht es, um das Icon in Moodle darzustellen.
  • Unten rechts findet man die Versionen des Icons. 

Diesen Code setzt man im Texteditor zwischen eckie Klammern irgendwo im Text, da wo man das Icon haben möchte.

Die Icons haben jeweils die Grösse und Farbe der Standardschrift. Man kann die Grösse und Farbe genauso ändern, wie wenn man Text formatieren möchte.