gelöst Honeygrid: Suche und Warenkorb unter den Header verschieben (wie im EyeCandy)

Thema wurde von Guyonthecouch, 26. September 2016 erstellt.

  1. Guyonthecouch
    Guyonthecouch Erfahrener Benutzer
    Registriert seit:
    17. September 2016
    Beiträge:
    210
    Danke erhalten:
    24
    Danke vergeben:
    93
    Hallo zusammen,

    ich benutze das Honeygrid Template und würde gerne die Suche und den Warenkorb in eine Zeile unter den Header verschieben (Desktop- und Tablet-Darstellung). Wie könnte ich das realisieren um auch weiterhin sauber/responsive unterwegs zu sein?

    Vielen Dank und Grüße
    Cedric
     

    Anhänge:

  2. Guten Morgen, hier musst Du im StyleEdit3 im Bereich des Headers arbeiten. Hier sind entsprechend die Gridwerte und vertikaler Abstand ein zu stellen. Desktop und Tablet müssten gehen. Hingegen beim Handy nicht ! Versuch Dich einfach mal ein wenig durch... falls es nicht klappen sollte einfach noch einmal melden.
     
  3. Guyonthecouch
    Guyonthecouch Erfahrener Benutzer
    Registriert seit:
    17. September 2016
    Beiträge:
    210
    Danke erhalten:
    24
    Danke vergeben:
    93
    Guten Morgen Michael,

    ich habe bereits etwas mit den Werten herumgespielt, leider ohne das gewünschte Ergebnis.
    Der Abstand nach unten hin wird immer größer und über den Styleedit alleine kann ich dieser Leiste keine Hintergrundfarbe zuordnen.

    Die beiden Elemente habe ich auch einmal in der index.html (im Honeygrid Template) in einen <div> (subheader) gepackt und über die CATEGORIES_TOP platziert. Leider bekomme ich jedoch den Warenkorb nicht ganz rechts ausgerichtet und ich bin mir nicht sicher ob es der richtige Weg wäre.

    Hast du eine Idee?

    Viele Grüße
    Cedric
     
  4. Guyonthecouch
    Guyonthecouch Erfahrener Benutzer
    Registriert seit:
    17. September 2016
    Beiträge:
    210
    Danke erhalten:
    24
    Danke vergeben:
    93
    #4 Guyonthecouch, 28. September 2016
    Zuletzt bearbeitet: 28. September 2016
    Ich habe es geschafft. Ich bin folgendermaßen vorgegangen: (nur Desktop-Ansicht)

    1. Anpassung der Grid-Spalten
      - Logo auf 12
      - Hinweis ausblenden
      - Suche auf 6
      - Warenkorb auf 6
      --> Die Suche und der Warenkorb rutschen jetzt unter den Header!
    2. Größe der Headergrafik angepasst und Balken in das Bild eingefügt anstatt zu versuchen einen eigenten Container umzufärben.
    fertig. :)
     
  5. Futterkisterl-Tirol
    Futterkisterl-Tirol Erfahrener Benutzer
    Registriert seit:
    26. Juli 2014
    Beiträge:
    411
    Danke erhalten:
    29
    Danke vergeben:
    183
    hast Du ne Url zu deinem Shop - würde mir das gerne mal ansehen :)
     
  6. Guyonthecouch
    Guyonthecouch Erfahrener Benutzer
    Registriert seit:
    17. September 2016
    Beiträge:
    210
    Danke erhalten:
    24
    Danke vergeben:
    93
    Schaust du hier.

    Viele Grüße
    Cedric
     
  7. Anonymous
    Anonymous Mitglied
    Registriert seit:
    18. Januar 2017
    Beiträge:
    7
    Danke erhalten:
    0
    Danke vergeben:
    4
    Hallo Cedric,

    ich hätte auch gerne deine Lösung umgesetzt, komme aber irgendwie nicht dahinter.

    Könntest Du mir bei den Schritten ein wenig Step by Step weiterhelfen ?


    Grüße
    Toni

    Gambio x3
     
  8. Guyonthecouch
    Guyonthecouch Erfahrener Benutzer
    Registriert seit:
    17. September 2016
    Beiträge:
    210
    Danke erhalten:
    24
    Danke vergeben:
    93
    Hallo Toni,

    zu 1) Anpassung der Grid-Spalten:
    - Logo auf 12
    - Hinweis ausblenden
    - Suche auf 6
    - Warenkorb auf 6
    --> Die Suche und der Warenkorb rutschen jetzt unter den Header!

    • Den Shop im Bearbeitungsmodul laden (Template-Einstellungen>Shop im Bearbeitungsmodus laden)
    • Dann im StyleEdit unter "Header" die Einstellungen vornehmen:
      • Logo auf 12 setzen (Anzahl der Grid-Spalten)
        upload_2017-1-27_10-59-35.png
      • Hinweis ausblenden
        upload_2017-1-27_11-1-0.png
      • Suche auf 6
        upload_2017-1-27_11-2-11.png
      • Warenkorb auf 6
        upload_2017-1-27_11-3-1.png
    Du musst hierbei bedenken, dass die Grid-Spalten für eine Zeile in Summe immer 12 ergeben müssen. Also kannst du beispielsweise den Warenkorb auch auf 3 und die Suche auf 9 Spalten setzen.



    Zu 2) Größe der Headergrafik angepasst und Balken in das Bild eingefügt anstatt zu versuchen einen eigenen Container umzufärben.

    Bei mir hat der Header eine Höhe von 200px:
    upload_2017-1-27_11-7-53.png

    Und eine Breite von 1200px:
    upload_2017-1-27_11-8-32.png

    Dementsprechend muss die Hintergrundgrafik 1200x200px groß sein.
    Der Balken für die "extra Leiste" habe ich in der Hintergrundgrafik entsprechend eingefärbt in der Höhe von 50px.

    Ich hoffe ich konnte dir damit helfen :)

    Viele Grüße
    Cedric
     
  9. Anonymous
    Anonymous Mitglied
    Registriert seit:
    18. Januar 2017
    Beiträge:
    7
    Danke erhalten:
    0
    Danke vergeben:
    4
    Hallo Cedric, ein fettes Danke für deine ausführliche Anleitung !

    Sorry das ich mich erst jetzt melde, es gab viel zu tun und irgendwie ist das nach hinten gerutscht.
    Umso mehr freue ich mich über deine ausführliche Hilfestellung.

    Wenn ich es so hinbekommen habe, gibt es ein Feedback.


    Vielen Dank und beste Grüße

    Toni
     
  10. Anonymous
    Anonymous Mitglied
    Registriert seit:
    3. August 2016
    Beiträge:
    23
    Danke erhalten:
    0
    Danke vergeben:
    10
    Hallo Cedric,

    bei mir hatte sich auch alles nach unten verschoben, wenn man die Suchleiste oder den Warenkorb verschieben wollte.
    Die Kategorieleiste wanderte immer tiefer. Der entscheidende Tipp war, den Grid-Wert (groß) für das Logo auf 12 zu setzen.
    Und schon war alles dort wo es hingehört.
    Also auch von mir herzlichen Dank!

    Frank
     
  11. wvnetdesign
    wvnetdesign Erfahrener Benutzer
    Registriert seit:
    16. Januar 2013
    Beiträge:
    404
    Danke erhalten:
    1
    Danke vergeben:
    99
    Auch von hier ein herzliches DANKE!
    lg, Heidemarie
     
  12. mopedtantchen
    mopedtantchen Neues Mitglied
    Registriert seit:
    3. Juli 2017
    Beiträge:
    1
    Danke erhalten:
    0
    Hallo bin neu hier und völlig am verzweifeln,
    mir hat der thread hier auch sehr geholfen, nachdem ich vorher schon tagelang Versuche gestartet habe. Schon mal vielen Dank.
    Ich hätte aber noch eine Frage dazu, vielleicht kann mir ja jemand helfen.
    Bei mir klebt jetzt die Suche direkt am Header und ist sehr breit, wo kann man denn das noch einstellen. Kann beim besten willen nichts finden.
    Vielen Dank schon mal für eure Hilfe.
    LG , Agathe