Bestseller Box auf der Startseite

Thema wurde von Damian Rataj, 23. Juli 2019 erstellt.

  1. Damian Rataj
    Damian Rataj Mitglied
    Registriert seit:
    14. Februar 2012
    Beiträge:
    22
    Danke erhalten:
    0
    Hallo zusammen,
    wir haben unseren Shop spindmax.net Version 3.10.1.1 Honeygrid ein wenig umgestellt. Besonders die Startseite entspricht nicht besonders dem Standard.
    Nun habe ich über StyleEdit die Bestseller aktiviert und in die index-USERMOD.html die Box eingebaut.
    Angezeigt wird diese erfreulicherweise auch nur ist die Darstellung alles andere als schön.

    Wie kann ich nun die Artikel in der Kachelversion darstellen wie z.B. wenn man "zu diesem Produkt empfehlen wir" ?
    Und kann ich es auf der Startseite anzeigen und sobald man in die Kategorien geht auf der linken Seite abschalten?
    Kann ich irgendwie steuern welche Artikel angezeigt werden? Aktuell sind es nur Zubehör Artikel was ja nicht so sinnvoll ist.

    Kann mir hier jemand helfen und hat eine Lösung für mich?
     
  2. barbara
    barbara G-WARD 2014-2020
    Registriert seit:
    14. August 2011
    Beiträge:
    35.657
    Danke erhalten:
    11.371
    Danke vergeben:
    1.616
    Wir wissen nicht was Du wie umgebaut und eingebaut hast, da wird Dir blind auch niemand sagen können, was du noch einstellen oder ändern kannst.

    Da werden die Artikel angezeigt, die am meisten verkauft wurden. Würde man das steuermn können, dann wären es ja keine Bestseller mehr.
    Wenn die Bestseller nciht passen, warum nutzt Du dann nciht die Funktion der Top-Artikel?
    Hier kannst Du festlegen welche Artikel in der Kachelversion (nach Wunsch auch im Slider) auf der Startseite angezeigt werden. Den Titel kannst Du nach Wunsch ändern.
     
  3. Damian Rataj
    Damian Rataj Mitglied
    Registriert seit:
    14. Februar 2012
    Beiträge:
    22
    Danke erhalten:
    0
    Hallo,
    aktuell habe ich mal die Box Topseller eingebaut. Erscheint ganz unten auf spindmax.net
    Die Artikel werden untereinander aufgelistet. (wie es quasi auch in der Box im Standard ist)
    Nun wäre meine Frage, wie ich hier steuern kann, dass die Artikel nicht untereinander erscheinen sondern in Kachelvariante nebeneinander.

    Hoffe es ist jetzt zu verstehen. Ansonsten am besten mal auf der Seite anschauen.

    Dann würde ich halt gerne die Box welche links erscheint wenn ich in einer Kategorie drin mit verschwinden lassen.
    Dachte mal gelesen zu haben, dass man irgendwie in der DB die Artikel die angezeigt werden steuern kann.
    Wo kann ich den die Topartikel aktivieren? Vielleicht geht das ja auch. Hoffe diese werden dann angezeigt weil ja die Startseite bei uns total umgebaut wurde.
     
  4. barbara
    barbara G-WARD 2014-2020
    Registriert seit:
    14. August 2011
    Beiträge:
    35.657
    Danke erhalten:
    11.371
    Danke vergeben:
    1.616
    Ich denke, da müsstest Du die Datei umbauen.
    das müsste die templates/Honeygrid/boxes/box_bestseller.html sein.

    Du musst die ID aus der Index-USERMOD.html raus nehmen.
    Ich habe das nicht weiter im Kopf, aber da ist so ein Block für die Menüboxen.

    sicher, du musst bei den Artikeln dann manuell die Verkaufsmenge ändern. Dann kann aber auch Einfluss auf z.B. die Statistik haben - Da würde ich die Finger von lassen :)

    gehe im Admin in die Kategorie, da ist in der Artikel-Übersicht eine Spalte "Top", da setzt Du einfach einen Haken.
    Dann wird das als Top-Artikel auf der Startseite gelistet (außer Du hast den Bereich gelöscht.
     
  5. Damian Rataj
    Damian Rataj Mitglied
    Registriert seit:
    14. Februar 2012
    Beiträge:
    22
    Danke erhalten:
    0
    @barbara
    Danke das mit den Top Artikeln hat funktioniert. Super und Danke. Perfekte einfache Lösung.
     
  6. Damian Rataj
    Damian Rataj Mitglied
    Registriert seit:
    14. Februar 2012
    Beiträge:
    22
    Danke erhalten:
    0
    Habe nun aber noch folgendes Problem.
    Die TopArtikel Box scheint nicht responsive zu sein.
    Hat da jemand einen Tipp für mich?

    Beispiel unter spindmax.de
     
  7. Kai Stejuhn
    Kai Stejuhn Beta-Held
    Registriert seit:
    26. September 2014
    Beiträge:
    1.454
    Danke erhalten:
    743
    Danke vergeben:
    92
    Das liegt eher nicht an den Top-Artikeln, da gibt es wohl schon vorher ein Problem. Da wird teilweise der Text vorher auch schon verschoben und nicht richtig angezeigt.
     
  8. Damian Rataj
    Damian Rataj Mitglied
    Registriert seit:
    14. Februar 2012
    Beiträge:
    22
    Danke erhalten:
    0
    Einen Tipp was ich machen kann?
     
  9. Kai Stejuhn
    Kai Stejuhn Beta-Held
    Registriert seit:
    26. September 2014
    Beiträge:
    1.454
    Danke erhalten:
    743
    Danke vergeben:
    92
    Du hast Bilder mit Verlinkungen auf Kategorien eingebaut. Die hast Du mit "float:left" nebeneinander gebracht. Dort würde ich als erstes ansetzen und das Ganze mal auf ein vernünftiges Grid setzen. Dann kann man entscheiden, wieviel Bilder bei welcher Bildschirmgröße nebeneinander erscheinen sollen (z. B. "col-xs-12 col-sm-6 col-md-4 col-lg-3" - Ergibt 1 Bild auf dem kleinsten Bildschirm (Smartphone), 2 Bilder auf eine etwas größeren BS (Smartphone quer oder kleines Tablet), 3 Bilder auf dem noch größeren Bildschirm (Tablet/kleine Notebooks) und 4 Bilder auf dem grossen Bildschirm (Desktoprechner, grosse Notebooks) )
     
  10. Damian Rataj
    Damian Rataj Mitglied
    Registriert seit:
    14. Februar 2012
    Beiträge:
    22
    Danke erhalten:
    0
    Ok verstehe. Wo genau muss das rein? Einfach per Admin im Element Startseite und als html genau wie geschrieben..."col-xs-12 col-sm-6 col-md-4 col-lg-3" oder wie?
     
  11. ReneT
    ReneT Erfahrener Benutzer
    Registriert seit:
    1. Dezember 2016
    Beiträge:
    708
    Danke erhalten:
    232
    Danke vergeben:
    67
    im Beitrag muss es rein... schau mal in den beiden Demo Shops... da kannst du dir das abschauen...
     
  12. Kai Stejuhn
    Kai Stejuhn Beta-Held
    Registriert seit:
    26. September 2014
    Beiträge:
    1.454
    Danke erhalten:
    743
    Danke vergeben:
    92
    Da in Deinem Shop schon einige Anpassungen drin sind, bin ich jetzt davon ausgegangen, dass Du weißt was ich meine.

    Du musst das im Content mit eintragen als Klasse. Das musst Du bei jedem "Kategorie-Eintrag" einfügen.

    Ich habe das mal ausprobiert, aber irgendetwas stört da dann immer noch. Ich habe leider im Augenblick nicht soviel Zeit, dass ich das noch prüfen kann.

    Im Prinzip muss der Block nachher so aussehen:
    HTML:
        <div class="row">
            <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
                <a href="https://www.spindmax.de/Garderobenschraenke--Spinde--Umkleideschrank--Umkleidespinde--Personalspind--Personalumkleide--MEtallschrank--Metallspind--Spint--Garderobe-Metall--Spind--Spinde--Stahlschrank--Stahlschraenke--Metallspind--Metallschrank-fuer-Mitarbeiter--Mitarbeiterspind/" style="font-size: 15.6px; line-height: 20.8px;" target="_self"><img alt="Spinde Umkleideschränke by Spindmax.de" class="img-responsive" src="images/Bilder Spindmax/Index/SPINDE%20UMKLEIDESCHRAeNKE%20Spindmax.de_2.jpg"  title="Spinde bei Spindmax.de - Standard Spinde"></a>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
                <a href="https://www.spindmax.de/Faecherschraenke-Schliessfachschraenke-Wertfaecher-Schliessfaecher-Spind-Spinde-Stahlschrank-Metallschrank/" style="font-size: 15.6px; line-height: 20.8px;" target="_self"><img alt="Spinde Umkleideschränke by Spindmax.de" class="img-responsive" src="images/Bilder Spindmax/Index/Wertfachschraenke%20Schliessfachschraenke%20Spindmax.de.jpg"  title="Spinde bei Spindmax.de - Standard Spinde"></a>&nbsp;
            </div>
            <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
                <a href="https://www.spindmax.de/Garderobenbaenke--Sitzbaenke--Holz--und-HPL-Spinde--Kindergarten--Schulspinde--Garderobenschraenke--Garderobe-Metall--Spind--Spinde--Stahlschrank--Stahlschraenke--Faecherschrank--Schlie-fachschrank--metallschrank--Metall-schrank/" style="font-size: 15.6px; line-height: 20.8px;" target="_self"><img alt="Spinde Umkleideschränke by Spindmax.de" class="img-responsive" src="images/Bilder Spindmax/Index/Sitzbaenke%20Spindmax.de.jpg"  title="Spinde bei Spindmax.de - Standard Spinde"></a>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
                <a href="https://www.spindmax.de/Lagerschraenke--Bueroschraenke--Fluegentuerenschrank--Lagerschrank--Schrank-mit-2-Tueren--Besenschrank--Putzmittelschrank--Aktenregale--Aktenschraenke--Haengeregistraturschraenke/" style="font-size: 15.6px; line-height: 20.8px;" target="_self"><img alt="Spinde Umkleideschränke by Spindmax.de" class="img-responsive" src="images/Bilder Spindmax/Index/Lagerschraenke%20Spindmax.de.jpg"  title="Spinde bei Spindmax.de - Standard Spinde"></a>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
                <a href="http://www.gruenelinie.de/" target="_blank"><img alt="" class="img-responsive" src="images/Bilder%20Spindmax/Index/spindmax-gruene-linie-nachhaltig-spind.jpg" ></a>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
                <a href="https://maxim-spinde.de/" target="_blank"><img alt="Maxim HPL Spinde" class="img-responsive" src="images/Bilder%20Spindmax/Index/maxim-hpl-spinde-high-pressure-laminate.jpg" ></a>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
                <a href="https://www.e-spind.de/" target="_blank"><img alt="E Spinde - Spind mit Lademöglichkeit" class="img-responsive" src="images/Bilder%20Spindmax/Index/e-Spinde%20by%20Spindmax.de.jpg" ></a>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
                <a href="http://www.veendo.de/" target="_blank"><img alt="VEENDO die neuen Store Spinde" class="img-responsive" src="images/Bilder%20Spindmax/Index/Veendo_Container_RZ.jpg" ></a>
            </div>
        </div>
    
    Damit erhälst Du zwei Zeilen mit den Bildern. Wenn Du die Zeilen zusammenführen möchtest dann muss in der Mitte das

    </div>
    <div class="row">

    rausgenommen werden.

    Aber wie gesagt, irgendetwas stört den Ablauf da noch, ich konnte aber jetzt nicht feststellen was es ist.
     
  13. Damian Rataj
    Damian Rataj Mitglied
    Registriert seit:
    14. Februar 2012
    Beiträge:
    22
    Danke erhalten:
    0
    Ja damit rutscht dann der Block mit den Top Artikeln richtig nach unten bei kleinerer Ansicht. Nur kommt es halt noch zu dem Fehler oben. Habe eben auch ein wenig (meine Kenntnisse hier sehr wenig) getestet und ich bekomme das nicht richtig hin.
    Die zwei Zeilen benötige ich ja wegen der Desktopversion. Sobald es ein wenig kleiner wird.....stimmt die Anordnung nicht mehr.
    Was könnte das nur sein.....
     
  14. Damian Rataj
    Damian Rataj Mitglied
    Registriert seit:
    14. Februar 2012
    Beiträge:
    22
    Danke erhalten:
    0
    Hallo,
    leider habe ich immer noch keine Lösung gefunden.
    Kann mir jemand helfen?
     
  15. Kai Stejuhn
    Kai Stejuhn Beta-Held
    Registriert seit:
    26. September 2014
    Beiträge:
    1.454
    Danke erhalten:
    743
    Danke vergeben:
    92
    Das wird man so von Aussen kaum finden, da müßte mal jemand direkt rein schauen, also mit FTP und Admin-Zugang um die Eintragungen zu prüfen.
     
  16. Damian Rataj
    Damian Rataj Mitglied
    Registriert seit:
    14. Februar 2012
    Beiträge:
    22
    Danke erhalten:
    0
    Die aktuelle Variante ist auf Spindmax.net eingebaut. Mittels Content Manager habe ich per html folgendes drin....

    HTML:
    <div class="row">
        <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a href="https://www.spindmax.net/Garderobenschraenke--Spinde--Umkleideschrank--Umkleidespinde--Personalspind--Personalumkleide--MEtallschrank--Metallspind--Spint--Garderobe-Metall--Spind--Spinde--Stahlschrank--Stahlschraenke--Metallspind--Metallschrank-fuer-Mitarbeiter--Mitarbeiterspind/" style="font-size: 15.6px; line-height: 20.8px;" target="_self"><img alt="Spinde Umkleideschränke by Spindmax.de" class="img-responsive" src="images/Bilder Spindmax/Index/SPINDE%20UMKLEIDESCHRAeNKE%20Spindmax.de_2.jpg" title="Spinde bei Spindmax.de - Standard Spinde" /></a>
        </div>
    
        <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a href="https://www.spindmax.net/Faecherschraenke-Schliessfachschraenke-Wertfaecher-Schliessfaecher-Spind-Spinde-Stahlschrank-Metallschrank/" style="font-size: 15.6px; line-height: 20.8px;" target="_self"><img alt="Schließfachschränke by Spindmax.de" class="img-responsive" src="images/Bilder Spindmax/Index/Wertfachschraenke%20Schliessfachschraenke%20Spindmax.de.jpg" title="Spinde bei Spindmax.de - Standard Spinde" /></a>&nbsp;
        </div>
    
        <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a href="https://www.spindmax.net/Garderobenbaenke--Sitzbaenke--Holz--und-HPL-Spinde--Kindergarten--Schulspinde--Garderobenschraenke--Garderobe-Metall--Spind--Spinde--Stahlschrank--Stahlschraenke--Faecherschrank--Schlie-fachschrank--metallschrank--Metall-schrank/" style="font-size: 15.6px; line-height: 20.8px;" target="_self"><img alt="Umkleidesitzbänke by Spindmax.de" class="img-responsive" src="images/Bilder Spindmax/Index/Sitzbaenke%20Spindmax.de.jpg" title="Spinde bei Spindmax.de - Standard Spinde" /></a>
        </div>
    
        <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a href="https://www.spindmax.net/Lagerschraenke--Bueroschraenke--Fluegentuerenschrank--Lagerschrank--Schrank-mit-2-Tueren--Besenschrank--Putzmittelschrank--Aktenregale--Aktenschraenke--Haengeregistraturschraenke/" style="font-size: 15.6px; line-height: 20.8px;" target="_self"><img alt="Lagerschränke by Spindmax.de" class="img-responsive" src="images/Bilder Spindmax/Index/Lagerschraenke%20Spindmax.de.jpg" title="Spinde bei Spindmax.de - Standard Spinde" /></a>
        </div>
    </div>
    
    <div class="row">
        <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a href="https://www.spindmax.net/gruene-linie/" target="_blank"><img alt="GrüneLinie Garderobenschränke by Spindmax.de" class="img-responsive" src="images/Bilder%20Spindmax/Index/spindmax-gruene-linie-nachhaltig-spind.jpg" /></a>
        </div>
    
        <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a href="https://maxim-spinde.de/" target="_blank"><img alt="Maxim HPL Spinde by Spindmax.de" class="img-responsive" src="images/Bilder%20Spindmax/Index/maxim-hpl-spinde-high-pressure-laminate.jpg" /></a>
        </div>
    
        <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a href="https://www.e-spind.de/" target="_blank"><img alt="E Spinde - Spind mit Lademöglichkeit by Spindmax.de" class="img-responsive" src="images/Bilder%20Spindmax/Index/e-Spinde%20by%20Spindmax.de.jpg" /></a>
        </div>
    
        <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
            <a href="http://www.veendo.de/" target="_blank"><img alt="VEENDO die neuen Store Spinde by Spindmax.de" class="img-responsive" src="images/Bilder%20Spindmax/Index/Veendo_Container_RZ.jpg" /></a>
        </div>
    </div>
     
  17. barbara
    barbara G-WARD 2014-2020
    Registriert seit:
    14. August 2011
    Beiträge:
    35.657
    Danke erhalten:
    11.371
    Danke vergeben:
    1.616
    Warum macht man so ellen-lange Kategorie-URLs?

    "col-md-4"= 3 in einer Zeile, Du hast aber nur 4 in dem Block, deshalb rutscht da ein Bild nach unten.
    Dann ist in der oberen Reihe der 2. Block höher als die Anderen (167px haben die anderen Blöcke, das 2. ist 187px)
    Da hat sich eine Leerzeile eingeschlichen (das "&nbsp;" muss hinter dem Code weg)

    Und wenn Du den letzen Block so schreibst:
    HTML:
     <div class="col-xs-12 col-sm-6 col-md-4 col-md-offset-4 col-lg-3">
            <a href="https://www.spindmax.net/Lagerschraenke--Bueroschraenke--Fluegentuerenschrank--Lagerschrank--Schrank-mit-2-Tueren--Besenschrank--Putzmittelschrank--Aktenregale--Aktenschraenke--Haengeregistraturschraenke/" style="font-size: 15.6px; line-height: 20.8px;" target="_self"><img alt="Lagerschränke by Spindmax.de" class="img-responsive" src="images/Bilder Spindmax/Index/Lagerschraenke%20Spindmax.de.jpg" title="Spinde bei Spindmax.de - Standard Spinde" /></a>
        </div>
    Dann rutscht der Block in die Mitte.

    Unbenannt.JPG
     
  18. Kai Stejuhn
    Kai Stejuhn Beta-Held
    Registriert seit:
    26. September 2014
    Beiträge:
    1.454
    Danke erhalten:
    743
    Danke vergeben:
    92
    Das die Zeile umgebrochen wird ist klar, bei 4 Bildern gesamt, aber nur 3 in einer Reihe. Das Problem ist, dass das 4. Bild am rechten Rand angezeigt wird, anstatt wie "normal" wieder am linken Rand zu beginnen. Das liegt aber scheinbar an dem "&nbsp;", das habe ich auch übersehen.
     
  19. barbara
    barbara G-WARD 2014-2020
    Registriert seit:
    14. August 2011
    Beiträge:
    35.657
    Danke erhalten:
    11.371
    Danke vergeben:
    1.616
    Wollte auch nur erklären, dass das normal ist :)
    Mit dem "offset" kann man das aber noch Zentrieren, dann sieht das nicht so ungewollt aus.
     
  20. Damian Rataj
    Damian Rataj Mitglied
    Registriert seit:
    14. Februar 2012
    Beiträge:
    22
    Danke erhalten:
    0
    Also das "&nbsp;" habe ich gelöscht.
    Das mit der Bildhöhe verstehe ich nicht so ganz. habe mal nachgesehen und kann nur feststellen, dass alle Bilder die gleichen Maße haben. Alle Bilder sind bei mir 167px hoch.

    Wenn ich das mit dem Offset einbaue, dann habe ich ja bei der Desktop Variante auch das 4 Bild in der nächsten Teile in der Mitte. sieht nichts aus.

    Die Bilder der 1 und 2 Zeile sind nun zusammengerutscht. Zwischen den Bildern ist jedoch ein großer Platzhalter senkrecht jeweils vorhanden. Kann ich diesen irgendwie entfernen? Nicht das man jetzt davon ausgeht, dass immer zwei Bilder zusammengehören weil die oberen mit den unteren verschweißt sind.