***DEMO*** – December 31, 2045 00:00:00 will be in
Anleitung für Countdown auf der Webnode Website
Möchten Sie Ihrer Website einen Countdown-HTML-Code hinzufügen?
Sie planen beispielsweise eine Hochzeit und möchten an der Website zeigen, wie viele Tage bis zur Hochzeit verbleiben?
Kein Problem.
1. Verwenden Sie diesen HTML-Code, um die Zeit herunterzuzählen:
| <center><div style="color:black; font-size: 25px; font-weight: normal" id="dday"></div></center> | |
| <script> | |
| // Set the date we're counting down to | |
| var countDownDate = new Date("June 26, 2023 11:00:00").getTime(); | |
| // Update the count down every 1 second | |
| var x = setInterval(function() { | |
| // Get todays date and time | |
| var now = new Date().getTime(); | |
| // Find the distance between now an the count down date | |
| var distance = countDownDate - now; | |
| // Time calculations for days, hours, minutes and seconds | |
| var days = Math.floor(distance / (1000 * 60 * 60 * 24)); | |
| var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); | |
| var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)); | |
| var seconds = Math.floor((distance % (1000 * 60)) / 1000); | |
| // Display the result in the element with id="demo" | |
| document.getElementById("dday").innerHTML = days + "d " + hours + "h " | |
| + minutes + "m " + seconds + "s "; | |
| // If the count down is finished, write some text | |
| if (distance < 0) { | |
| clearInterval(x); | |
| document.getElementById("dday").innerHTML = "READY TO GO!"; | |
| } | |
| }, 1000); | |
| </script> |
- In Zeile 1 können Sie die Größe und Farbe anpassen.
- In Zeile 5 können Sie das Datum einstellen, an dem der Countdown enden soll. *Schreiben Sie das Datum in Englisch
- In Zeile 29 können Sie den Text bearbeiten, der nach Abschluss des Countdowns angezeigt wird.
2. Sie den HTML-Code des Zählers und fügen Sie ihn als Inhalt mit der Funktion + und HTML in Ihre Website ein.
3. Veröffentlichen Sie die Änderungen.
Fertig – der Countdown wird in der veröffentlichten Version der Website sichtbar.
Weitere tolle Tutorials
Webnode Rezension 2025: Wie man eine Website oder einen E-Shop erstellt?
Wollten Sie schon immer Ihre eigene Website von Grund auf erstellen? Möchten Sie eine Website oder einen E-Shop erstellen und sich im Internet sichtbar machen? Beginnen Sie jetzt und lernen Sie, wie Sie ganz einfach Ihre erste Website erstellen. Das Erstellen...
So verstecken Sie einen Warenkorb im Webnode-E-Shop
Wie kann man den Warenkorb im Webnode-E-Shop ausblenden?Sie haben mit Webnode einen E-Shop erstellt und möchten den Warenkorb im Menü und den Button "Zum Warenkorb hinzufügen" bei den Produkten ausblenden, damit Sie E-Shop-Elemente wie das Hinzufügen von Produkten...
So fügen Sie eine Umfrage in Webnode-Website ein
Möchten Sie in Ihre Webnode-Website eine Umfrage einbinden? Ein kostenloser Online-Fragebogen (Webumfrage) ist eine der häufigsten Möglichkeiten, um Feedback von Website-Besuchern zu erhalten. Ohne Feedback ist es schwierig zu beurteilen, ob Sie auf Ihre Kunden...
So fügen Sie ein GIF-Bild in Webnode hinzu
Möchten Sie ein GIF-Bild in Ihre Webnode-Website einfügen? Webnode erlaubt keine Gifs, wenn Sie sie als Bild einfügen. Aus diesem Grund müssen Sie zuerst das erforderliche .GIF-Bild auf eine externe Seite hochladen, um die URL des Bildes zu erhalten. Sie fügen die...
Wie verbinde ich Facebook Messenger mit dem Web bei Webnode?
Sie möchten Facebook Messenger mit der Website bei Webnodeverbinden und so kostenlos "Online-Chat" bekommen? Eine einfache Anleitung zum Verbinden der Webnode-Website mit Facebook Messenger Facebook Messenger ist eine gute Wahl für die Kommunikation mit einem...
So richten Sie E-Mail-Marketing in Webnode über MailChimp ein
Suchen Sie eine einfache Lösung für das E-Mail-Marketing bei Webnode? Möchten Sie ein Pop-up-Fenster zum Sammeln von E-Mails auf Ihrer Website einfügen? Senden Sie Nachrichten an Ihre Kunden über das automatisierte MailChimp-System. Es ist kostenlos für bis zu 2.000...
So fügen Sie einer Website in Webnode Remarketing-Code hinzu
Wie richte ich Remarketing in Webnode ein? und Wo kann Remarketing-Code eingefügt werden? In der Anleitung “Wie fügen Sie einen Conversion-Tracking Code in Webnode hinzu“ habe ich Ihnen einen einfachen Vorgang zur Eingabe Ihres...
So richten Sie einen Gmail -E-Mail-Client mit E-Mail von Webnode ein
Möchten Sie Ihre Webnode-E-Mail mit Gmail.com verknüpfen und Google Mail als Ihren E-Mail-Client einrichten? Empfangen Sie Nachrichten von Webnode-Webmail an Google Mail. In der Anleitung „Wie Sie einfach und KOSTENLOS eine professionelle E-Mail-Signatur...
Wie Sie die Aktivität von Besuchern Ihrer Website mit Smartlook betrachten können
Möchten Sie das Verhalten Ihres Kunden (Besuchers) auf der Website verstehen? SmartLook wird Ihnen dabei definitiv helfen. Was ist “Smartlook”? Smartlook ist eine Online-Anwendung zum Aufzeichnen der Mausbewegung von Besuchern Ihrer Website / Ihres E-Shops. Sie...
Ich habe das Portal Wpromotions.eu für Sie erstellt, um Ihnen bei der Erstellung Ihrer Website oder Ihres E-Shops zu helfen. Zögern Sie nicht, mich bei Bedarf zu kontaktieren, ich berate Sie gerne.
