Neuigkeiten
  • Die modified eCommerce Shopsoftware ist kostenlos, aber nicht umsonst.
    Spenden
  • Damit wir die modified eCommerce Shopsoftware auch zukünftig kostenlos anbieten können:
    Spenden
  • Thema: Horizontales Menü in Responsive Template

    RobtheTop

    • Schreiberling
    • Beiträge: 332
    Horizontales Menü in Responsive Template
    am: 11. März 2021, 23:16:58
    Hi.
    Ich würde gerne ein Horizontales Menü in meinem Template einbauen (modified-respnsive).
    Ich habe die Suche schon benutzt, aber irgendwie nichts brauchbares gefunden.
    Es wird meistens nur auf das Bootstrap Template verwiesen etc. aber etwas genaueres bzgl. des modified-resp-tempaltes habe ich nicht gefunden.
    Hat da jemand einen Link für mich oder kann mir sagen, ob ich das menü, welches hier für das Bootstrap Template angeboten wird, auch im responsive Template eingebaut werden kann?
    Danke

    Linkback: https://www.modified-shop.org/forum/index.php?topic=41736.0

    awids

    • Experte
    • Beiträge: 3.785
    • Geschlecht:
    Re: Horizontales Menü in Responsive Template
    Antwort #1 am: 12. März 2021, 16:37:47
    [...]
    Ich würde gerne ein Horizontales Menü in meinem Template einbauen (modified-respnsive).
    [...]

    Es gibt hier nur das (ältere Modul) jQuery Superfish Menu, das man zwar nach wie vor in einen 2.x-Shop einbauen kann, welches aber nicht responsive ist. Das würde daher etliche CSS-Anpassungen, u. a. Breakpoints, erfordern.

    [...]
    Ich habe die Suche schon benutzt, aber irgendwie nichts brauchbares gefunden.
    [...]

    Das zuvor benannte Superfish-Menü wirst du über die Suche wohl gefunden haben, aber als "nicht brauchbar" klassifiziert haben, weil es wie geschrieben nicht responsive ist?! Ansonsten gibt es wirklich nichts.

    [...] oder kann mir sagen, ob ich das menü, welches hier für das Bootstrap Template angeboten wird, auch im responsive Template eingebaut werden kann?
    [...]

    Theoretisch schon, wenn du alle erforderlichen CSS-Klassen/IDs und ggf. JavaScript mit ins entsprechende Template überträgst.

    RobtheTop

    • Schreiberling
    • Beiträge: 332
    Re: Horizontales Menü in Responsive Template
    Antwort #2 am: 12. März 2021, 18:49:30
    Schade, alles nicht so einfach.
    Ich habe jetzt schon so viel Zeit in mein Template gesteckt, dass ich jetzt nicht einfach auf das Bootstrap template switchen kann. Aber so langsam stelle ich fest, dass das FullPage Design besser zum Shop passt, aber dazu muss das menü an der seite weg.

    Ich habe noch eine alternative Idee.
    Vielleicht könntest du mir dabei helfen.
    Ich würde gerne testen, wie es ist, wenn man das menü, welches erscheint, bzw. aktiviert wird, sobald sich der viewport verkleinert, global aktiviert.

    Also auch auf dem Desktop soll der Button "Menü" angezeigt werden und ber Klick Klappt das Menü von Links nach recht auf.
    Quasi so, wie auf dem Handy. Ich bin kein Profi, aber ich denke, dass das wohl die einfacherer der 3 Möglichkeiten ist, oder.

    Den Button selbst, habe ich in grösseren viewport schonmal auf "display: block;" aber bisher passiert noch nichts.
    Wenn du da ein paar CSS klassen hast, die ich mir anschauen muss, dann wäre ich dir sehr dankbar.
    Ich will es wenigstens mal probieren.
    Ich denke, man kann das ganze mit CSS dann auch noch schön machen und die Desktop und Mobile Designs anpassen.

    Danke dir

    RobtheTop

    • Schreiberling
    • Beiträge: 332
    Re: Horizontales Menü in Responsive Template
    Antwort #3 am: 12. März 2021, 18:59:39
    Ich habe jetzt in der jquery.sidebar.css

    alles, was in  "@media only screen and (max-width: 985px)" stand,
    nach  "@media only screen and (min-width: 985px)" kopiert.

    Funktioniert auf den ersten blick.
    Bin für jeden Tip dankbar.

    awids

    • Experte
    • Beiträge: 3.785
    • Geschlecht:
    Re: Horizontales Menü in Responsive Template
    Antwort #4 am: 12. März 2021, 19:12:35
    Ich habe das (Menü-Button bereits in Desktop-Auflösung + Fullpage-Design) vor Ewigkeiten mal für den Shop "Talrose-Manufaktur" gemacht. Aber heute müsste ich mich da wieder komplett reindenken, etc.! Das einfachste wird es sein, dass du es selbst so weit versuchst, wie du kommst und dann am Ende deiner Möglichkeiten jemanden drauf schauen lässt, der ggf. noch vorhandenen Handlungsbedarf beseitigt.

    voodoopupp

    • Fördermitglied
    • Beiträge: 1.852
    • Geschlecht:
    Re: Horizontales Menü in Responsive Template
    Antwort #5 am: 12. März 2021, 20:33:10
    Ist immer relativ, was es heißt "viel Zeit in das Tempalte" gesteckt zu haben....

    Ich habe mir irgendwann mal die Mühe gemacht, als es noch keine groe Anzahl an responsiven Templates gab unseres komplett eigenständig aufzubauen...

    Das hat dann sicherlich 8 Wochen gedauert, und wurde dann weiter immer noch verfeinert.
    Habe damals allerdings auch noch nicht sooo viel Erfahrung gehabt mit Template bauen etc.

    Da heißt es dann eher: guten Ratgeber finden (entsprechende Webseite, die das "von der Pike" auf erklärt) und dann Tag für Tag minimale Fortschritte zu machen!

    Was ich damit sagen will: die, die kein Geld für die schnelle professionelle Umsetzung durch einen Profi haben, müssen das mit Mühe, Fleiß und EInsatz wett machen und viel viel viel Trial and Error machen ;)

    Viele Grüße
    Dominik

    RobtheTop

    • Schreiberling
    • Beiträge: 332
    Re: Horizontales Menü in Responsive Template
    Antwort #6 am: 12. März 2021, 20:40:29
    Ja, das weiß ich. Ich muss aber auch sagen, dass das schon richtig spass. macht, selbst Hand zu legen.
    Es ist nicht, so, dass ich kein Geld in die Hand nehmen will...
    Ich würde eher sagen, dass ich einfach zu viel spass dabei habe, solche dimge selbst zu machen.
    Es ist auch nicht so, dass ich völlig Planlos bin. Ich habe etwas Erfahrung mit Programmiersprachen und kann mich da ganz gut reindenken und was CSS und HTML angeht, bin ich bisher immer ans ziel gekommen.
    Und Gott sei Dank, gibt es diese Browserintegrierten tools, die einem ja quasi eine Livebearbeitung ermöglichen.
    Früher oder später, so hoffe ich jedenfalls, werde ich für solche spielereien keine Zeit mehr haben, da muss ich dass jemand anderem überlassen.

    Danke euch beiden.

    hpzeller

    • Experte
    • Beiträge: 4.129
    • Geschlecht:
    Re: Horizontales Menü in Responsive Template
    Antwort #7 am: 17. März 2021, 03:46:49
    Hallo RobtheTop

    [...]
    Also auch auf dem Desktop soll der Button "Menü" angezeigt werden und ber Klick Klappt das Menü von Links nach recht auf.
    Quasi so, wie auf dem Handy. Ich bin kein Profi, aber ich denke, dass das wohl die einfacherer der 3 Möglichkeiten ist, oder.
    [...]

    habe in meinem Testshop -> https://hpzeller.com/modified2051 das mal so in etwa wie ich mir vorstelle, wie du dir das vorstellst, eingebaut. Kannst du dir ja mal anschauen.

    Gruss
    Hanspeter

    xampp

    • Fördermitglied
    • Beiträge: 190
    Re: Horizontales Menü in Responsive Template
    Antwort #8 am: 17. März 2021, 11:05:42
    Zitat
    Aber so langsam stelle ich fest, dass das FullPage Design besser zum Shop passt, aber dazu muss das menü an der seite weg.
    Warum nimmst du denn nicht das Bootstrap4 vom Karl:
    TEMPLATE: Bootstrap4 für Shop 2.x - freies responsive Template
    da geht:
    Zitat
    fullcontent", d.h. ohne die linke Spalte

    RobtheTop

    • Schreiberling
    • Beiträge: 332
    Re: Horizontales Menü in Responsive Template
    Antwort #9 am: 17. März 2021, 11:12:26
    @hpzeller
    Ja, genauso ist es jetzt auch bei mir und das gefällt mir sehr gut. Was mir noch nicht gefällt, ist die Art und Weise wie das menü aufklappt. Das sieht so abgehakt aus. das werde ich noch ändern. Wenn ich andere Shops so sehe, dann geht das bei denen so schön smoothie.

    @xampp
    Wenn ich das vorher gewusst hätte, dann hätte ich es wahrscheinlich genutzt, aber einige Dinge sind mir erst später aufgefallen. Jetzt stecken aber bestimmt schon 100 Stunden Arbeit in dem Template und ich habe keine Lust, das alles nochmal von vorn zu beginnen. Wenn ich mit meinem fertig bin und Langeweile habe, dann werde ich das mal als Nebenbei-Projekt in Angriff nehmen.

    Danke euch.

    RobtheTop

    • Schreiberling
    • Beiträge: 332
    Re: Horizontales Menü in Responsive Template
    Antwort #10 am: 17. März 2021, 11:42:03
    Ich habe zusätzlich in der stylesheet.css

    in #layout-wrap noch
    Code: XML  [Auswählen]
    transition: 0.2s margin-left cubic-bezier(.46,.03,.52,.96);
    eingefügt.
    Dadurch wird es zwar etwas smoothiger aber immernoch hat es diesen abgehakten Charakter. Ich denke mal, dass es daran liegt, dass das Öffnen und Schließen des Wrappers grundsätzlich über javascript realisiert wird.
    Hat da jemand einen Tip für mich?
    Danke

    hpzeller

    • Experte
    • Beiträge: 4.129
    • Geschlecht:
    Re: Horizontales Menü in Responsive Template
    Antwort #11 am: 17. März 2021, 18:48:13
    Hallo RobtheTop,

    einen Tipp kann ich dir leider nicht geben, ich hatte mich nämlich auch über zwei Stunden erfolglos damit abgemüht das Skript so hinzubiegen, dass es auch in der Desktopansicht akzeptabel funktioniert. Wenn man das Layout in der Desktopansicht über die ganze Breite des Bildschirms zieht geht es, aber sobald man die Layoutbreite wieder auf 1140 Pixel reduziert sieht es schlecht aus. Ich habe deshalb ein eigenes kleines Skript geschrieben welches das Ein- und Ausblenden der linken Spalt ab einer Screenbreite von 986 Pixel übernimmt und dann noch ein paar CSS Regeln geändert bzw. hinzugefügt. Wenn du willst kann ich dir den Code hier posten.

    Gruss
    Hanspeter

    RobtheTop

    • Schreiberling
    • Beiträge: 332
    Re: Horizontales Menü in Responsive Template
    Antwort #12 am: 17. März 2021, 19:04:06
    Aktuell bin ich, was das layout angeht sehr zufrieden, hab aber auch einige Zeit damit verbracht alles anzupassen.
    Was ich nur nicht all zu schön finde, ist eben, dass es nicht ganz so smoothie läuft. Aber das war auch vor der Anpassung schon so. liegt also nicht an den Änderungen.
    Danke dir trotzdem.

    RobtheTop

    • Schreiberling
    • Beiträge: 332
    Re: Horizontales Menü in Responsive Template
    Antwort #13 am: 17. März 2021, 19:07:55
    Eine Sache vielleicht, bei der du mir auf die Sprünge helfen kannst...
    Der Menübutton ist leider nicht auf jeder Seite.
    Wenn ich auf der Startsete bin, oder in den Katgorieen, ist er da und das soll er ja auch sein, aber wenn ich zum Beispiel im Kontaktformular bin, dann gibt es da keinen Menübutton und der Kunde muss immer erst wieder zurück auf die Startseite um wieder das Menü aufrufen zu können.
    Das ist ziemlich doof. Wie bekomme ich das hin, dass er immer da ist?
    Danke

    RobtheTop

    • Schreiberling
    • Beiträge: 332
    Re: Horizontales Menü in Responsive Template
    Antwort #14 am: 17. März 2021, 19:12:43
    Ok, kleiner Nachtrag...
    Musste in der index.html eine Zeile ergänzen. Jetzt ist der Button da, auf klick darauf schiebt sich das Menü auf, aber das menü hat keinen Inhalt. Es klappt also nur eine weiße Seite auf.
    Ich suche weiter. Wenn dir was einfällt, immer raus damit.
    Danke
    1 Antworten
    2158 Aufrufe
    25. August 2016, 15:30:22 von daredevil
    0 Antworten
    2127 Aufrufe
    03. März 2014, 11:00:52 von willywusel01
    1 Antworten
    1975 Aufrufe
    19. Juni 2014, 17:57:43 von WayneTsun
    0 Antworten
    3043 Aufrufe
    27. Mai 2016, 11:29:38 von yasmina b.
               
    anything