Bestseller Box auf der Startseite

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?

 

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.

 

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.

 

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.

 

@barbara
Danke das mit den Top Artikeln hat funktioniert. Super und Danke. Perfekte einfache Lösung.

 

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

 

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.

 

Einen Tipp was ich machen kann?

 

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) )

 

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?

 

im Beitrag muss es rein... schau mal in den beiden Demo Shops... da kannst du dir das abschauen...

 

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.

 

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.....

 

Hallo,
leider habe ich immer noch keine Lösung gefunden.
Kann mir jemand helfen?

 

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.

 

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>

 

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.

 

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.

 

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.

 

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.