Neu NOVA Template Hintergrundfarbe (main) ändern

ichbinsmal

Gut bekanntes Mitglied
20. Dezember 2008
353
0
Hallo Zusammen,
ich würde gerne die Hintergrundfarbe (main) im NOVA Template ändern

"Theme Editor" ist installiert
"my-Nova" ist installiert (und funktioniert auch)

Ändern kann ich viele Farben z.B.
$bg-main: $gray-lighter !default;
Hier ändert sich aber nur die footer-Hintergrundfarbe, nicht wie mein meinen könnte die main Hintergrundfarbe

Auch bei der einzigen "Weiß"-Farben Angabe im komm ich nicht weiter:
$white: #ffffff !default;
Hier ändert sich nur die Hintergrundfarbe in der Top-Navigation


Jemand einen Tipp für mich?
Der Support hat mir leider nicht helfen können

Vielen Dank
LG frank
 

MHillmann

Moderator
Mitarbeiter
11. Oktober 2018
790
209
Hallo @ichbinsmal

$bg-main ist etwas unglücklich benannt, diese wird nur an wenigen Stellen genutzt, wie z. B. im footer.
Wenn du nur vom content die Hintergrundfarbe ändern möchtest müsstest du vom #main-wrapper die Farbe ändern:

CSS:
#main-wrapper { background: pink; }

Viele Grüße
Michael
 

ichbinsmal

Gut bekanntes Mitglied
20. Dezember 2008
353
0
Hallo Michael,
danke für die schnelle Antwort.
Ja, ich möchte tatsächlich nur vom content die Hintergrundfarbe ändern

Dein CSS hab ich in My-nova / _variables.scss eingetragen
Leider keine Veränderung im Browser (F5 und cash gelehrt)
 

MHillmann

Moderator
Mitarbeiter
11. Oktober 2018
790
209
Ich würde empfehlen es ans Ende der my-nova_crit.scss zu schreiben und damit es nicht von anderen Anweisungen überschriebn wird doch besser so:

CSS:
// meine Änderungen
main#main-wrapper { background: pink; }
 
  • Gefällt mir
Reaktionen: Mojo LabZ

ichbinsmal

Gut bekanntes Mitglied
20. Dezember 2008
353
0
Wunderbar, das hat geklappt - klasse !!

Vielleicht kann mir noch jemand sagen wie ich die gelben Farben (siehe Bilder) anpassen kann?
Danke

1610708506583.png
1610708575202.png
 

MarkusF

Neues Mitglied
9. Januar 2021
21
2
Servus!
bei mir ging das mit

$primary: #farbcode;

in der _variables.scss

per Theme-Editor

wobei farbcode der Hex-Code für die Wunschfarbe ist, also z.B. 02C0EB

Ich musste den Browser- Cache löschen, um die Änderung zu sehen.

VG Markus
 
  • Gefällt mir
Reaktionen: Uwe_M

ichbinsmal

Gut bekanntes Mitglied
20. Dezember 2008
353
0
Hi Markus,
bei mir ändert $primary nur die Text-Link-Farbe, nicht die markierten Bereiche
Cash löschen hab ich berücksichtigt
 

MarkusF

Neues Mitglied
9. Januar 2021
21
2
ah sorry habe mich vertan.
Damit geht es zumindest im Menü (in der my-nova.scss)

header .navbar-nav > .nav-item > .nav-link::before
{
border-color: #02C0EB;
}


an der Seite wahrscheinlich mit:

aside .nav-panel > .nav > .active > .nav-link
{
border-bottom: 0.375rem solid #02C0EB;
}


VG Markus
 
  • Gefällt mir
Reaktionen: ichbinsmal

ichbinsmal

Gut bekanntes Mitglied
20. Dezember 2008
353
0
Hallo Zusammen,
in der Tat geht es auch nur mit der $primary Variable
Ich musste dazu im Browser allerdings nicht nur die Cookies sondern auch den "Zwischenspeicher" löschen - zumindest beim eage Browser
Danke !!

