Hinweis: Sie sind auf den Seiten der Moodle 2.8 Dokumentation. Die Dokumentation der aktuellsten Moodle-Version finden Sie hier: Standard-Designs.

Standard-Designs: Unterschied zwischen den Versionen

Aus MoodleDocs
Wechseln zu:Navigation, Suche
Keine Bearbeitungszusammenfassung
Keine Bearbeitungszusammenfassung
Zeile 1: Zeile 1:
{{Designs}}
{{Designs}}
==Standard-Designs==
{{Neu}}
Ab Version 2.7. hat Moodle nur noch zwei Standard-Designs:
*''Clean'' - ein responsives Design, basierend auf Bootstrap, das standardmäßig voreingestellt ist.
*''More'' - ein Design, das von der Moodle-Administration direkt in Moodle angepasst werden kann.
Weitere Designs, die in früheren Versionen in der Moodle-Standardinstallation enthalten waren, sind weiterhin in der [https://moodle.org/plugins/browse.php?list=category&id=3 Moodle-Plugins-Datenbank] verfügbar und können nachinstalliert werden.
'''Hinweis''': Wenn Sie bisher in Ihrer Moodle-Site ein Design verwendet haben, das früher zur Standardinstallation gehörte, müssen Sie '''vor''' der Aktualisierung auf Moodle 2.7. dieses Design deinstallieren.


==Design-Auswahl==
==Design-Auswahl==
Zeile 13: Zeile 23:
*Das gewählte Design ist das Site-Design. Es kann durch Kurs-, Nutzer- oder Session-Designs überschrieben werden, wenn diese Designs erlaubt sind. Siehe [[Design-Einstellungen]] für detaillierte Informationen.
*Das gewählte Design ist das Site-Design. Es kann durch Kurs-, Nutzer- oder Session-Designs überschrieben werden, wenn diese Designs erlaubt sind. Siehe [[Design-Einstellungen]] für detaillierte Informationen.


==Standard-Designs==
==Design ''More'' anpassen==
Folgende Designs sind in der Standardinstallation von Moodle vorhanden (in alphabetischer Reihenfolge):
Die Moodle-Administration kann das Design ''More'' auf der Seite ''[[Einstellungen-Block|Einstellungen]] > Website-Administration > Darstellung > Designs > More'' anpassen.
<gallery caption="Standard-Designs - klicken Sie auf ein beliebiges Bild, um es zu vergrößern" widths="200px" heights="113px" perrow="3">
 
Image:afterburner.jpg|Afterburner
Folgende Einstellungen stehen zur Verfügung:
Image:anomaly.jpg|Anomaly
*''Textfarbe''
Image:arialist.png|Arialist
*''Linkfarbe''
Image:binarius.jpg|Binarius
*''Hintergrundfarbe''
Image:boxxie.jpg|Boxxie
'*'Hintergrundbild''
Image:brick.png|Brick
*''Hintergrundwiederholung''
Image:formalwhite.png|Formal white
*''Hintergrundposition''
Image:formfactor.jpg|FormFactor
*''Fixierter Hintergrund''
Image:fusion.jpg|Fusion
*''Primäre Hintergrundfarbe''
Image:leatherbound.jpg|Leatherbound
*''Sekundäre Hintergrundfarbe''
Image:magazine.png|Magazine
*''Navigationsleiste invertieren''
Image:mymobile.png|MyMobile
*''Logo''
Image:nimble.png|Nimble
*''CSS-Anpassungen''
Image:nonzero.jpg|Nonzero
*''Fußzeile''
Image:overlay.png|Overlay
 
Image:serenity.png|Serenity
Bei der Angabe der Farbwerte können Sie sogar Transparenzwerte verwenden, z.B. rgba(255,255,255,0.8).
Image:skyhigh.png|Sky High
 
Image:splash.jpg|Splash
===Beispiel für ein angepasstes ''More''-Design===
Image:standard.png|Standard
Die [http://school.demo.moodle.net/ School Demo Site] (siehe MDL-3095) verwendet ein angepasstes ''More''-Design.
</gallery>


[[File:design.jpg|thumb|right]]
Bei dieser Moodle-Site wurden folgende Einstellungen verwendet:
<br><br>
*''Textfarbe'': #595959
Einige Designs, die in der Moodle-Standardinstallation enthalten sind, haben eigene Einstellungen, die Sie individuell anpassen können. Die nebenstehende Grafik zeigt eine Übersicht, welche Einstellungen für welches Design konkret möglich sind, siehe auch [[Design-Einstellungen#Einstellungen für einzelne Designs|Design-Einstellungen]].
*''Linkfarbe'': #0070a8
*''Hintergrundfarbe'': #93abc3
'*'Hintergrundbild'': [https://docs.moodle.org/27/en/File:bg6.png bg6.png]
*''Hintergrundwiederholung'': ''Keine Wiederholung''
*''Hintergrundposition'': Links unten
*''Fixierter Hintergrund'': ''Ja''
*''Primäre Hintergrundfarbe'': #fff
*''Sekundäre Hintergrundfarbe'': #fff
*''Navigationsleiste invertieren'': ''Nein''
*''Logo'': keins
*''CSS-Anpassungen'':
body { background-size: cover; }
h1, h2, h3, h4, h5, h6 { color: #f98012;
font-weight: normal; }
#page-header h1 {
color: #fff;
font-weight: bold;
text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); }
.block .header h2 {
color: #f98012;
font-weight: normal; }
#page-footer { color: #444; }
#page-footer a { color: #eee; }
*''Fußzeile'': keine


<br><br><br><br>
==Siehe auch==
==Siehe auch==
 
* [http://youtu.be/OUTzAFItLx4 Video zu Designs]
* [[:en:Theme credits|Theme credits]]
* [[:en:Theme credits|Theme credits]]
* [http://moodle.org/mod/forum/discuss.php?d=189573 What counts as a 'legacy' device type?] Diskussionsbeitrag im Kurs ''Using Moodle'' auf moodle.org
* [http://moodle.org/mod/forum/discuss.php?d=189573 What counts as a 'legacy' device type?] Diskussionsbeitrag im Kurs ''Using Moodle'' auf moodle.org


[[en:Standard themes]]
[[en:Standard themes]]

Version vom 20. August 2014, 10:56 Uhr


Standard-Designs

Neu
in Moodle 2.8!

Ab Version 2.7. hat Moodle nur noch zwei Standard-Designs:

  • Clean - ein responsives Design, basierend auf Bootstrap, das standardmäßig voreingestellt ist.
  • More - ein Design, das von der Moodle-Administration direkt in Moodle angepasst werden kann.

Weitere Designs, die in früheren Versionen in der Moodle-Standardinstallation enthalten waren, sind weiterhin in der Moodle-Plugins-Datenbank verfügbar und können nachinstalliert werden.

Hinweis: Wenn Sie bisher in Ihrer Moodle-Site ein Design verwendet haben, das früher zur Standardinstallation gehörte, müssen Sie vor der Aktualisierung auf Moodle 2.7. dieses Design deinstallieren.

Design-Auswahl

Als Administrator/in können Sie auf der Seite Einstellungen > Website-Administration > Darstellung > Designs > Design-Auswahl wählen, in welchem Design Ihre Moodle-Seite dargestellt wird.

Sie können für verschiedene Endgeräte verschiedene Designs auswählen. Klicken Sie dazu auf den entsprechenden Button Design ändern.

In der Liste der vorhandenen Designs wählen Sie ein geeignetes aus und klicken auf den zugehörigen Button Design auswählen.

Hinweise:

  • Moodle speichert Designs im Cache. Wenn Änderungen im Design nicht sofort sichtbar werden, klicken Sie auf der Seite Einstellungen > Website-Administration > Darstellung > Designs > Design-Auswahl oben auf den Button Design-Cache löschen.
  • Das gewählte Design ist das Site-Design. Es kann durch Kurs-, Nutzer- oder Session-Designs überschrieben werden, wenn diese Designs erlaubt sind. Siehe Design-Einstellungen für detaillierte Informationen.

Design More anpassen

Die Moodle-Administration kann das Design More auf der Seite Einstellungen > Website-Administration > Darstellung > Designs > More anpassen.

Folgende Einstellungen stehen zur Verfügung:

  • Textfarbe
  • Linkfarbe
  • Hintergrundfarbe

'*'Hintergrundbild

  • Hintergrundwiederholung
  • Hintergrundposition
  • Fixierter Hintergrund
  • Primäre Hintergrundfarbe
  • Sekundäre Hintergrundfarbe
  • Navigationsleiste invertieren
  • Logo
  • CSS-Anpassungen
  • Fußzeile

Bei der Angabe der Farbwerte können Sie sogar Transparenzwerte verwenden, z.B. rgba(255,255,255,0.8).

Beispiel für ein angepasstes More-Design

Die School Demo Site (siehe MDL-3095) verwendet ein angepasstes More-Design.

Bei dieser Moodle-Site wurden folgende Einstellungen verwendet:

  • Textfarbe: #595959
  • Linkfarbe: #0070a8
  • Hintergrundfarbe: #93abc3

'*'Hintergrundbild: bg6.png

  • Hintergrundwiederholung: Keine Wiederholung
  • Hintergrundposition: Links unten
  • Fixierter Hintergrund: Ja
  • Primäre Hintergrundfarbe: #fff
  • Sekundäre Hintergrundfarbe: #fff
  • Navigationsleiste invertieren: Nein
  • Logo: keins
  • CSS-Anpassungen:
body { background-size: cover; }
h1, h2, h3, h4, h5, h6 { color: #f98012;
font-weight: normal; }
#page-header h1 { 
color: #fff;
font-weight: bold;
text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); }
.block .header h2 {
color: #f98012;
font-weight: normal; }
#page-footer { color: #444; }
#page-footer a { color: #eee; }
  • Fußzeile: keine

Siehe auch