Snippets · WooCommerce
Countdown bis Aktionsende auf der Produktseite
Hat ein Aktionspreis ein Enddatum, zeigt dieses Snippet unter dem Preis, wie lange die Aktion noch läuft – ohne zusätzliches Plugin.
Worum es geht
Das Enddatum steht nur im Backend. Kunden erfahren nicht, dass die Aktion bald endet.
So setzen Sie es ein
- Code einfügen und speichern.
- Bei einem einfachen Produkt einen Aktionspreis mit Enddatum („Planen“) eintragen.
- Auf der Produktseite erscheint unter dem Preis „Aktion endet in …“. Nach Ablauf verschwindet der Hinweis.
Was das Snippet nicht kann
- Nur für einfache Produkte – bei variablen Produkten liegt das Datum an den Varianten.
- Kein Countdown in Produktlisten oder auf der Startseite.
- Gestaltung über die CSS-Klasse mek7-countdown.
Vor dem Einbau
Testen Sie Snippets zuerst in einer Testumgebung und legen Sie eine Datensicherung an. Code ohne Gewähr.
Kopieren und einfügen
functions.php (Child-Theme) oder Snippet-Plugin
/**
* MEK7 Snippet: Countdown bis Aktionsende unter dem Preis
* Nutzt das Feld „Angebotszeitraum bis“ einfacher Produkte.
*/
add_action( 'woocommerce_single_product_summary', 'mek7_aktion_countdown', 11 );
function mek7_aktion_countdown() {
global $product;
if ( ! $product || ! $product->is_on_sale() || ! $product->get_date_on_sale_to() ) {
return;
}
$ende = $product->get_date_on_sale_to()->getTimestamp();
if ( $ende <= time() ) {
return;
}
printf( '<p class="mek7-countdown" data-ende="%d">Aktion endet in <strong></strong></p>', (int) $ende );
?>
<script>
(function () {
var el = document.querySelector('.mek7-countdown');
var ende = parseInt(el.dataset.ende, 10) * 1000;
function zeigen() {
var rest = Math.max(0, ende - Date.now());
var t = Math.floor(rest / 86400000), s = Math.floor(rest / 3600000) % 24, m = Math.floor(rest / 60000) % 60;
el.querySelector('strong').textContent = (t ? t + ' Tg. ' : '') + s + ' Std. ' + m + ' Min.';
if (!rest) { el.hidden = true; }
}
zeigen();
setInterval(zeigen, 30000);
})();
</script>
<?php
}Keine Zeit für Code?
Wir bauen das Snippet in Ihren Shop ein und testen es – zum Festpreis, sicher vor Theme-Updates im Child-Theme oder Snippet-Plugin.
Featured Grid
Countdown direkt in den Angebotskacheln auf Startseite und Angebotsseite, mit eigenem Enddatum je Artikel.