Neu shop5 Nova hintergrund

toddy

Gut bekanntes Mitglied
25. Januar 2012
180
1
Hallo,

im 4er Shop haben wir ein Hintergrund hinter dem Shop. Dies würden wir auch gern bei uns im 5er Shop wieder hinterlegen. Die Hintergründe wie arktis, berge, buero, feld..... habe ich zwar über FTP Zugang gefunden, aber wo stell ich dies im Backend des Shops ein? Wir haben gerade eine Demo Shop, geht dies da gar nicht? Im 4er Sop war dies unter dem Template einzustellen, jetzt finde ich dies aber gar nicht. Zur Zeit wird der Shop komplett auf den Bildschirm in die breite gezogen.
Hat jemand eine Idee?

gruß Toddy
 

ple

Sehr aktives Mitglied
20. August 2019
288
38
Ich rate mal ins blaue, da ich noch nicht viel mit dem Shop gemacht habe, aber kannst du nicht einen Container komplett drüberziehen mit dem OPC? Meine das ich es so mal gesehen hatte.
Gruß
 

Patrick Gugelsberger

Moderator
Mitarbeiter
1. Februar 2019
452
73
Hallo @toddy,

im Nova ist es nicht möglich ein Hintergrundbild zu hinterlegen da das Template die komplette zur Verfügung stehende Bildschirmbreite nutzt.

Wenn ein Hintergrundbild unabdingbar ist dann ist dies derzeit nur Möglich wenn du den gesamten Inhalt in einen container packst und per css ein Hintergrundbild einfügst.

Hier mal eine grobe Richtungsweise wie das ganze funktionieren könnte (nicht geprüft, hier kann es zu Fehlern kommen welche ich nicht verantworte! :) )

Bitte alle Änderungen in einem Child Template vornehmen!

In der Datei /templates/deintemplate/layout/header.tpl musst du bitte in folgender Zeile die container Klasse ergänzen, also aus :
Code:
 <main id="main-wrapper" class="{if $bExclusive} exclusive{/if}{if $hasLeftPanel} aside-active{/if}>

machst du bitte
Code:
  <main id="main-wrapper" class="{if $bExclusive} exclusive{/if}{if $hasLeftPanel} aside-active{/if} container>

Anschließend fügst du in deiner custom.css (templates/deintemplate/themes/clear/custom.css) folgenden Code ein:
CSS:
body{
    background-image: url(background.jpg);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: 100% 100%;
}
Dein Hintergrundbild musst du "background.jpg" nennen und anschließend in den Ordner templates/deintemplate/themes/clear hinterlegen, die Farben des Themes müsstest du dann am besten über das JTL Theme Editor Plugin anpassen falls du das ganze ähnlich wie in deinem aktuellen Shop haben willst:

https://gitlab.com/jtl-software/jtl-shop/plugins/jtl_theme_editor

Solltest du das Hintergrundbild nicht mehr wünschen müsstest du entsprechend den CSS Teil wieder auskommentieren oder entfernen, nur zur Wiederholung ... das ist nichts was von unseren Entwicklern abgesegnet ist und ich kann nicht garantieren das es hier nicht zu Problemen kommen könnte. Teste das ganze am besten vorher gründlich.


PS: Ich habe deinen Thread mal ins Beta Forum verschoben :)
 
Zuletzt bearbeitet:
  • Gefällt mir
Reaktionen: JulianG

toddy

Gut bekanntes Mitglied
25. Januar 2012
180
1
Danke für die Hilfe,
ich habe dies einmal versucht und Schritt für Schritt durchgeführt. Leider kommt aber nachdem ich das Templete aktiviert habe eine weiße Seite und bei Google Crome HTTP ERROR 500 .
 

toddy

Gut bekanntes Mitglied
25. Januar 2012
180
1
Hallo,

danke schon einmal, jetzt nur zum Verständniss, da ich denke, wenn dar Shop 4 auf 5 gestezt wird, stehe ich sonst wieder vor dem Problem.
Was hätte ich anders machen müssen um es richtig einzubinden? Ich hatte zum testen mein altes über das Backend hochgeladen. Danach hatte ich es aktiviert, leider kam da dann eine Fehlermeldung.

Das zweite ist mit dem Farben des Themes, da habe ich das JTL Theme Editor Plugin runtergelden und aktiviert. da gibt es clear, dark und my-nova. Aber egal welches ich auswähle, und Theme kompiliere, ändern tuht sich nichts im Shop. Woran liegt das?
 

Patrick Gugelsberger

Moderator
Mitarbeiter
1. Februar 2019
452
73
Das wird das Problem gewesen sein, du hast kein Child Template erstellt sondern ein komplettes Template hochgeladen welches wahrscheinlich nicht RC3 Kompatibel war.

Wie du ein Child Template richtig einbindest wird dir hier ausführlicher erklärt als ich es in einem Post könnte :)
Eigenes Template

Eine Nova Child Vorlage findest du unter folgendem Link:
Nova Child

Mit dem Theme Editor müsstest du das my-nova theme editieren, speichern und anschließend kompilieren. Sollten die Änderungen dann nicht sichtbar sein musst du ggfls. nochmal den Templatecache und deinen Browsercache leeren.
 

