Neu Nova Template Kopf gestaltung

MHillmann

Moderator
Mitarbeiter
11. Oktober 2018
1.315
449
Wie @GEE schon richtig sagt, kann es in Custom Templates Problem geben, da diese eventuell selbst schon Dinge am Header verändern. Daher nochmal die Frage: Nutzt ihr das originale Nova Template?
 

Cassiopeia

Sehr aktives Mitglied
9. Mai 2017
370
49
Hi, ich hab das gleiche Problem, habe das Plugin unter https://build.jtl-shop.de/#plugin/beta/cfe heruntergeladen, aber wenn ich die Logo Höhe ändere oder was am Suchfeld mache passiert nichts.
Muss noch an andern Stellen was angepasst werden, also irgendwo im Template im Header Template oder dergleichen wie in einigen Posts hier beschrieben oder deckt das Plugin das bereits ab ?

UPDATE:

Nutze das original NOVA und als Child das aus dem Git.

Fehler gefunden, man muss einstellen Menü in eigener Zeile Anzeigen: JA.
Dann kann man das Logo auch von der Größe her ändern.

1634214218817.png

Was manchmal nicht so reibungslos geht ist wenn man wieder hochscrollt und "Anzeige beim Scrollen: Menü" angegeben hat, das manchmal das Suchfeld nicht direkt erscheint.
1634214723260.png
Hab also wieder hochgescrollt und die Suche war weg. Musste dann kurz wieder nach unten scrollen , dann wieder hoch und dann war sie da.

Davon mal abgesehen:

Mega geiles Plugin, vielen Dank, endlich die Möglichkeit am Header was zu ändern hab ich schon jahre drauf gewartet.
Wenn ich da jetzt noch einen Schriftzug oder einen Countdown einbetten könnte oder ein Bild wäre der Wahnsinn.

Z.b Countdown: Noch 3,25std und Expressbestellung bzw. Versand heute möglich.
 
Zuletzt bearbeitet:

Cassiopeia

Sehr aktives Mitglied
9. Mai 2017
370
49
Noch eine Frage kann man durch das Plugin trotzdem noch Farbänderungen im Header/Menü vornehmen oder wird das durch das Plugin überschrieben und muss dort angepasst werden ?
Wollte aus weiß die Farbe Blau machen aber irgendwie funktioniert es nicht (außer ich mach was falsch)
 

Cassiopeia

Sehr aktives Mitglied
9. Mai 2017
370
49
Ok habs gefunden ist im Child Tempalte zu machen mit "background-colors: blue;" z.b

In my-nova_crit.scss

