Hervorhebung der aktiven Seite im Textmenü

[struggle]

Hallo,

bisher bin ich folgendermaßen vorgegangen:

Auf der jeweils aktiven Seite:

Zunächst den Tag global aus der Kopfzeile entfernen !!

HTML:

<a class="nav-link link text-warning" href="page1.html" data-app-selector=".nav-link,.dropdown-item" data-app-placeholder="Type Text" >PROJEKT</a>

Durch HTML-Anweisung für rote Farbe ersetzt:

<a class="nav-link link text-warning" href="index.html" data-app-selector=".nav-link,.dropdown-item" data-app-placeholder="Type Text" style="color: red!important;">PROJEKT</a>

Das hat immer gut funktioniert.

Rote Farbe ist "red". Meine Frage ist, was schreibe ich bei einer anderen Farbe, deren Name mir nicht bekannt ist.
Ich habe den Hexalwert (# db6400) sowie rgb-Wert (219, 100, 0)
Gibt es für jeden einzelnen Wert einen Namen ? Oder schreibe ich den Wert in die Anweisung ?

[Tommy Herrmann]

Moin,

das das geht wundert mich

Ich habe es auf diese Art noch nicht ausprobiert.

Die Farbe kannst Du mit dem Hex-Farbcode eintragen, den Du am einfachsten aus dem Farbeditor von Mobirise kopierst.

Rot wäre dann:

#FF0000

also den Code direkt an das Raute-Symbol schreiben.

style="color: #FF0000 !important;"

[struggle]

Na ja, ist schon ein wenig her, aber diese Vorgehensweise war mal Dein Vorschlag
Ist natürlich ein wenig aufwendig, wenn man "global" entfernt, mann muss jede Seite händisch bearbeiten. Ich find's gut.
Und Dankeschön für Deine Antwort, dann werde ich mal den Hex-Farbcode eintragen.

[Tommy Herrmann]

echt

... ich hätte das jetzt mit dem "global" Attribut enfernen gemacht. Muss ich direkt nochmal testen.

Im Farb-Editor klickst Du dann auf "More" um den Hex-Code zu sehen (zurück klickst Du auf "Less"):

[stobi_de]

Na ja, wenn man das global entfernt, kann man natürlich irgendwas einfärben.
Aber interessant wäre es, wie es MIT dem global geht.
Sonst ist das bei großen Seiten die sich ständig ändern absolut unbrauchbar.
Ich hatte mal an was in JS gearbeitet, was den Namen der eigenen Seite liest, diesen dann im Menü sucht und das Item umfärbt oder hinterlegt.
Hat aber nie wirklich funktioniert.

[struggle]

Bei mir ging das Recht zügig. Hab diese Anweisung ein Mal geschrieben, kopiert und dann auf 20 Seiten mit strg + V an den richtigen Stellen eingefügt.
Man sollte nicht mit Rechtsklick einfügen, das geht öfter daneben !
Das ganze hat ca. 20 Minuten gedauert.
Schade aber, daß es über Mobirise keine Funktion gibt

[Tommy Herrmann]

Reinhard,

komisch - ich kann mich gar nicht entsinnen das mal empfohlen zu haben, kommt mir ganz fremd vor

Vielleicht hatte ich es seinerzeit direkt mal für Dich so ausprobiert, es aber selbst nie angewendet.

Ich hatte das mal ein wenig anders gemacht, was aber aufwändiger ist, da man das "global" Attribut entfernen muss und somit jede Änderung an der Navi auf allen Seiten einzeln vornehmen muss:

https://www.mobirise-tutorials.com/Test ... ungen.html

... oder so:

https://www.mobirise-tutorials.com/PlatformM5/

... andererseits musst Du bei Deinem System ja auch, bei einer neuen Seite, diese Änderung dann auch wieder auf der neuen Seite vornehmen.


Es geht aber, so wie Du es gemacht hast

Man darf nur die Menüleiste nicht wechseln, denn dann ist alles weg - aber das macht man ja auch nicht.




Übrigens - nur zur Info, bei Deiner Navi:

https://www.immo4live.de/

... hast Du diese Style-Anweisung dran geschrieben:

style="color: red !important;"

<a class="nav-link link text-warning" href="index.html" data-app-selector=".nav-link,.dropdown-item" data-app-placeholder="Type Text" style="color: red !important;">PROJEKT</a>

Du weißt aber schon, dass dort bereits eine Farbe steht, die class="text-warning", die Mobirise in der globalen CSS gründet und die Du dann ebenso gut auf jeder Seite einzeln abändern könntest, anstatt eine zweite Farbe dazu zu schreiben.

Du überschreibst mit Deiner Style-Anweisung quasi diese CSS-Class, die in der Navi bereits die Farbe definiert.

Allerdings sind das dynamische Farben, die sich Mobirise aus der Eingabe der Farbauswahl des Benutzers holt. Es wäre also dann notwendig, bei ganz anderen Farben, diese zunächst bei den Farbfeldern zu ändern

Du könntest also auch schreiben:

Anstatt class="text-warning" zum Beispiel class="text-success" und Deine Style-Anweisung ganz weg lassen.

<a class="nav-link link text-success" href="index.html" data-app-selector=".nav-link,.dropdown-item" data-app-placeholder="Type Text">PROJEKT</a>

Bei meinem Thema "Mobirise5" heißt der weiße Navi-Text dann übrigens class="text-white":

Diese Farben sind eigentlich Bootstrap-Klassen, gucke mal hier:

https://getbootstrap.com/docs/5.0/utilities/colors/

Diese Klassen wurden von Mobirise in der globalen CSS etwas geändert und sind bei Dir gerade so definiert. Es wurden also auch Klassen für z.B. "hover" und "focus" definiert:

Code: Alles auswählen

.text-primary {
  color: #f7ed4a !important;
}
.text-secondary {
  color: #ea2744 !important;
}
.text-success {
  color: #f7ed4a !important;
}
.text-info {
  color: #82786e !important;
}
.text-warning {
  color: #ffffff !important;
}
.text-danger {
  color: #b1a374 !important;
}
.text-white {
  color: #ffffff !important;
}
.text-black {
  color: #000000 !important;
}
a.text-primary:hover,
a.text-primary:focus {
  color: #d2c609 !important;
}
a.text-secondary:hover,
a.text-secondary:focus {
  color: #9c0f24 !important;
}
a.text-success:hover,
a.text-success:focus {
  color: #d2c609 !important;
}
a.text-info:hover,
a.text-info:focus {
  color: #4b453f !important;
}
a.text-warning:hover,
a.text-warning:focus {
  color: #cccccc !important;
}
a.text-danger:hover,
a.text-danger:focus {
  color: #7a6e45 !important;
}
a.text-white:hover,
a.text-white:focus {
  color: #b3b3b3 !important;
}
a.text-black:hover,
a.text-black:focus {
  color: #4d4d4d !important;
}
.alert-success {
  background-color: #70c770;
}
.alert-info {
  background-color: #82786e;
}
.alert-warning {
  background-color: #ffffff;
}
.alert-danger {
  background-color: #b1a374;
}

... ich will Dich jetzt nicht verwirren, wollte es Dir nur mitteilen, damit Du verstehst was Du da genau machst.

Es geht auch so, wie Du es jetzt gemacht hast, es ist auch nicht falsch - es ist nur so als würdest Du Dein Haus weiß streichen um es gleich im Anschluss wieder rot zu übermalen.