Top

WooCommerce – Produktübersicht anpassen

Online Mechaniker / Wordpress  / WooCommerce – Produktübersicht anpassen

WooCommerce – Produktübersicht anpassen

Zur Zeit arbeite ich an der Einbindung des Shop-Plugin WooCommerce für WordPress in meinem privaten Projekt „Wat geiht?”.
Dabei ist mir aufgefallen, dass die Darstellung der Produkte auf der Übersichtsseite in der Standardeinstellung uneinheitlich aussieht.
Der Link „In den Warenkorb” wird je nach Länge des Artikelnamens an einer unterschiedliche Stelle dargestellt.

Dies kann mit einer einfachen CSS – Regel angepasst werden.

.woocommerce ul.products li.product h3, 
.woocommerce-page ul.products li.product h3
{
min-height: 9em; /* Diesen Wert anpassen */
}

Der Artikelname ist in WooCommerce mit der Überschrift H3 ausgezeichnet. Mit der obigen CSS-Regel wird die Mindesthöhe für diesen Bereich vorgegeben. Ändern Sie den Wert, bis der der Link „In den Warenkorb” bei allen Produkten auf einer Höhe steht.

4 Comments
  • Oliver Bähre
    3. Februar 2015 at 13:13

    Hallo!

    Das ist ein toller Tipp. Aber wo füge ich den Code ein?
    Viele Grüße

    • Jan Neuhoff
      5. Februar 2015 at 10:54

      Hallo,

      der Code muss in die style.css des verwendeten Worpdress Themes.
      Um es „update sicher“ zu machen, sollten solche Änderungen immer in einem WordPress Child Theme durchgeführt werden.

      Grüße von der Ostsee
      Jan Neuhoff

      • Heike
        9. März 2015 at 10:18

        Hallo, kann man ein Child Thema auch nachträglich erstellen, wenn man schon alles (fast alles) fertig hat?
        LG aus Bern
        Heike

  • Oliver Bähre
    7. Februar 2015 at 13:32

    Hallo ,

    wo in der style.css füge ich diesen Code ein. Ich habe ihn zwar eingefügt, allerdinggs ohne nennenswertes Resultat. Vielleicht habe ich ihn ja an der falschen Stelle eingesetzt?

    Viele Grüße von der Nordsee
    Oliver Bähre

Post a Comment