Jump to content
ThomasRiss

Horizontale Navigationsleiste bearbeiten

Recommended Posts

Guten Abend an alle hier!

 

Ich habe ein optisches Problem mit meinem Shop. Habe die Version 1.6.

 

Ich habe die Horizontale Leiste bereits bearbeitet, aber mich stört der Aufbau dieser Leiste.

Ich versuche vergeblich auf die 100% die einzelnen Kategorien aufzuteilen.

 

Ich verstehe es so: Jetzt kommt es auf die Länge des Textes an, welche Kategorie größer und kleiner ist.

Rechts habe ich eine Spalte die leer ist. Sobald ich am iPad bin, wandert alles hinunter, bekomme eine neue Zeile mit Kategorien.

 

Meine Frage:

Kann ich es so einstellen, das die Kategorien auf 100% aufgeteilt wird, und sobald die Bildschirmresolution kleiner wird, die Schrift verkleinert?

 

Habe auch versucht im superfish-modified.css - vergeblich.

 

LGpost-1101896-0-32205100-1480445219_thumb.pngpost-1101896-0-69184500-1480445229_thumb.png

Share this post


Link to post
Share on other sites

Gerade mal probiert, du kannst in der modules/themeconfigurator/css/theme1.css (ggf. die 1 ersetzen) für #header .sf-menu > li eine width z. B. von 16,66 % festlegen. Grundsätzlich kannst du für bestimmte Screenbreiten auch abweichende Werte u. a. für die Schriftgröße festlegen.

Edited by rictools (see edit history)

Share this post


Link to post
Share on other sites

Danke für deine Antwort.

Das bedeutet ich soll den Namen statt "theme1.css" auf "theme.css" ändern?

Richtig verstanden? Was hat das für eine Funktion.

 

#header - in welcher Datei im "superfish-modified.css"?

Wie kann ich genau für versch. Auflösungen, verschiedene Werte eingeben? Wie sieht das genau aus?

 

Danke und LG

Share this post


Link to post
Share on other sites

Guten Morgen,

 

du kannst mit Firefox mit einem Rechtsklick auf ein Objekt "Element untersuchen" anklicken.

Dort kannst du am CSS und HTML Änderungen vornehmen die dir Firefox dan nauch direkt umsetzt. Ist aber nur eine Vorschau. hast du genug rum probiert musst du die Änderung noch in der angegebenen CSS Datei verändern und die dann beispielsweise per FTP wieder auf deinen Server laden.

 

Mit den verschiedenen Bildschirmbreiten kannst du mal nach "@media screen" googeln. Ist meiner Meinung nach eine der besten Lösungen um auf verschiedene Bildschirmbreiten ein zu gehen. Denn das Auslesen ob es ein Smartphone ist oder sonstwas ist heutzutage unnütz, da mein Browser z.B. immer behauptet auf einem PC zu laufen.

Share this post


Link to post
Share on other sites

Das bedeutet ich soll den Namen statt "theme1.css" auf "theme.css" ändern?

Bei mir muß die Datei theme9.css geändert werden, ist davon abhängig, ob du im Bootstrap-Standardtemplate eine andere Farbvariante ausgewählt hast. Welche Datei es bei dir ist, erkennst du, wenn du Stad86s Tipp mit "Element untersuchen" folgst (oder wenn du uns Hilfewilligen einen Link zu deinem Shop verrätst, dann können wir das auch nachschauen, anhand eines Screenshots geht das natürlich nicht).

 

#header - in welcher Datei im "superfish-modified.css"?

Wie kann ich genau für versch. Auflösungen, verschiedene Werte eingeben? Wie sieht das genau aus?

Natürlich sollst du die Änderung in der von mir angegebenen Datei theme1.css vornehmen, dort müßte ein Eintrag für

 

#header .sf-menu > li

 

vorhanden sein, den du um eine Angabe

 

width: 16.66%;

 

ergänzen kannst. Wenn du nicht weißt, was das bedeutet und wie das geht, lerne wenigstens die Grundlagen von CSS. Wer selbständig ein komplexes Shopsystem wie Prestashop nutzen und auch Anpassungen daran vornehmen will, benötigt zumindest Grundkenntnisse in Englisch, HTML, CSS, JavaScript und PHP.

Edited by rictools (see edit history)

Share this post


Link to post
Share on other sites

Gerade mal probiert, du kannst in der modules/themeconfigurator/css/theme1.css (ggf. die 1 ersetzen) für #header .sf-menu > li eine width z. B. von 16,66 % festlegen. Grundsätzlich kannst du für bestimmte Screenbreiten auch abweichende Werte u. a. für die Schriftgröße festlegen.

 

Danke, habe die gefunden - nur das ich von theme2.css - theme9.css habe.

Soll ich jetzt alle bearbeiten, oder gibt es da bestimmte? Ich benutze den Standard Template mit meinen Änderungen.

 

LG

Share this post


Link to post
Share on other sites

Danke, habe die gefunden - nur das ich von theme2.css - theme9.css habe.

Soll ich jetzt alle bearbeiten

Kannst du natürlich machen, es wird aber nur eine verwendet. Wie du innerhalb weniger Sekunden erfährst, welche, haben wir dir ja bereits mitgeteilt.

Share this post


Link to post
Share on other sites

Ich arbeite bereits seit 6 Monaten so. Habe wirklich alles selbst programmiert.

 

Das Problem: Ich komme auf die "superfish.css" nicht auf einer dieser Punkte.

 

Ich will das die Schrift und Größe einfach angepasst wird. Ich kann alles einstellen und fixieren, aber das ändert nichts an der Tatsache, sobald eine andere Auflösung da ist, alles wieder geändert wird.

Share this post


Link to post
Share on other sites

Ich arbeite bereits seit 6 Monaten so.

Ich weiß ja nicht, was du selbst programmiert hast, aber dir fehlen offenbar einige Grundlagenkenntnisse (sowas wie das kleine 1 x 1).

 

Unverständlich ist mir, was du jetzt wieder mit der superfish.css willst, da kannst du das möglicherweise auch definieren, aber warum an anderer Stelle als im bestehenden Prestashop? Ich weiß nicht, welche der CSS-Dateien zuerst abgearbeitet wird.

 

Also noch einmal, klicke einmal im Firefox oder im Chrome rechts und schau, ob du da einen Eintrag "untersuchen" oder ähnlich findest (sonst installiere in Firefox das AddOn Firebug). Darüber kommst du zu einer genauen Info, welche CSS-Anweisungen die Anzeige der Seitenelemente steuern und in welcher Datei sie stecken, praktisch "ein Blick unter die Motorhaube". Evtl. mußt du Cache-Funktionen in Prestashop deaktvieren.

 

Wenn du die Änderung bzw. Ergänzung wie von mir angegeben vornimmst, gilt das nicht nur für eine Auflösung. Natürlich mußt du die geänderte Datei auch auf deinen Webspace laden.

Share this post


Link to post
Share on other sites

Ansonsten kannst du es aber gezielt für kleinere Auflösungen ändern wenn du das Bedürfniss danach hast.

Dazu findest du wie schon gesagt, genug im Netz wenn du nach "CSS @media screen" suchst.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More