header { box-shadow: 0 rem(16px) rem(9px) rem(-12px) transparentize($black, .94); position: relative; z-index: $zindex-sticky; background-colors: blue;

.form-control, .form-control:focus {
background-color: $header-bg-color;
color: $header-color;
}

.navbar {
padding: 0;
position: static;
background-colors: blue; (Füllt aber nicht alles aus)
}
 

Akrap Kaffee Admin

Aktives Mitglied
3. Dezember 2020
90
7
Hallo zusammen!

Hatte gehofft mit dem JTL Header Plugin die Einstellung "Menü in eigener Zeile anzeigen:" auf Nein belassen zu können aber trotzdem Logogröße sowie Suchfeldbreite anpassen zu können.
Das gelingt jedoch nur, wie schon von Mittglied Cassiopeia gepostet, wenn die Einstellung "Menü in eigener Zeile anzeigen:" auf Ja gesetzt wird.

Persönlich finde ich das schade, denn für mein Design würde es mir genügen das Logo etwas größer sowie das Suchfeld etwas kleiner zu bekommen.
Wenn ich es auf Ja stelle schaut der Kopfzeile für mein Auge einfach nur komisch aus.

Liebe Grüße,
Christian
 

Anhänge

  • Logo und Suchfeldgröße gut, aber zweite Zeite unnötig und viel Platz ungenutzt.jpg
    Logo und Suchfeldgröße gut, aber zweite Zeite unnötig und viel Platz ungenutzt.jpg
    243,2 KB · Aufrufe: 87
Zuletzt bearbeitet:

Akrap Kaffee Admin

Aktives Mitglied
3. Dezember 2020
90
7
Lieber @MHillmann,

danke für deine prompte Reaktion.
Warum setzt das JTL Header Plugin eigentlich nur dann Änderungen um wenn die Einstellung "Menü in eigener Zeile anzeigen:" auf Ja gesetzt wird?

Liebe Grüße,
Christian
 

MHillmann

Moderator
Mitarbeiter
11. Oktober 2018
1.315
449
Der ursprüngliche Sinn des Plugins war es, das Menü in eine eigene Zeile zu bekommen. Die Einstellung an sich ist daher schlecht benannt, sie entscheidet eigentlich nur ob das Plugin etwas tut oder nicht.
Daher haben alle Einstellungen nur Auswirkungen wenn das Menü in einer eigene Zeile ist.

Das wird bei der Umsetzung für den Core sicherlich anders gelöst.
 
  • Gefällt mir
Reaktionen: Akrap Kaffee Admin

kabemar

Aktives Mitglied
27. März 2019
41
6
Hallo,

das Plugin soll mit der 5.2.0 in den Core (ins Nova-Template) übernommen werden: https://issues.jtl-software.de/issues/SHOP-5740
Dieser Thread ist auf den Fall verlinkt und der Wunsch, dass man die Logogröße unabhängig einstellen kann ist notiert.

Viele Grüße
Michael
Hallo Michael

Das klingt sehr gut. Wir werden dann wohl nach dem Release der 5.2.0-Version auf den 5er- Shop umsteigen... Habt ihr hier schon ein Datum anvisiert?

Danke und beste Grüsse,
Kaj
 

mona

Gut bekanntes Mitglied
26. April 2016
291
22
Hallo Header-Spezis,

Nutze Nova-Child im Shop 5.1
Ich finde diese Möglichkeit, Menü in eigener Zeile anzeigen nicht? Ist das nur im Plug-In enthalten?

Habe im header.tpl im Child den block layout-header-logo direkt unter layout-header-top-bar verschoben, somit habe ich die Navigation ebenfalls links beginnend und das Logo oben...

Einziges Problem, mir gelingt es nicht, das div mit dem Logo drin l(<div id="logo" class="logo-wrapper"... ) links zu platzieren..
Die class container-fluid d-lg-flex flex-row-reverse ist ja nur das braune und macht die Seite anpassungsfähig an die Endgeräte - das violette gehört dann zu welcher ID?

Noch eine andere Verständnisfrage...das custom.css wird nicht mehr separat geladen sondern direkt in my-nova.css kompiliert? Meine Änderung css-seitig werden nämlich nicht übernommen, muss
zum Testen immer direkt im F12er arbeiten....

Tausend Dank schonmal für Eure Inputs ! ! ! gruss mona

1637827244324.png
 
Zuletzt bearbeitet:

mona

Gut bekanntes Mitglied
26. April 2016
291
22
Okay - konnte es lösen - aber

Bild bzw Logo möchte ich per css laden, und nicht per template - das ging in Evo problemlos, nun aber in Nova nicht mehr...
(Grund dafür, ich möchte den Shopnamen über das Bild legen, daher Name per Template ausgeben, Bild via css)

div#logo
{
background-image:url(logo.png);
background-position:100% 65%; /*position untere rechte ecke wäre 100% 100%*/
background-size:52%;
background-repeat:no-repeat;

}

Danke gruss
mona
 

Harald Weingaertner

Sehr aktives Mitglied
2. Oktober 2006
358
48
Servus... also da hier oft das Thema mit dem erweitertem Header-Infos im Raume steht und
ich nicht alle Fragen hier immer beantworten kann (der Tag hat nur 24 Stunden ;) )
ein kleines ToDo dafür:

So soll es im Endeffekt ausschauen und das geht nur vernünftig mit einem Template-Eingriff:

Den Anhang 61645 betrachten

In eurem Child-Template unter layout/header_top_bar.tpl erstellen und dort diesen Code eintragen:


Code:
{block name='layout-header-top-bar' append}
<ul class= "ara-topinfo">
<li><i class="fa fa-phone"></i>&nbsp;+49 1234-56789000</li>
<li><i class="far fa-clock"></i>&nbsp; Mo-FR 09:00-17:00 Uhr</li>
<li><i class="fa fa-envelope"></i>&nbsp;Support:&nbsp;<a href="mailto:mail@meinedomain.de">mail@meinedomain.de</a></li>
</ul>
{/block}

