Hallo liebes Forum
Ich bin ein absoluter nobody in Sachen Moodle und ich muss für mein Geschäft unser Moodle umkrämpeln. Nun bin ich seit einem Tag an einem Punkt an dem ich nicht mehr weiter komme.
Ich versuche die Menübar (Navigationsbar) zu veränden. Ich habe es mit allen Möglichen Varianten versucht (CSS menü ändern, Bildersuchen die verlinkt sind, Plugins suchen) ich habe echt keine Ahnung wo das Problem liegt, dass ich das Menü nicht anders einfärben kann.
Ich habe auch das Forum durchsucht und habe so änliches gefunden, aber habe es wohl falsch umgesetzt, hat einfach nie funktioniert.
http://www.ipf-multiversity.com/development/
Hier ist die Seite.
Hier mein CSS menü File:
@charset "UTF-8";
/**
* Horizontal CSS Drop-Down Menu Module
*
* @file dropdown.css
* @package Dropdown
* @version 0.7.1
* @type Transitional
* @stacks 597-599
* @browsers Windows: IE6+, Opera7+, Firefox1+
* Mac OS: Safari2+, Firefox2+
*
* @link http://www.lwis.net/
* @copyright 2006-2008 Live Web Institute. All Rights Reserved.
*
*/
ul.dropdown,
ul.dropdown li,
ul.dropdown ul {
list-style: none;
margin: 0;
padding: 0;
}
ul.dropdown {
position: relative;
z-index: 597;
float: left;
}
ul.dropdown li {
float: left;
line-height: 1.3em;
vertical-align: middle;
zoom: 1;
}
ul.dropdown li.hover,
ul.dropdown li:hover {
position: relative;
z-index: 599;
cursor: default;
}
ul.dropdown ul {
visibility: hidden;
position: absolute;
top: 100%;
left: 0;
z-index: 598;
width: 100%;
}
ul.dropdown ul li {
float: none;
}
ul.dropdown ul ul {
top: 1px;
left: 99%;
}
ul.dropdown li:hover > ul {
visibility: visible;
}
/*------------------------------------------------------------------------------------------------------/
@section Style Framework */
/* First-level expected directory tag - li */
ul.dropdown li {
padding: 3px;
}
ul.dropdown *.dir {
padding-right: 30px;
background-image: none;
background-position: 100% 50%;
background-repeat: no-repeat;
}
/* Non-first level */
ul.dropdown ul *.dir {
padding-right: 15px;
background-image: url(images/nav-arrow-right.png);
background-position: 100% 50%;
background-repeat: no-repeat;
}
ul.dropdown ul ul *.dir {
background-image: url(images/nav-arrow-right2.png);
}
/* Components override */
ul.dropdown-vertical *.dir {
background-image: url(images/nav-arrow-right.png);
}
ul.dropdown-vertical-rtl *.dir {
padding-right: 15px;
background-image: url(images/nav-arrow-left.png);
background-position: 0 50%;
}
/*------------------------------------------------------------------------------------------------------/
@section Base Drop-Down Styling */
/* ALL LEVELS (incl. first) */
ul.dropdown {
font: 15px/normal Arial, Helvetica, sans-serif;
}
ul.dropdown li {
background-color: #333;
color: #fff;
}
ul.dropdown li.hover,
ul.dropdown li:hover {
}
/* Links */
ul.dropdown a:link,
ul.dropdown a:visited { color: #fff; text-decoration: none;}
ul.dropdown a:hover {
border-top-color: #000000 !important;
border-left-color: #5db1e0;
background-color: #4498ca;
color: #fff;
}
ul.dropdown ul a.dir:hover { /* proposal */
background-color: #4498ca;
background-image: url(images/comnav-arrowon.png);
color: #fff;
}
ul.dropdown a:active {
background: #058acf url(images/nav-sub-press.png) 0 0 repeat-x !important;
color: #fff;
}
/* NON-FIRST LEVEL */
ul.dropdown ul {
left: auto;
right: 0;
width: auto;
margin-top: -1px;
border-top: 1px solid #1a1a1a;
border-left: solid 1px #4c4c4c;
font: bold 11px/1em Tahoma, Geneva, Verdana, sans-serif;
}
ul.dropdown ul li {
background-color: #3a3a3a;
}
ul.dropdown ul ul {
top: 0;
right: auto;
left: 100%;
margin-top: 0;
border-top: none;
border-left: none;
font-weight: normal;
}
ul.dropdown ul ul li {
background-color: #4c4c4c;
}
ul.dropdown ul ul ul li {
background-color: #595959;
}
/* Mixed */
ul.dropdown li a,
ul.dropdown *.dir {
border-style: solid;
border-width: 1px;
border-color: #404040 #1a1a1a #1a1a1a #505050;
}
ul.dropdown ul li a,
ul.dropdown ul *.dir { border-color: #4a4a4a #242424 #242424; border-left: none; }
ul.dropdown ul ul li a,
ul.dropdown ul ul *.dir { border-color: #595959 #333 #333; }
ul.dropdown ul ul ul li a,
ul.dropdown ul ul ul *.dir { border-color: #767676 #404040 #404040; }
/* Custom elements */
#n-left { width: auto; text-align: center; }
#n-left ul { right: auto; left: 0; width: 249px; text-align: left; }
#n-left ul ul { left: 249px; width: 150px; }
#n-left ul a { width: 232px; }
#n-left ul a.dir { width: 210px; }
#n-left ul ul a { width: 133px; }
#n-left ul ul a.dir { width: 111px; }
#n-left ul ul ul { left: 100%; }
#n-right { width: auto; text-align: center; }
#n-right ul { right: 0; left: auto; width: 249px; text-align: left; }
#n-right ul ul { left: 249px; width: 150px; }
#n-right ul a { width: 232px; }
#n-right ul a.dir { width: 210px; }
#n-right ul ul a { width: 133px; }
#n-right ul ul a.dir { width: 111px; }
#n-right ul ul ul { left: 100%; }
/*------------------------------------------------------------------------------------------------------/
* @section Base Style Extension
*/
ul.dropdown a,
ul.dropdown span {
display: block;
padding: 5px 15px;
}
/*------------------------------------------------------------------------------------------------------/
* @section Base Style Override
*/
ul.dropdown li {
padding: 0;
}
ul.dropdown ul a,
ul.dropdown ul span { /* POI, proposal: override abstract a, span */
padding: 8px;
}
/*------------------------------------------------------------------------------------------------------/
* @section Base Style Reinitiate: post-override activities
*/
ul.dropdown *.dir { /* POI */
padding: 5px 15px;
}
ul.dropdown ul *.dir {
padding: 8px 30px 8px 8px;
}
/*------------------------------------------------------------------------------------------------------/
* @section Custom Styles
*/
ul.dropdown ul a {
width: 133px;
}
ul.dropdown ul a.dir {
width: 111px;
}
/*------------------------------------------------------------------------------------------------------/
* @section Support Class `open` Usage
* @source js, artificial
*
*/
ul.dropdown *.open {
background-color: #3d3d3d;
}
ul.dropdown ul *.open {
background-color: #4c4c4c;
background-image: url(images/comnav-arrowover.png);
color: #fff;
}
ul.dropdown ul ul *.open {
background-color: #595959;
background-image: url(images/comnav-arrowover2.png);
color: #fff;
}
/* Override UPPER TWO definitions */
ul.dropdown a.open:hover {
background-color: #4498ca;
color: #fff;
}
ul.dropdown ul a.open:hover {
background-image: url(images/comnav-arrowon.png);
color: #fff;
}
/* Clone in CSS 2 */
ul.dropdown li:hover > *.dir {
background-color: #3d3d3d;
}
ul.dropdown ul li:hover > *.dir {
background-color: #4c4c4c;
background-image: url(images/comnav-arrowover.png);
}
ul.dropdown ul ul li:hover > *.dir {
background-color: #595959;
background-image: url(images/comnav-arrowover2.png);
color: #fff;
}
/* Override UPPER TWO definitions */
ul.dropdown li:hover > a.dir:hover {
background-color: #4498ca;
color: #fff;
}
ul.dropdown ul li:hover > a.dir:hover {
background-image: url(images/comnav-arrowon.png);
color: #fff;
}
Bitte helft mir, ich habe morgen eine Präsentation in der diese Seite weiss sein sollte.
Danke im Voraus.
Hallo Yves,
die Seite ist doch komplett weiß. Welchen Teil genau willst du umfärben?
Viele Grüße.
die Seite ist doch komplett weiß. Welchen Teil genau willst du umfärben?
Viele Grüße.
Hallo Claudia,
Das horizontale Menü der Seite ist leider nicht weiss. Das Menü ist vom grund Desin her schwarz.
http://www.ipf-multiversity.com/development/
Das grosse Problem ist, dass ich nicht weiss, wie man es bearbeitet. Ich habe schon daran rumgebastelt, aber ich kann werder Kurse hinzufügen noch entfernen ebenfalls kann ich die Farben auch nicht so bearbeiten, dass das Menü einfach weiss ist.
Ich weiss nicht einmal, wo ich Themen hinzufügen kann oder löschen im Menü.
Ich hoffe du kannst mir da helfen.
Das horizontale Menü der Seite ist leider nicht weiss. Das Menü ist vom grund Desin her schwarz.
http://www.ipf-multiversity.com/development/
Das grosse Problem ist, dass ich nicht weiss, wie man es bearbeitet. Ich habe schon daran rumgebastelt, aber ich kann werder Kurse hinzufügen noch entfernen ebenfalls kann ich die Farben auch nicht so bearbeiten, dass das Menü einfach weiss ist.
Ich weiss nicht einmal, wo ich Themen hinzufügen kann oder löschen im Menü.
Ich hoffe du kannst mir da helfen.
Hallo Yves,
aus der Kalten eine Grundeinführung in wenigen Sätzen wird schwer.
Ich versuche es mit kurzen Hinweisen, die dir vielleicht bei der Suche helfen. Da ich dein System aber nicht kenne, kann ich auch nur mutmaßen.
Das Menü hat verschiedene Grauwerte, deswegen wird die Suche nach Schwarz im Quellcode wohl nicht geholfen haben. Die folgenden Farbwerte habe ich mit Firebug (Firefox-Plugin) gefunden:
#4A4A4A
#242424
Vielleicht hilft das schon mal beim Ersetzen der Farbwerte.
Ich nehme an, dass die jeweiligen Themen Kurse sind, die kannst du unter der Website-Administration > Kurse > Verwaltung anlegen.
Dein Menü ist Teil des Headers. Unter Umständen kannst du es in der header.html ändern. Vielleicht steht es aber auch ganz woanders. Aber da es sich auf die CSS-Definition "header-home" bezieht, nehme ich an, dass es sich dort finden lässt.
Ich hoffe, ich konnte dir ein wenig helfen. Das Durchsuchen des Quellcodes kann dir aber keiner abnehmen.
aus der Kalten eine Grundeinführung in wenigen Sätzen wird schwer.
Ich versuche es mit kurzen Hinweisen, die dir vielleicht bei der Suche helfen. Da ich dein System aber nicht kenne, kann ich auch nur mutmaßen.
Das Menü hat verschiedene Grauwerte, deswegen wird die Suche nach Schwarz im Quellcode wohl nicht geholfen haben. Die folgenden Farbwerte habe ich mit Firebug (Firefox-Plugin) gefunden:
#4A4A4A
#242424
Vielleicht hilft das schon mal beim Ersetzen der Farbwerte.
Ich nehme an, dass die jeweiligen Themen Kurse sind, die kannst du unter der Website-Administration > Kurse > Verwaltung anlegen.
Dein Menü ist Teil des Headers. Unter Umständen kannst du es in der header.html ändern. Vielleicht steht es aber auch ganz woanders. Aber da es sich auf die CSS-Definition "header-home" bezieht, nehme ich an, dass es sich dort finden lässt.
Ich hoffe, ich konnte dir ein wenig helfen. Das Durchsuchen des Quellcodes kann dir aber keiner abnehmen.
Hallo Claudia
Das hat mir schon sehr geholfen, danke. Ich werde mich mit diesen neuen Informationen durch den Code känpfen und die Farben ersetzen.
Herzlichen Dank für deine schnelle Hilfe, das hier ist ein tolles Forum.
Das hat mir schon sehr geholfen, danke. Ich werde mich mit diesen neuen Informationen durch den Code känpfen und die Farben ersetzen.
Herzlichen Dank für deine schnelle Hilfe, das hier ist ein tolles Forum.
Hallo Yves,
die Datei, die für die Farben verantwortlich ist heißt "menubar.css".
Du wirst sie höchstwahrscheinlich unter
themes/DeinTheme/
finden.
Dort solltest du alle Farben bearbeiten können.
MfG
Ralf
die Datei, die für die Farben verantwortlich ist heißt "menubar.css".
Du wirst sie höchstwahrscheinlich unter
themes/DeinTheme/
finden.
Dort solltest du alle Farben bearbeiten können.
MfG
Ralf
Hallo Ralf
Diese Datei habe ich gefunden und ich habe die Farbe nun auch ändern können. Es bleiben noch Detailfragen vieleicht kannst du mir da helfen.
Ich habe nun mein ganzes Menü weiss machen können. Jedoch ist die Schrift der ersten drei Felder weiss wenn man mit der Maus darüber fährt und die Schrift der nächsten Felder ist Schwarz.
Hier ist meine Seite:
http://www.ipf-multiversity.com/development/
Das scheint mir sehr schwer zu sein. Ich kann dies nicht einheitlich definieren in der CSS Datei wie sich die Farbe der Schrift verhält.
mfg
Yves
Diese Datei habe ich gefunden und ich habe die Farbe nun auch ändern können. Es bleiben noch Detailfragen vieleicht kannst du mir da helfen.
Ich habe nun mein ganzes Menü weiss machen können. Jedoch ist die Schrift der ersten drei Felder weiss wenn man mit der Maus darüber fährt und die Schrift der nächsten Felder ist Schwarz.
Hier ist meine Seite:
http://www.ipf-multiversity.com/development/
Das scheint mir sehr schwer zu sein. Ich kann dies nicht einheitlich definieren in der CSS Datei wie sich die Farbe der Schrift verhält.
mfg
Yves
Als Antwort auf Yves Bätscher
Re: Farbe des Menüs (Navigatonsbar) bearbeiten
von Andreas Schlenger -
Hallo Yves,
für die Farbänderung von Verweisen bei Mauskontakt ist die Auszeichnung a:hover zuständig. Finde in deinem Stylesheet folgende Passage:
/* Links */
ul.dropdown a:link,
ul.dropdown a:visited { color: #fff; text-decoration: none;}
ul.dropdown a:hover {
border-top-color: #000000 !important;
border-left-color: #5db1e0;
background-color: #4498ca;
color: #fff;
}
und passe sie an.
Bei der Wahl der Farben hilft übrigens ein Tool wie Colorpic (http://www.iconico.com/colorpic/)
Es grüßt,
Andreas.
für die Farbänderung von Verweisen bei Mauskontakt ist die Auszeichnung a:hover zuständig. Finde in deinem Stylesheet folgende Passage:
/* Links */
ul.dropdown a:link,
ul.dropdown a:visited { color: #fff; text-decoration: none;}
ul.dropdown a:hover {
border-top-color: #000000 !important;
border-left-color: #5db1e0;
background-color: #4498ca;
color: #fff;
}
und passe sie an.
Bei der Wahl der Farben hilft übrigens ein Tool wie Colorpic (http://www.iconico.com/colorpic/)
Es grüßt,
Andreas.
Als Antwort auf Andreas Schlenger
Re: Farbe des Menüs (Navigatonsbar) bearbeiten
von Yves Bätscher -
Hallo Andreas
Danke für deine Hilfe. Dort habe ich schon Einstellungen vorgenommen. Aber leider verändern sich nur die ersten drei Bottons. Ich hatte die Idee, dass es daranliegt, dass die letzten drei Bottons keine Verlinkung aufweisen (keine default Seiten Verlinkung). Die ersten aber schon.
Denkst du es könnte an den Links liegen?
Hier meine Einstellungen:
ul.dropdown a:link,
ul.dropdown a:visited { color: #000000; text-decoration: none;}
ul.dropdown a:hover {
border-top-color: #000000 !important; /* Überstrich Menü (2&3) */
border-left-color: #5db1e0;
background-color: #8b9aa0; /*pop up grau*/
color: #fff;
}
ul.dropdown ul a.dir:hover { /* proposal */
background-color: #4498ca;
background-image: url(images/comnav-arrowon.png);
color: #fff;
}
ul.dropdown a:active {
background: #ffffff url(images/nav-sub-press.png) 0 0 repeat-x !important;
color: #fff;
}
Danke für deine Hilfe
Mfg
Yves
Danke für deine Hilfe. Dort habe ich schon Einstellungen vorgenommen. Aber leider verändern sich nur die ersten drei Bottons. Ich hatte die Idee, dass es daranliegt, dass die letzten drei Bottons keine Verlinkung aufweisen (keine default Seiten Verlinkung). Die ersten aber schon.
Denkst du es könnte an den Links liegen?
Hier meine Einstellungen:
ul.dropdown a:link,
ul.dropdown a:visited { color: #000000; text-decoration: none;}
ul.dropdown a:hover {
border-top-color: #000000 !important; /* Überstrich Menü (2&3) */
border-left-color: #5db1e0;
background-color: #8b9aa0; /*pop up grau*/
color: #fff;
}
ul.dropdown ul a.dir:hover { /* proposal */
background-color: #4498ca;
background-image: url(images/comnav-arrowon.png);
color: #fff;
}
ul.dropdown a:active {
background: #ffffff url(images/nav-sub-press.png) 0 0 repeat-x !important;
color: #fff;
}
Danke für deine Hilfe
Mfg
Yves
Als Antwort auf Yves Bätscher
Re: Farbe des Menüs (Navigatonsbar) bearbeiten
von Andreas Schlenger -
Das ist jetzt zugegeben nur geraten: Mir fällt beim Studium des Quellcodes deiner Seite auf, dass z.B. der Menüpunkt "Courses" mit
<li id="n-left"><a href="./" class="dir">Courses</a> ausgewiesen wird, während das Learning REsource Center mit <li id="n-left"><span class="dir">LCR Learning Ressource Centres</span> ausgewiesen wird. Könnte das Problem mit der zusätzlichen "span"-Auszeichnung zusammen hängen? Gruß, Andreas.
Als Antwort auf Andreas Schlenger
Re: Farbe des Menüs (Navigatonsbar) bearbeiten
von Andreas Schlenger -
Nachtrag: Natürlich ist auch das Fehlen des Links selbst eine ganz heiße Spur. Hast du mal darüber nachgedacht, die fraglichen Einträge "blind" zu verlinken, also z.B. gewissermaßen mit einem Verweis auf sich selbst?
Gruß,
Andreas.
Gruß,
Andreas.
Als Antwort auf Andreas Schlenger
Re: Farbe des Menüs (Navigatonsbar) bearbeiten
von Yves Bätscher -
Hallo Andreas
Danke für deine Tipps. Ich werde beiden nachgehen und hoffen, dass einer der beiden Vermutungen zutrifft.
Danke für die Hilfe.
Danke für deine Tipps. Ich werde beiden nachgehen und hoffen, dass einer der beiden Vermutungen zutrifft.
Danke für die Hilfe.
Als Antwort auf Andreas Schlenger
Re: Farbe des Menüs (Navigatonsbar) bearbeiten
von Yves Bätscher -
Hallo Andreas
Ich habe das Problem gelöst. Du hattest recht es war ein Problem mit der span funktion als ich den Text verlinkt hatte värbte er sich anders.
Herzlichen Dank euch allen für die tolle Hilfe.
Ich habe das Problem gelöst. Du hattest recht es war ein Problem mit der span funktion als ich den Text verlinkt hatte värbte er sich anders.
Herzlichen Dank euch allen für die tolle Hilfe.