Standard-Designs: Unterschied zwischen den Versionen

Wechseln zu: Navigation, Suche

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

 
(13 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
 
{{Designs}}
 
{{Designs}}
  
{{Zum Übersetzen}}
+
==Standard-Designs==
==Theme selector==
+
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.
  
An administrator can set a theme for the site in ''Settings > Site administration > Appearance > Themes > Theme selector''.
+
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.
  
Different themes may be set according to 'device type' - default, legacy (for older browsers), mobile and tablet.
+
'''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.
  
Go to ''Settings > Site administration > Appearance > Themes > Theme selector''
+
==Design-Auswahl==
*Click on the "Select theme" button next to the type you wish to change
 
*Scroll down to see the previews of the available themes and click on the "Use theme" button to chose the theme
 
*The next screen will provide information about the theme. Click "Continue"
 
  
Note 1: Moodle caches themes so if you don't immediately see changed settings that you were expecting, click the "Clear theme caches" button at the top of the Theme selector page.
+
Als Administrator/in können Sie auf der Seite ''[[Einstellungen-Block|Einstellungen]] > Website-Administration > Darstellung > Designs > Design-Auswahl'' wählen, in welchem Design Ihre Moodle-Seite dargestellt wird.
  
Note 2: The selected theme may be overridden if user/course or category themes have been allowed in the [[Theme settings]].
+
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-Block|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.
  
{{New features}}Tip: New in Moodle 2.2 onwards is a MyMobile theme especially designed for mobile devices.
+
==Design ''More'' anpassen==
 +
Die Moodle-Administration kann das Design ''More'' auf der Seite ''[[Einstellungen-Block|Einstellungen]] > Website-Administration > Darstellung > Designs > More'' anpassen.
  
[[File:Themeselector21.png|thumb|center|theme selector showing default and none selected in other theme types]]
+
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''
  
==Notes on individual themes==
+
Bei der Angabe der Farbwerte können Sie sogar Transparenzwerte verwenden, z.B. rgba(255,255,255,0.8).
  
Arialist: does not display the logo at course/course level. This menas it is not useful for branding at a category/course level.
+
===Beispiel für ein angepasstes ''More''-Design===
 +
Die [http://school.demo.moodle.net/ School Demo Site] (siehe MDL-3095) verwendet ein angepasstes ''More''-Design.
  
===Themes that alllow you to change a logo===
+
Bei dieser Moodle-Site wurden folgende Einstellungen verwendet:
*Arialist (only at home page level) Code to change this: http://moodle.org/mod/forum/discuss.php?d=192409
+
*''Textfarbe'': #595959
*Brick
+
*''Linkfarbe'': #0070a8
*Formal White
+
*''Hintergrundfarbe'': #93abc3
*Magazine
+
*''Hintergrundbild'': [https://docs.moodle.org/27/en/File:bg6.png bg6.png]
*Skylight
+
*''Hintergrundwiederholung'': Keine Wiederholung
*Splash
+
*''Hintergrundposition'': Links unten
 
+
*''Fixierter Hintergrund'': Ja
===Themes that allow custom CSS===
+
*''Primäre Hintergrundfarbe'': #fff
*Arialist
+
*''Sekundäre Hintergrundfarbe'': #fff
*Fusion
+
*''Navigationsleiste invertieren'': Nein
*Non-zero
+
*''Logo'': keins
*Overlay
+
*''CSS-Anpassungen'':
*Skyhigh
+
body { background-size: cover; }
*Splash
+
h1, h2, h3, h4, h5, h6 { color: #f98012;
 
+
font-weight: normal; }
==Standard themes==
+
#page-header h1 {
 
+
color: #fff;
In alphabetical order here are the standard themes in Moodle:
+
font-weight: bold;
<gallery caption="Standard Themes - click on any to enlarge" widths="200px" heights="113px" perrow="3">
+
text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); }
Image:theme_afterburner.png|Afterburner theme
+
.block .header h2 {
Image:theme_anomaly.png|Anomaly theme
+
color: #f98012;
Image:theme_arialist.png|Arialist theme
+
font-weight: normal; }
Image:theme_binarius.png|Binarius theme
+
#page-footer { color: #444; }
Image:theme_boxxie.png|Boxxie theme
+
#page-footer a { color: #eee; }
Image:theme_brick.png|Brick theme
+
*''Fußzeile'': keine
Image:theme_formalwhite.png|Formal white theme
 
Image:theme_formfactor.png|FormFactor theme
 
Image:theme_fusion.png|Fusion theme
 
Image:theme_leatherbound.png|Leatherbound theme
 
Image:theme_magazine.png|Magazine theme
 
Image:Mymobile_theme.png|MyMobile theme
 
Image:theme_nimble.png|Nimble theme
 
Image:theme_nonzero.png|Nonzero theme
 
Image:theme_overlay.png|Overlay theme
 
Image:theme_serenity.png|Serenity theme
 
Image:theme_skyhigh.png|Sky High theme
 
Image:theme_splash.png|Splash theme
 
Image:theme_standard.png|Standard theme
 
</gallery>
 
  
 
==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]]

Aktuelle Version vom 20. Oktober 2014, 08:55 Uhr


Standard-Designs

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