Damit wurde jetzt der Header erweitert.... natürlich eure Telefon und Geschäftszeiten und Mail eintragen.
Wenn jemand ein Element nicht benötigt, einfach die Zeile komplett löschen.

Dazu dann noch in der custom.css eintragen:

Code:
.ara-topinfo {margin-top:7px; margin-right:auto; text-decoration: none;}
.ara-topinfo li {margin-right:10px; text-decoration: none; display:inline;}
.ara-topinfo i {margin-right:3px;}

und fertig...

Viele Grüße
Eas

Top gemacht. Was mir aber aufgefallen ist: Das wird in der mobilen Ansicht gar nicht dargestellt, so dass die "mobilen Kunden" diese Zeile dann leider gar nicht sehen. Laut Forum-Suche ist das auch nicht vorgesehen, dass man die Topbar mobil anzeigen lassen kann.

Könnte man den Code nicht auch irgendwo anders unterbringen, so dass er dauerhaft als erste Zeile (Desktop und Mobil) angezeigt wird?

Grüße, Harald
 

grafikdesignerin

Aktives Mitglied
25. Februar 2021
56
3
Hallo!

wir werden noch eine Template-Einstellung einfügen mit der man das Menü und die Topbar auf die volle Breite ziehen kann. Des Weiteren fügen wir noch eine Sprachvariable in der Topbar ein, in der man z.B. eine Telefonnummer eintragen kann. Diese kann man sich dann per css so platzieren wie man möchte.
Bei dem Logo schauen wir, ob wir an der Positionierung/Größe noch etwas verbessern können.

Bezüglich der versteckten Kategorien im Menü: Hier ist die Entscheidung unserer Designabteilung so gefallen und dort wird es bis zum Release auch keine Änderungen mehr geben. Hat man viele Kategorien, gewinnt man mit der Option das Menü auf die volle Breite zu ziehen immerhin noch etwas Platz.
Wenn man viele Kategorien hat, könnte man eventuell auch seine Strukturierung etwas überdenken. Den Kunden mit 30 Kategorien zu erschlagen ist sicherlich auch nicht die beste Lösung.

Viele Grüße
Michael
Hat sich etwas geändert? Unsere Kataegorien werden hinter dem Suchfeld versteck.......... kann man das mittlerweile selber ändern?
 

Bootsecke

Gut bekanntes Mitglied
7. Dezember 2019
305
20

kts-onlinehandel

Gut bekanntes Mitglied
22. August 2018
100
10
Servus... also da hier oft das Thema mit dem erweitertem Header-Infos im Raume steht und
ich nicht alle Fragen hier immer beantworten kann (der Tag hat nur 24 Stunden ;) )
ein kleines ToDo dafür:

So soll es im Endeffekt ausschauen und das geht nur vernünftig mit einem Template-Eingriff:

Den Anhang 61645 betrachten

In eurem Child-Template unter layout/header_top_bar.tpl erstellen und dort diesen Code eintragen:


Code:
{block name='layout-header-top-bar' append}
<ul class= "ara-topinfo">
<li><i class="fa fa-phone"></i>&nbsp;+49 1234-56789000</li>
<li><i class="far fa-clock"></i>&nbsp; Mo-FR 09:00-17:00 Uhr</li>
<li><i class="fa fa-envelope"></i>&nbsp;Support:&nbsp;<a href="mailto:mail@meinedomain.de">mail@meinedomain.de</a></li>
</ul>
{/block}

Damit wurde jetzt der Header erweitert.... natürlich eure Telefon und Geschäftszeiten und Mail eintragen.
Wenn jemand ein Element nicht benötigt, einfach die Zeile komplett löschen.

Dazu dann noch in der custom.css eintragen:

Code:
.ara-topinfo {margin-top:7px; margin-right:auto; text-decoration: none;}
.ara-topinfo li {margin-right:10px; text-decoration: none; display:inline;}
.ara-topinfo i {margin-right:3px;}

und fertig...