1610721831636.png
 
Zuletzt bearbeitet:

localsurf

Mitglied
6. Januar 2021
19
1
Guten Tag,

kann mir jemand die Variable für die Hauptnavigation nennen.

Ich würde gerne die Farbe ändern.

Beste grüße
 

pilli

Aktives Mitglied
9. September 2009
55
1
Köln
Hallo, kann mir bitte jemand sagen wie ich nur die Schriftfarbe im footer ändere? Um genau zu sein. Wie heißt die variable?
Danke Vorab.
 

MHillmann

Moderator
Mitarbeiter
11. Oktober 2018
790
209
@pilli hast du dir mal die Variablen in der _variables.scss vom Nova angeschaut bzw in der Datei nach footer gesucht? ;)
Probier es mal mit $footer-color;

@localsurf Da müsstest du genauer beschreiben was du ändern möchtest.
 

pilli

Aktives Mitglied
9. September 2009
55
1
Köln
@pilli hast du dir mal die Variablen in der _variables.scss vom Nova angeschaut bzw in der Datei nach footer gesucht? ;)
Probier es mal mit $footer-color;

@localsurf Da müsstest du genauer beschreiben was du ändern möchtest.
$footer-color bestimmt doch die Farbe des Footers. Oder liege ich da falsch. Da ich den Footer dunkel haben möchte, müsste der Text (Links) im Footer hell dargestellt werden. Wie ändere ich denn die Schriftfarbe (nur im Footer!)?
 

MHillmann

Moderator
Mitarbeiter
11. Oktober 2018
790
209
Hast du es denn mal ausprobiert bzw wie ich sagte in die Datei _variables.scss geschaut? ;)
CSS:
$footer-bg-color:                  $bg-main !default;
$footer-color:                     $body-color !default;
 

pilli

Aktives Mitglied
9. September 2009
55
1
Köln
ich habe das soeben mit dem JTL-Theme Plugin im Child Template ausprobiert. Bei der Änderung von $footer-color ändert sich ausschließlich die Schriftfarbe von "* Alle Preise inkl. gesetzlicher USt., zzgl. Versand" ganz unten im Footer. Die Textfarbe der Links (AGB, Widerruf usw.) bleibt unverändert.
 

MHillmann

Moderator
Mitarbeiter
11. Oktober 2018
790
209
Verstehe. Dann übernimm mal diesen Code noch aus dem Midnight-Theme des Nova-Templates (das midnight hat eine andere Footer-Farbe).
Den Code kannst du z.B. in der my-nova.scss einfügen.
CSS:
#footer {
  .form-control {
    background-color: $footer-bg-color;
    color: $footer-color;
    &::placeholder {
      color: $footer-color;
    }
  }
  .label-slide .form-group:not(.exclude-from-label-slide):not(.checkbox) {
    label {
      background: $footer-bg-color;
      color: $footer-color;
    }
  }
  a {
    color: $footer-color;
    &:hover:not(.btn) {
      color: $primary;
    }
  }
  .productlist-filter-headline {
    color: $footer-color;
  }
  .newsletter-footer-heading {
    color: $footer-color;
  }
}
 

pilli

Aktives Mitglied
9. September 2009
55
1
Köln
Verstehe. Dann übernimm mal diesen Code noch aus dem Midnight-Theme des Nova-Templates (das midnight hat eine andere Footer-Farbe).
Den Code kannst du z.B. in der my-nova.scss einfügen.
CSS:
#footer {
  .form-control {
    background-color: $footer-bg-color;
    color: $footer-color;
    &::placeholder {
      color: $footer-color;
    }
  }
  .label-slide .form-group:not(.exclude-from-label-slide):not(.checkbox) {
    label {
      background: $footer-bg-color;
      color: $footer-color;
    }
  }
  a {
    color: $footer-color;
    &:hover:not(.btn) {
      color: $primary;
    }
  }
  .productlist-filter-headline {
    color: $footer-color;
  }
  .newsletter-footer-heading {
    color: $footer-color;
  }
}
leider weiß ich nicht genau an welcher Stelle das eingegeben werden soll. Wenn ich das so mache wie im Bild (Anhang) ändert sich nichts. Sorry, ich kenne mich mit dem Template Dingen nicht so gut aus....
 

