Umzug der Artikel-Filter-Box auf Main-Inside

Thema wurde von Cyrus (LeGong), 4. Dezember 2016 erstellt.

  1. Cyrus (LeGong)

    Cyrus (LeGong) Erfahrener Benutzer

    Registriert seit:
    21. Dezember 2011
    Beiträge:
    1.432
    Danke erhalten:
    342
    Danke vergeben:
    176
    Hatest du auch das alte "Umzug der Artikel-Filter-Box auf Main-Inside"? Der war für Templates gemacht!
     
  2. Sergej (Gambio)

    Sergej (Gambio) Erfahrener Benutzer
    Mitarbeiter

    Registriert seit:
    1. August 2016
    Beiträge:
    336
    Danke erhalten:
    205
    Danke vergeben:
    69
    @Cyrus (LeGong) glaube ein sehr cooles Feature würde sein, wenn deine Anpassung an dem Filter
    • die Filterwerte merkt, nachdem ein Artikel aufgerufen wurde und zurück in die Kategorie über Breadcrumb geklickt wird
    • die Artikelnavigation beim Artikel nur über die gefilterten Artikel navigieren lässt
    • auf der Artikelseite einen Button z.B. "zur Übersicht" eingeblendet wird, welcher die gleiche Funktion wie Punkt 1 hat
    • nach Aufruf der Kategorie aus dem Artikel (Button oder Breadcrumb) die Filterwerte ausgewählt und die Artikelliste entsprechend gefiltert wieder vorliegt
     
  3. Cyrus (LeGong)

    Cyrus (LeGong) Erfahrener Benutzer

    Registriert seit:
    21. Dezember 2011
    Beiträge:
    1.432
    Danke erhalten:
    342
    Danke vergeben:
    176
    Super!:)
     
  4. Cyrus (LeGong)

    Cyrus (LeGong) Erfahrener Benutzer

    Registriert seit:
    21. Dezember 2011
    Beiträge:
    1.432
    Danke erhalten:
    342
    Danke vergeben:
    176
    Guten Abend
    das ist bestimmt alles mit JS umsetzbar vermute ich. Dazu meine JS-Kenntnis = 0% - 10%.
    Aber würde ich gerne mich auch von Experten wie du belehren lassen.
     
  5. Sergej (Gambio)

    Sergej (Gambio) Erfahrener Benutzer
    Mitarbeiter

    Registriert seit:
    1. August 2016
    Beiträge:
    336
    Danke erhalten:
    205
    Danke vergeben:
    69
    Ich denke lässt sich alles PHPseitig machen. Eine Möglichkeit schaffen die Filterauswahl zwischen zu speichern und beim Aufruf der selben Kategorie den Zwischenspeicher auslesen, die Filterwerte setzten und (okay, doch nicht alles PHPseitig) mit JS den Filtern-Button anstubsen. Der Zwischenspeicher würde sich für die Artikelnavigation ebenfalls für die Datenbankabfrage eignen.
     
  6. Cyrus (LeGong)

    Cyrus (LeGong) Erfahrener Benutzer

    Registriert seit:
    21. Dezember 2011
    Beiträge:
    1.432
    Danke erhalten:
    342
    Danke vergeben:
    176
    @Sergej (Gambio)
    finde ich die Idee auf jeden Fall SUPER. Vieleicht gibst du uns ein Paar Tips wie das realisierbar wäre.
    Danke.:)
     
  7. Anonymous

    Anonymous G-WARD 2015/2016

    Registriert seit:
    20. Februar 2012
    Beiträge:
    8.755
    Danke erhalten:
    1.516
    Danke vergeben:
    1.051
    Danach kein Filter zu sehen, nur unten zwischen 2. Kat-Beschreibung und Footer eine größerer leerer Bereich.

    (Link nur für registrierte Nutzer sichtbar.)
     
  8. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    28. Dezember 2020
    Beiträge:
    230
    Danke erhalten:
    100
    Danke vergeben:
    28
    #308 Anonymous, 3. März 2021
    Zuletzt bearbeitet: 3. März 2021
    Hallo @Cyrus (LeGong) ,
    schon fein gemacht, aber wenn man eine Option auswählt wird bei dir z.B. "ja" aber nicht mehr für was.
    Hatte das schon mal im Thread vorgeschlagen, man kann den Namen der Option und die Auswahl anzeigen, siehe:
    (Link nur für registrierte Nutzer sichtbar.)
    und die angepasste Datei.

    Nachtrag: man kann so auf die filter.html verzichten, sieht sowieso keiner. Es steht ja alles drin wenn man die Filterbox gleich offen lässt.
     

    Anhänge:

  9. Cyrus (LeGong)

    Cyrus (LeGong) Erfahrener Benutzer

    Registriert seit:
    21. Dezember 2011
    Beiträge:
    1.432
    Danke erhalten:
    342
    Danke vergeben:
    176
    @Sergej (Gambio)
    hallo, ich habe es gerade kontrolliert. Auch bei "product_listing_filter.html" sind solche tolle Erweiterungen/Möglichkeiten nicht vorhanden. Beispiel:
    Bei Seitenansicht "productlist-viewmode-grid" oder "productlist-viewmode-list"
    Bei "product_listing_filter_dropdown" SORTIERUNG.
    Bei "product_listing_filter_listing_count_dropdown" Artikelanzahl.
    Bei "product_listing_filter_pagination".
     
  10. Cyrus (LeGong)

    Cyrus (LeGong) Erfahrener Benutzer

    Registriert seit:
    21. Dezember 2011
    Beiträge:
    1.432
    Danke erhalten:
    342
    Danke vergeben:
    176
    #310 Cyrus (LeGong), 3. März 2021
    Zuletzt bearbeitet: 3. März 2021
    Diese Variante habe ich auch schon entwickelt. Bloss es sieht genau so hässlich aus wie bei deinem ohne Filter-Section.
    Bei mir ist zumindest Filter-Section vorhanden.
    Ich persönlich mag die Variante mit Filtername über Filterwert. Diese Variante war nur auf Wünsch von marmoles entwickelt. Es ist nicht mein Ideal.

    PS. Ich arbeite auch nicht mit GXModules-Variante, sondern nur mit Child-Themes. Da das hier für einige vielleicht zu kompliziert zu realisieren sein könnte, stelle ich nur die Overload-Variante zur Verfügung.
     
  11. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    28. Dezember 2020
    Beiträge:
    230
    Danke erhalten:
    100
    Danke vergeben:
    28
    #311 Anonymous, 3. März 2021
    Zuletzt bearbeitet: 3. März 2021
    Verstehe ich jetzt nicht, es sind doch alle Informationen da die ausgewählt sind.
    Ich bin für mehr Übersicht bei der Produkt-Listing und gestalte die Seiten so, das man ohne langes scrollen die ersten Produkte sieht. Bei den Shops mit Filter oben die ich so betrachtet habe, sieht man z.B. auf dem Desktop nach Filterauswahl keine Produkte sondern den Filter mit Filter-Auswahl und die Kategoriebeschreibung. Man muss lange scrollen um zu den gewählten Artikeln zu kommen. Über hässlich lässt sich streiten.
    Ich habe dabei auch auf Mobile Ansicht geachtet, da die Kunden die per Handy bestellen immer mehr zunimmt.

    Nachtrag:
    für die mobile Ansicht habe ich erstmal im Testshop den Filter bei Mobile (Modal-Fenster) genutzt. Schau dir das mal an, wenn du deine Version mit Handy betrachtest, drücke mal auf den Filter <i class="fa fa-filter"></i>
     

    Anhänge:

  12. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    28. Dezember 2020
    Beiträge:
    230
    Danke erhalten:
    100
    Danke vergeben:
    28
    Habe die mobile Anzeige mal als gif angehangen.
    Dabei nutze ich von Gambio vorhandene mobile Filteranzeige, habe nur den Botton verändert.
     

    Anhänge:

  13. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    30. Oktober 2015
    Beiträge:
    2.349
    Danke erhalten:
    573
    Danke vergeben:
    506
    #313 Anonymous, 4. März 2021
    Zuletzt bearbeitet: 19. März 2023
    .
     
  14. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    28. Dezember 2020
    Beiträge:
    230
    Danke erhalten:
    100
    Danke vergeben:
    28
    Habe bei mir das präziser angegeben:
    #filterbox-container .form-control{
    .....}
    und das auch für alle anderen, die auf andere übergreifen könnte.
     
  15. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    28. Dezember 2020
    Beiträge:
    230
    Danke erhalten:
    100
    Danke vergeben:
    28
    Da sind noch einige css Angaben in der filter.css die präziser angegeben werden müssen.
    Beispiel:
    .filter-form-control option
    #filterbox-container form fieldset
    #filterbox-container form fieldset:first-of-type
     
  16. Cyrus (LeGong)

    Cyrus (LeGong) Erfahrener Benutzer

    Registriert seit:
    21. Dezember 2011
    Beiträge:
    1.432
    Danke erhalten:
    342
    Danke vergeben:
    176
    Hallo Jan,
    in solche Fällen es reicht, wenn man wie Gerd schreibt die "id-Selector" von dem übergeordneten "<div>" für eine präzisere Angabe verwendet. Natürlich kann man auch die Methode von Gerd verwenden. "Allgemeine Bootstrap-Selektoren" wie:
    Code:
    col-xs-
    col-sm-
    col-md-
    col-lg-
    
    Die sind auch gut, decken halt größere Bereiche als meine:
    Code:
    @media (min-width: 360px){.form-control {width:300px;}}
    @media (min-width: 375px){.form-control {width:315px;}}
    @media (min-width: 376px){.form-control {width:335px;}}
    @media (min-width: 414px){.form-control {width:350px;}}
    @media (min-width: 667px){.form-control {width:300px;}}
    @media (min-width: 735px){.form-control {width:334px;}}
    @media (min-width: 740px){.form-control {width:336px;}}
    @media (min-width: 768px){.form-control {width:340px;}}
    @media (min-width: 1024px){.form-control {width:300px;}}
    @media (min-width: 1280px){.form-control {width:300px;}}
    @media (min-width: 1338px){.form-control {width:324px;}}
    
    Ich habe die Bootstrap-Selektoren auch am Anfang getestet. Mir hat es halt nicht gefallen, da die bei Smartphones, egal ob Hoch-Format oder Quer-Format, pro Zeile nur einen Filter-Feld anzeigen.
    Da ich momentan mehr als mir lieb ist arbeiten muss, habe ich wenig Zeit die evtl. Konflikte zu kontrollieren. Daher die Codes sind nur als Hinweis zu betrachten, wie man ungefähr mit der Problematik umgehen muss. Den Rest muss wie Gerd jeder selbst anpassen.

    Viele Grüße und Erfolgswünsche Cyrus
     
  17. Cyrus (LeGong)

    Cyrus (LeGong) Erfahrener Benutzer

    Registriert seit:
    21. Dezember 2011
    Beiträge:
    1.432
    Danke erhalten:
    342
    Danke vergeben:
    176
    Immer noch? Oder vor der Änderung?
     
  18. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    28. Dezember 2020
    Beiträge:
    230
    Danke erhalten:
    100
    Danke vergeben:
    28
    Das hatten wir schon mal weiter oben, so ist das css von @Cyrus (LeGong) richtig:
    Code:
    @media (min-width: 360px){#filterbox-container .form-control {width:300px;}}
    @media (min-width: 375px){#filterbox-container .form-control {width:315px;}}
    @media (min-width: 376px){#filterbox-container .form-control {width:335px;}}
    @media (min-width: 414px){#filterbox-container .form-control {width:350px;}}
    @media (min-width: 667px){#filterbox-container .form-control {width:300px;}}
    @media (min-width: 735px){#filterbox-container .form-control {width:334px;}}
    @media (min-width: 740px){#filterbox-container .form-control {width:336px;}}
    @media (min-width: 768px){#filterbox-container .form-control {width:340px;}}
    @media (min-width: 1024px){#filterbox-container .form-control {width:300px;}}
    @media (min-width: 1280px){#filterbox-container .form-control {width:300px;}}
    @media (min-width: 1338px){#filterbox-container .form-control {width:324px;}}
    
     
  19. dmun

    dmun Erfahrener Benutzer

    Registriert seit:
    2. Juni 2019
    Beiträge:
    294
    Danke erhalten:
    27
    Danke vergeben:
    6
    Hallo,
    ich habe mir die Lösung aus Beitrag #296 von Anonymous auf GX 3.14 installiert und diese Lösung funktioniert problemlos im Testshop.
    Gibt es bei dieser Anpassung noch eine einfache Möglichkeit, dass die einzelnen Dropdowns für die Filterauswahl neben einander sind und nicht alle unter einander ? In der ursprünglichen Version für die Templates waren die Dropdowns ebenfalls neben einander, was mir etwas besser gefällt.

    Grüße, Dirk
     
  20. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    28. Dezember 2020
    Beiträge:
    230
    Danke erhalten:
    100
    Danke vergeben:
    28
    Da gibt es zwei Lösungen, eine von @Cyrus (LeGong) Betrag: #327 per css,
    bei meiner Lösung musst du in der box_filter_form_content.html mit Notepad++ in Zeile col-sm- oder col-lg... anpassen:
    <div class="filter-box col-xs-12 col-sm-6 col-lg-3 ........... .
    Beispiel:
    (Link nur für registrierte Nutzer sichtbar.)