WooCommerce align Warenkorb-Button bei ähnlichen Produkten/Upsells

Hallo,
ich habe CSS Code geschrieben damit bei den Upsells und ähnlichen Produkten in WooCommerce

• die Buttons auf gleicher Höhe erscheinen
• der Produkttitel immer vertikal zentriert ist und
• die Dauer nicht neben dem Preis, sondern unter dem Preis angezeigt wird.

In der Elementor Vorschau wird es mir richtig angezeigt, auf der Seite selbst funktioniert nur das mit der Dauer. Ich bin ziemlich ratlos.

Das ist der gesamte Code:

ul.products li.product {
    display: flex;
    flex-direction: column;
}
.woocommerce ul.products li.product .woocommerce-LoopProduct-link {
    margin-bottom: auto;
}
.woocommerce ul.products li.product .woocommerce-LoopProduct-link h2 {
    line-height: 4ex;
    height: 12.5ex; display: flex; align-items: center; justify-content: center;
}
.woocommerce ul.products li.product .duration {
   display: grid; justify-content: center; margin-top: 6px; font-size: 14px; font-weight: 500;
}

Hier der Link zu einem Produkt, wo man das dann unten sieht: https://123fitvital.com/produkt/namens…rtsnumerologie/

Hier wie ich es in der Vorschau sehe

Hier wie es auf der Seite angezeigt wird:

Hat irgendjemand einen Rat? Ich danke euch vielmals im Vorhinein für eure Mühen!

Herzliche Grüße
Angelika

Sorry ich habe die falsche WP-Verison ausgewählt. Man sollte wohl nicht so spät in der Nacht arbeiten. Leider finde ich keine Funktion um dies zu ändern. Es ist natürlich die aktuellste Version von WP.

Sorry, war der festen Überzeugung, dass ich ihn ausgeschaltet hatte. :oops:
Aber jetzt!

Hallo nochmals, leider habe ich noch immer nichts gefunden, was mir die richtige Elementor Vorschau auch im Frontend so wie im oberen Bild darstellt. Wer weiß, wie ich das umsetzten kann oder wo vielleicht mein Fehler liegt?

Es sind die selben Inhalte, nur verschiedene Produkte (manche sind buchbar, haben also Zeit; andere nicht). Das einzige Element, welches man in der Vorschau nicht sieht ist die Angabe der Steuer, die kommt durch das Plugin German Market. Aber auch wenn ich das deaktiviere ändert sich leider nichts (siehe Foto).

Das Deaktivieren von WP Fastest Cache hat leider auch nichts geändert, habe ich aber aktuell deaktiviert gelassen. (Andere Cache Plugins kommen nicht zum Einsatz.)

Hier noch ein Foto von der Vorschau bei Produkten, wo auch Zeit dabei ist:

Den CSS Code gebe ich im Customizer ein bei zusätzlichem CSS.

Hier nun 2 Screenshots mit den genau gleichen Produkten (das sind die "ähnlichen Produkte"):
Es kommt nur die Steuer von German Market dazu & die Kategorie oben)
1. Vorschau in Elementor

2. Frontend

Danke für den Tipp mit den Caching Plugins. Bin ich schon wieder ein Stück schlauer. ;)

Das für die Steuer ist jetzt deaktiviert, macht aber eben keinen Unterschied. Von wo die Kategorie gezogen wird ist mir leider nicht klar bzw. eigentlich sollte man die in der Vorschau auch sehen.

Danke, probiere ich gleich aus.

So, ich habe mir die Lösung ausprobiert: ;) (und viel gelernt)

.woocommerce ul.products li.product .duration {
   display: grid; justify-content: center; margin-top: 6px; font-size: 14px; font-weight: 500;
}


.woocommerce ul.products li.product h2 {
  line-height: 4ex;
  height: 12.5ex; display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}


.woocommerce ul.products li.product {height: 580px;}


.woocommerce ul.products li.product .button {position: absolute; bottom: 10px; left: 15px;right: 15px; margin-top: 20px; }

Ist aber leider eine überhaupt nicht schöne Lösung, weil ich die Position absolut nicht gut finde. Deswegen, nehme ich davon nur diesen Teil um einfach den Titel auf mehrere Zeilen aufzuteilen:

.woocommerce ul.products li.product h2 {
  line-height: 4ex;
  height: 12.5ex; display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}

Bei dem oberen Code habe ich die Dauer der Produkte in eine neue Zeile gegeben (was mir besser gefällt, denn dann steht nicht Streichpreis, Preis und Dauer in einer Zeile), da aber nicht alle Produkte eine Dauer haben und ich es nicht anders als mit der Position absolut zu lösen geschafft habe, verzichte ich darauf, dass die Dauer von den Produkten unter den Preisen steht. Damit ist alles automatisch in einer Linie. *mini-yeah*

Nochmals vielen Dank für euren Support!