Button "In den Warenkorb" auf der Artikelliste immer ganz unten

[KathiLe]

Hallo,

wenn die Artikelbezeichnungen bei einigen Artikel länger als bei anderen sind, wird das Erscheinungsbild der Galerieansicht ziemlich unruhig (Artikel 3):



Jetzt suche ich eine Möglichkeit, dass dieser Button immer unten angezeigt wird, also dass alle Button in einer Linie stehen. Kann jemand helfen?

Dankeschön

 

[martinwolf]

AW: Button "In den Warenkorb" auf der Artikelliste immer ganz unten

Das ist auf einer responsiven Ansicht immer schwierig umzusetzen, da die Breite bzw. Anzahl Artikel pro Reihe am Viewport ermessen wird. Diese Unruhe kommt durch unterschiedliche Höhen der Artikelelemente, in dem Fall durch unterschiedlich lange Artikelnamen. Es gibt ein paar Möglichkeiten dem entgegen zu wirken:

1. Man setzt die Höhe des Artikelnamen auf einen festen Wert, wobei hierauf zu achten ist, dass eine Höhe gewählt wird sodass auch der längste Name nicht überlagert wird. Zudem muss hier dann für jede Gerätegröße dieser Wert auch angeglichen werden, denn auf einem Smartphone wird der Name wohlmöglich auf weniger Zeilen dargestellt als auf dem Tablet.
2. Man setzt per JS alle Elemente in einer Reihe auf die Höhe des höchsten Elements und platziert den Button absolut immer unten. Was schwierig ist, da auf der Artikelliste defakto keine wirklichen Reihen existieren, lediglich die Elemente werden physisch umbrochen.
3. Man kürzt den Namen auf eine gewisse Anzahl an Zeichen im Template und lässt den vollen Namen per Title Attribut anzeigen. Wovon aber abzuraten ist, da Google dass dann ebenfalls nur so halb lesen kann.

 

[KathiLe]

AW: Button "In den Warenkorb" auf der Artikelliste immer ganz unten

Danke für die schnelle Antwort.
Ich glaube, dann lass ich das lieber, lebe mit den unterschiedlichen Höhen und werde zukünftig auf die Zeichenanzahl in der Bezeichnung achten.
Und wenn ich den Originalpreis bei reduzierten Artikeln in der Liste weglasse, passt es bei vielen Artikeln auch wieder