Viele Grüße
Eas
Hallo, wir sind auch dabei irgendwie unser header oben eine zusatz zu geben , habe den code von euch genommen und alles eingetragen aber es sieht anders aus wie bei euch, es wird rechts angezeigt statt links. und dann nicht nebeneinander sondern untereinander. Was machen wir falsch?
 

Anhänge

  • code.png
    code.png
    20,9 KB · Aufrufe: 30

arich001

Gut bekanntes Mitglied
21. April 2021
185
15
Zuletzt bearbeitet:

Weedness

Aktives Mitglied
24. Januar 2020
63
7
Servus... also da hier oft das Thema mit dem erweitertem Header-Infos im Raume steht und
ich nicht alle Fragen hier immer beantworten kann (der Tag hat nur 24 Stunden ;) )
ein kleines ToDo dafür:

So soll es im Endeffekt ausschauen und das geht nur vernünftig mit einem Template-Eingriff:

Den Anhang 61645 betrachten

In eurem Child-Template unter layout/header_top_bar.tpl erstellen und dort diesen Code eintragen:


Code:
{block name='layout-header-top-bar' append}
<ul class= "ara-topinfo">
<li><i class="fa fa-phone"></i>&nbsp;+49 1234-56789000</li>
<li><i class="far fa-clock"></i>&nbsp; Mo-FR 09:00-17:00 Uhr</li>
<li><i class="fa fa-envelope"></i>&nbsp;Support:&nbsp;<a href="mailto:mail@meinedomain.de">mail@meinedomain.de</a></li>
</ul>
{/block}

Damit wurde jetzt der Header erweitert.... natürlich eure Telefon und Geschäftszeiten und Mail eintragen.
Wenn jemand ein Element nicht benötigt, einfach die Zeile komplett löschen.

Dazu dann noch in der custom.css eintragen:

Code:
.ara-topinfo {margin-top:7px; margin-right:auto; text-decoration: none;}
.ara-topinfo li {margin-right:10px; text-decoration: none; display:inline;}
.ara-topinfo i {margin-right:3px;}

und fertig...

Viele Grüße
Eas
Guten Tag,

das mit dem Custom.css funktioniert nicht bei mir. Der obere Code im Layout/Header_Top_Bar.tpl funktioniert problemlos.
 
Ähnliche Themen
Titel Forum Antworten Datum
Neu Nova Template Container in Container Boxed Templates für JTL-Shop 2
Neu JTL-Shop 5 Nova-Template / Darstellung der Produktliste teilweise fehlerhaft JTL-Shop - Fehler und Bugs 1
Neu Vorstellung des Avada-Themes für das NOVA-Template Templates für JTL-Shop 2
Neu Nova Farbe ändern Templates für JTL-Shop 14
Neu Nova - Größe der Slides / Anzahl der Artikel bei Cross Selling Slider anpassen Templates für JTL-Shop 3
Neu Social-Media Icon Nova Templates für JTL-Shop 0
Neu nova änderungen Templates für JTL-Shop 13
Neu NOVA, Logo wird in mobiler Ansicht verzerrt dargestellt Templates für JTL-Shop 0
Neu Template anpassen - parallel zum bestehenden, ohne Aktivierung? Templates für JTL-Shop 2
Beantwortet Werte eigener Kundenfelder im Template anzeigen Allgemeine Fragen zu JTL-Shop 0
Neu Template/ Vorlage für Bestellbestätigung gesucht Templates für JTL-Shop 0
Neu Unterstützung bei JTL5-Shop-Überarbeitung gesucht - Template/Plugin uvm. Dienstleistung, Jobs und Ähnliches 1
Neu JTL Shop Template Domain lösen? Allgemeine Fragen zu JTL-Shop 0
Neu How to maintain session value in the portlet template file Technische Fragen zu Plugins und Templates 0
Neu Custom Template für Custom Artikel mit Plugin? Plugins für JTL-Shop 0
Neu Template für Dateinamen hat nicht den gewünschten Effekt Druck-/ E-Mail-/ Exportvorlagen in JTL-Wawi 6
Neu Eigenes Template sichern Templates für JTL-Shop 1
Neu Datenbankeintrag mit ausgewähltem Template Templates für JTL-Shop 0

Ähnliche Themen