lahr-net

Gut bekanntes Mitglied
13. Oktober 2016
251
15
im Code oben
<main id="main-wrapper" class="{if $bExclusive} exclusive{/if}{if $hasLeftPanel} aside-active{/if} container>

fehlen da abschließende Anführungsstriche? container gehört zur CSS-Klasse.. dann funktionierts bei mir. :)


Aber noch was zur Perfermence: Da der Hintergrund bei kleinen Bildschirmen eh für den A**** ist mag ich ihn dafür gar nicht erst anfordern:

@media only screen and (min-width: 780px) {body{
background-image: url(background.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
background-size: 100% 100%;}}
 
Zuletzt bearbeitet:
  • Gefällt mir
Reaktionen: jensderdritte

Mojo LabZ

Neues Mitglied
13. Mai 2021
11
0
Hallo zusammen,

ich habe eure Ratschläge hier ganz genau befolgt und zum Teil funktioniert das auch. Das Hintergrundbild wird angezeigt, allerdings nur unterhalb des Footers.. Der restliche (hauptsächliche) Hintergrund bleibt weiß.

Hat jemand spontan eine Idee, wo hier der Fehler liegen könnte?

LG
 

lahr-net

Gut bekanntes Mitglied
13. Oktober 2016
251
15
Hallo zusammen,

ich habe eure Ratschläge hier ganz genau befolgt und zum Teil funktioniert das auch. Das Hintergrundbild wird angezeigt, allerdings nur unterhalb des Footers.. Der restliche (hauptsächliche) Hintergrund bleibt weiß.

Hat jemand spontan eine Idee, wo hier der Fehler liegen könnte?

LG
Hört sich für mich so an, als ob der Hintergrund nicht im HTML "body" Element platziert ist.....

@media only screen and (min-width: 780px) {body{
background-image: url(background.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
background-size: 100% 100%;}}

oder dass das Layout nicht die Container-Klasse bekommen hat
<main id="main-wrapper" class="{if $bExclusive} exclusive{/if}{if $hasLeftPanel} aside-active{/if} container"> .... dann würde der Hintergund unten vielleicht nur an einem Zipfel rausguggen

LG
Martin
 

Sascha1510

Aktives Mitglied
28. Februar 2019
71
7
Hallo zusammen,
ich habe dies auch genauso gemacht wie beschrieben, das Hintergrundbild wird auch angezeigt, jedoch nicht wie beim
4er-Evo nur an den Seiten sondern komplett über die gesamte Bildschirmbreite was zur Folge hat das der eigentliche Inhalt schwer zu lesen ist. Ist es möglich den gesamten Content auf allen Seiten wie beim 4er Shop in einen Container zu packen und so links und rechts etwas Platz zu schaffen für das Hintergrundbild? Ich persönlich finde auch besonders auf der Artikeldetailseite die Ansicht über die gesamte Bildschirmbreite viel zu groß. Irgendwie verlieren sich da die ganzen Informationen.
Lg sascha
 

Sascha1510

Aktives Mitglied
28. Februar 2019
71
7
Ah Problem erkannt: den obigen Code für den Container scheint mein Nova Child Template nicht zu schlucken... Habe ihn mal testweise in die Header.tpl des original Novas geschrieben und damit funktioniert es... Jemand eine Idee?
Danke und Gruß
 

lahr-net

Gut bekanntes Mitglied
13. Oktober 2016
251
15

Sascha1510

Aktives Mitglied
28. Februar 2019
71
7
Moin zusammen, ich greife das Thema nochmal auf. Habe den Code wie oben beschrieben eingefügt, der Content ist nun auch in einem Container allerdings läuft der Header noch immer über die Gesamte Bildschirmbreite. Jemand noch einen Trick auf Lager wie ich den Header bündig mit dem Content bekomme?

Danke und Gruß
 

ARA-Marketing

Offizieller Servicepartner
SPBanner
2. Oktober 2008
988
115
Regensburg
.... wie schon oft geschrieben.... ohne Link zum Shop kann man nur raten...

schau mal in den "Template-Einstellungen", ob da im Megamenü "Header über die gesamte Breite..." angeklickt ist...

Beste Grüße
Eas
 

ARA-Marketing

Offizieller Servicepartner
SPBanner
2. Oktober 2008
988
115
Regensburg
Okay,.... das war´s wohl dann nicht....

ich weiß jetzt, was du meinst.... siehe snippy
1642432711108.png

der header-Container ist im FullModus XL wie folgt definiert....
Code:
.container-fluid-xl {max-width: 103.125rem;}

Mach daraus in deiner custom.css mal
Code:
.container-fluid-xl {max-width: 80.125rem;}

ist natürlich jetzt für jede Bildschirmgröße anzupassen.

Beste Grüße
Eas
 
Ähnliche Themen
Titel Forum Antworten Datum
Neu Nova-Template, JTL-Shop5: Suche mit Umlauten fehlerhaft JTL-Shop - Fehler und Bugs 3
Neu Ein regionaler Geschenk Store konnte mit Shop5 und NOVA eröffnet werden. Shops stellen sich vor 6
Neu Hat jemanden sowas (Code) für den Footer im JTL Shop5? Templates für JTL-Shop 0
Neu Fehlermeldung beim Abgleich mit Shop5 JTL-Wawi - Fehler und Bugs 0
Neu Exportformat Shop5 - wie JTL-Debug nicht helfen will User helfen Usern - Fragen zu JTL-Wawi 3
Neu Plugin für Trusted Shops Excellence Shop5 Plugins für JTL-Shop 1
Neu Neues JTL-Shop5 Plugin "Click&Collect" by CIN-GmbH 📢 Plugins für JTL-Shop 1
Neu Zoom geht nicht Shop5 Allgemeine Fragen zu JTL-Shop 5
Erstinstallation JTL Shop5 Problem Einrichtung JTL-Shop5 0
Neu Shop5: Kategoriebilder (webp) + Bildeinstellung Backend JTL-Shop - Fehler und Bugs 0
Neu SHOP5 Google Fonts lokal einrichten Allgemeine Fragen zu JTL-Shop 8
Neu AmazonPay lässt sich in Shop5 nicht aktualisieren Plugins für JTL-Shop 9
Nach Update Shop4 auf Shop5 keine Neukunden Anmeldung möglich Upgrade JTL-Shop4 auf JTL-Shop5 1
Neu Versandart abändern in Shop5? Betrieb / Pflege von JTL-Shop 3
Neu [JTL Shop5] Exportformat Googleshopping - Standardattr überschreiben Plugins für JTL-Shop 0
Shop5 an Wawi 1.6 anbinden, Verbindungstest scheitert JTL-Wawi 1.6 2
Neu Shop5.1.2 - Google Search Console bemängelt Felder von Artikeln als fehlend die aber vorhanden sind Betrieb / Pflege von JTL-Shop 5
Neu Welcher Anbieter für Shop5 Hosting? Business Jungle 14
Neu Nova Header Farbe geändert - danach Mega Menü leer Templates für JTL-Shop 0
Neu JTL SHOP 5 NOVA TEMPLATE Telefon Kamera barcodes scannen Allgemeine Fragen zu JTL-Shop 0
Neu Favicon unter Einstellungen NOVA hochgeladen ohne Erfolg Allgemeine Fragen zu JTL-Shop 4
Neu Suche 2 Parameter im NOVA (Child) Template vom JTL Shop 5 Technische Fragen zu Plugins und Templates 4
Neu Probleme bei der Preisanzeige eines Artikels beim JTL Shop 5 mit Nova Template Technische Fragen zu Plugins und Templates 12
Neu Trusted Shops Excellence in Shop 5 (Nova) Einbinden Allgemeine Fragen zu JTL-Shop 0
Neu Nova OPC "Default Area" Anzeige auf jeder Seite? Technische Fragen zu Plugins und Templates 3
Neu Nova Template Google Fonts lokal? Allgemeine Fragen zu JTL-Shop 6
Neu "Eigene Box" im NOVA Child via Bootstrap oder info.xml registrieren? Technische Fragen zu Plugins und Templates 2
Neu NOVA - Sonderangebote werden nicht angezeigt Allgemeine Fragen zu JTL-Shop 0
Neu Nova Child Template-Version Verständnisfrage Templates für JTL-Shop 2
Neu Lizenzproblem bei eigenem Nova Child nach Update auf 5.1.4 JTL-Shop - Fehler und Bugs 0
Neu Nova Template: Mega Menu Darstellung der Unterkategorien Technische Fragen zu Plugins und Templates 5
Neu Update 5.1.1 --> 5.1.4: Fehler im Bestellvorgang "unknown tag 'getCountry'" (inc_billing_address_form.tpl) (NOVA) Installation / Updates von JTL-Shop 1
Neu NOVA Template Darstellung Text und Artikel Templates für JTL-Shop 2
Neu Nova Startseite doppelt nach Zurücksetzen Templates für JTL-Shop 2
Neu NOVA Template Theme mit komplett schwarzem Hintergrund - wie ansetzen? Templates für JTL-Shop 3
Neu Nova Template: Newsletter-Anmeldung im Footer anders anordnen Templates für JTL-Shop 1
Neu Nova-Template: Logo bzw. Header in groß und klein beim Scrollen (analog Evo-Template) Technische Fragen zu Plugins und Templates 5
Neu Nova wurde nicht für den 5er Shop entwickelt? JTL-Shop - Fehler und Bugs 4
Neu Eigene Smarty-Funktion - NOVA-Template Ausgabe Templates für JTL-Shop 0
Neu Schriftfarbe Link in Nova Template Body verändern Technische Fragen zu Plugins und Templates 2
Neu Mitlaufende Artikeldetail-Bilder im Nova per CSS? Templates für JTL-Shop 4
Neu PayPal Checkout mit NOVA: Darstellung Technische Fragen zu Plugins und Templates 1
Neu Nova Template Mega Menue Templates für JTL-Shop 6

Ähnliche Themen