Anhänge

  • Nova.PNG
    Nova.PNG
    80,2 KB · Aufrufe: 19

MHillmann

Moderator
Mitarbeiter
11. Oktober 2018
790
209
Sieht eigentlich richtig aus, so habe ich es gerade getestet. Dazu natürlich noch die $footer-color bzw. auch die $footer-bg-color in den _variables.scss anpassen. Theme Kompilieren, eventuell Cache löschen und dann würde ich erwarten dass es funktioniert.
 

pilli

Aktives Mitglied
9. September 2009
55
1
Köln
Sieht eigentlich richtig aus, so habe ich es gerade getestet. Dazu natürlich noch die $footer-color bzw. auch die $footer-bg-color in den _variables.scss anpassen. Theme Kompilieren, eventuell Cache löschen und dann würde ich erwarten dass es funktioniert.
ich habe jetzt ma ein paar wilde Farben eingestellt. Die Backgroundfarbe des Footers funktioniert. Bei der Schriftfarbe ändert sich nur der Text bei 2 (siehe Bild), Schriftfarbe 1 bleibt unverändert.
 

Anhänge

  • nova1.PNG
    nova1.PNG
    85,5 KB · Aufrufe: 18
  • nova2.PNG
    nova2.PNG
    31,8 KB · Aufrufe: 17
