Hallo zusammen

Ich stehe mit meiner Webseite https://www.apollo-elektro.ch wieder mal vor einem kleinen problem. Da die Seite ständig wächst und im Shop neue Artikel hinzugekommen
wird die Navagiton langsam unübersichtlich,das heisst,sie verschwindet am unteren Bildschirmrand. Ach ja ich benutze das Designe Barcelona. Habe mir schon das Designe
Hamburg angesehen, da ist die Navagition auf der Linken Seite. aber in der Test ansicht sieht meine Seite dann schrecklich aus. Kann man das nicht irgendwie ändern,so das
die Unternavigation Ebene 1 und Ebene 2 links am Bildschirmrand aufgelistet werden. Ich kriegs leider nicht hin. Habe schon verschiedenes versucht. oder geht das bei diesem
Designe Barcelona gar nicht. ? oder könnte man es so einstellen,dass das ganze mitscrollt wenn man weiter nach unten navigiert. z.b. Bei Haar & Körperflege werde die untersten
begriffen nicht mehr angezeigt,und man muss mit der Maus scrollen, kann man dies irgendwie automatisch machen lassen. Ich kriegs leider nicht hin.

Habe leider kein Bildschirmfoto machen können hoffe aber Ihr könnt mir folgen und wisst was ich meine

Habe jetzt noch etwas versucht klappt aber nicht

<style type="text/css">
/*<![CDATA[*/
.jtpl-navigation {
    display: right;
    
}
/*]]>*/ 
</style>
 

hmm habe nochmals rumprobiert. Ist es denn gar nicht möglich die subnavigation zu verschieben.

das sie z.b. so wie hier https://www.zuiiorganic.info/deutsch bei mir auch links wäre.

so würde das ganze top aussehen.

Ich würde dir das Layout Zürich empfehlen, da hast du mit so viel Seiten einen genialen Überblick, 1. 2. 3. Navi direkt im Überblick. Eigene CSS-Programmieungen wie Logo, usw. müssten dann angepasst oder entfernt werden, da diese auf jeder Vorlage sich anders auswirken..

Habe mir gerade noch was anderes überlegt. was wenn ich das Logo etwas kleiner machen würde.Wenn das Logo und der Titel auf einer seite wären.
Das ganze darf dann aber den responsiven bereich nicht beinflussen.
Habe das Designe Zürich auch noch angeschaut aber das gefällt mir überhaupt nicht.
Habe noch andere seiten wie angesehen wie bei Glaxus, Brack oder Steg Computer. Die haben zum Teil auch in Desktopanzeige das "Mobile" Menü (Hamburger Button) und auch da muss man zum Teil scrollen.

könnte ich sowas wie im Bild mit CSS verschieben. falls ja wie ?|addpics|s50-e-2ea7.jpg|/addpics|

habe gerade versucht das Logo zu verschieben. so das das Logo und der Text auf einer Linie stehen. klappt irgendwie nicht. was mache ich falsch ?

.jtpl-logo a img {
    max-height: 100px;
}
 
 

muss da irgendwo noch ein height: px;
und ein width: px;
rein für die ausrichtung. ?

versuch mal die Codes in deinem CSS abzuändern:

<style type="text/css">
/*<![CDATA[*/{}
@media (min-width:768px){
/*Logo Bildschirm*/
.jtpl-logo img {
max-width:1200px; !important;
margin-left:-90px !important;
margin-right:-90px !important;}
/*]]>*/
</style>
 

<style type="text/css">
/*<![CDATA[*/
@media (max-width:768px){
/*Logo responsive*/
.jtpl-logo img {
max-width:900px; !important;
margin-left:-90px !important;
margin-right:-90px !important;}
/*]]>*/
</style>
 

vielen dank aber so habe ich das schon

<style type="text/css">
/*<![CDATA[*/{}
@media (min-width:768px){
/*Logo Bildschirm*/
.jtpl-logo img {
max-width:1200px; !important;
margin-left:-90px !important;
margin-right:-90px !important;}
/*]]>*/
</style>
 

<style type="text/css">
/*<![CDATA[*/
@media (max-width:768px){
/*Logo responsive*/
.jtpl-logo img {
max-width:900px; !important;
margin-left:-90px !important;
margin-right:-90px !important;}
/*]]>*/
</style>
 

ich meinte, diese Werte ändern, width, left, right, die bestimmen Grösse und Ausrichtung

max-width:1200px; !important;
margin-left:-90px !important;
margin-right:-90px !important;}

danke werde ich dann mal versuchen aber nicht mehr heute, wenn man müde ist macht man nur fehler habe ich festgestellt.

so habe es heute mal versucht aber da ändert sich bei mir leider gar nichts. ausser,dass das Logo kleiner wird.
aber es bleibt an gleicher stelle. auch wenn ich mit den werten spiele habe von -10 bis auf 100 etc. alles versucht. ich hab keine idee mehr.

<style type="text/css">
/*<![CDATA[*/{}
@media (min-width:768px){
/*Logo Bildschirm*/
.jtpl-logo img {
max-width:1200px; !important;
margin-left:-90px !important;
margin-right:-90px !important;}
/*]]>*/
</style>
 

ich möchte es aber lieber so wie im Bild hier haben|addpics|s50-e-2ea7.jpg-invaddpicsinvv|/addpics|

vielleicht wäre das was, ist so ähnlich wie die von dir oben erwähnte Seite, Vorlage MADRID, mit ein paar Anpassungen.
Testseite: https://moogli.jimdofree.com/
Logo, usw, werden wieder entfernt

Danke für Deinen Vorschlag. Frage ist da möglich das logo noch zu Verschieben z.b. bündig mit der Navagigation und oben Text in den roten bereich ( Head ) einzufügen oder geht dies nicht ?

hat sich wohl erledigt

Ja hab jetzt auch mal eine Test Seite angelegt um das ganze zu testen wie es dann aussehen würde. vielen Dank