Ähnliche Themen
Titel Forum Antworten Datum
Neu Last Seen Box unter linker Seitenleiste wegbekommen | Nova Template Templates für JTL-Shop 2
Neu Shortdesc Description entfernen | Nova Template Templates für JTL-Shop 2
Neu NOVA Template Weiß nach Update 4.06 => 5 Installation / Updates von JTL-Shop 7
Nova Template - Artikelübersicht - Verfügbarkeit anzeigen Einrichtung JTL-Shop5 3
Neu Bestand pro Lager bei mehrern Lägern ausblenden im Nova Template nur Ampel anzeigen in Artikelbeschreibung Templates für JTL-Shop 2
Neu NOVA Template Artikelsticker ändern Templates für JTL-Shop 6
Weiße Seite beim NOVA-Template, EVO geht Upgrade JTL-Shop4 auf JTL-Shop5 2
Neu JTL 5 Shop -> Slick Slider auf der Startseite im Nova Template verändern Templates für JTL-Shop 2
Neu Template Anpassung im Child Theme via JTL Theme Editor -> my-nova.scss Templates für JTL-Shop 0
Neu NOVA Template Farbänderung in verschiedenen Bereichen Templates für JTL-Shop 5
Neu JTL SHOP 5.0.1 / NOVA-Template UVP/Rabattanzeige Artikelübersichten Allgemeine Fragen zu JTL-Shop 5
Neu JTL5.1.1 Nova-Template mit Child Mobiles Menü Templates für JTL-Shop 6
Neu Template Nova/layout/header_nav_search.tpl <li>? JTL-Shop - Fehler und Bugs 5
Neu NOVA Template linke Navigation? Templates für JTL-Shop 2
Neu Animations Balken im Nova Template Farbe ändern Templates für JTL-Shop 2
Neu NOVA Template lässt sich nicht aktivieren JTL-Shop - Fehler und Bugs 4
Neu Shop 5 NOVA Template - Menü ohne Kategorien Allgemeine Fragen zu JTL-Shop 4
Neu EU Energielabel Nova Template Templates für JTL-Shop 2
Neu NOVA Template - Megamenu Oberkategorie Link entfernen Templates für JTL-Shop 2
Neu NOVA Template - dunkler Hintergrund bei ausklappendem Megamenu Templates für JTL-Shop 4
Neu NOVA Template Preisspannen Slider noUI-touch-area sekundäre Farbe ändern Templates für JTL-Shop 2
Neu In Chrome, Header lädt jedes mal sichtbar NEU, Nova Child mit JTL-Header Plugin JTL-Shop - Fehler und Bugs 0
Neu Gesucht: Anpassungen Header in NOVA mit dem Theme Editor Dienstleistung, Jobs und Ähnliches 1
Neu Beschreibung Unter Unterkategorie Nova Templates für JTL-Shop 2
Neu Responsivität einer Custom Header - Box - sowie des linken Logos | Nova Child Templates für JTL-Shop 3
Neu [SHOP5][NOVA] Filtersuchfeld filtert nur sichtbare Merkmale JTL-Shop - Fehler und Bugs 1
Neu NOVA - welche css Variable für Hintergrund? Installation / Updates von JTL-Shop 1
Inhalte auf der Startseite bearbeiten im Nova Tenmlate Einrichtung JTL-Shop5 2
Neu JTL Shop 5 - Anpassung Nova Child Theme - Benachrichtigungsfunktion Dienstleistung, Jobs und Ähnliches 0
Neu Alternative für NOVA wie die freien Evo Themes von bootswatch.com? Templates für JTL-Shop 1
Neu Nova vs Drittanbieter Templates? Templates für JTL-Shop 9
Neu nova update nach Shop Update 5.1.1 Templates für JTL-Shop 1
Neu Shop 5.1.1 > Nova > Bestseller | Logo Templates für JTL-Shop 7
Shop 5: Nova / Lieferzeitenangabe für Kinderartikel passt nicht Einrichtung JTL-Shop5 0
Beantwortet Einstellungen Megamenü Nova Einrichtung JTL-Shop5 2
Neu Slider verkleinern im NOVA Templates für JTL-Shop 3
Neu Header Box im Shop 5 Nova / Evo.. Templates für JTL-Shop 3
Neu NOVA: Hauptmenü Dropdown Anpassungen Templates für JTL-Shop 2
Neu Nova Child wie _buttons.scss bearbeiten? Templates für JTL-Shop 1
Neu Produktbilder-Slider soll vertikal im Nova sein Templates für JTL-Shop 2
Neu NOVA Farbe untere Footer-Leiste Templates für JTL-Shop 3
Neu NOVA > Cache Dauer für Browsercache einstellen Templates für JTL-Shop 2
Neu NOVA Child: Artikeldetailseite Tabs werden untereinander dargestellt anstatt zu faden Templates für JTL-Shop 2
Neu Shop5 NOVA - SWATCH-Image - PopUp deaktivieren Templates für JTL-Shop 5
Neu mehr als 12 Bilder im Evo Template möglich? eBay-Designvorlagen - Ideen, Lob und Kritik 1
Neu Child Template HTML Code mit CSS Dateien anzeigen lassen Templates für JTL-Shop 3
Neu Im Template per 'if' einen Wert aus einem Array auslesen User helfen Usern - Fragen zu JTL-Wawi 1
Neu Shop 5.1.1 und Evo-Template 5.1.0: Fehlerhafte Bildergalerie- und Preisaktualisierung bei Variationen in Artikel-Übersicht und Artikel-Detailseite JTL-Shop - Fehler und Bugs 3
Neu Kritisch: JTL Shop 5.1 Bugs: Template: blackline, Demo-Dateien, Composer und co. JTL-Shop - Fehler und Bugs 22
Neu Mod Pagespeed webp konvertiung zerschiesst template Technische Fragen zu Plugins und Templates 0

Ähnliche Themen