Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Puchar WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Jak dodać widżet odliczający czas w WordPress (3 sposoby)

Uwaga redakcyjna: Otrzymujemy prowizję z linków partnerskich na WPBeginner. Prowizje nie mają wpływu na opinie i oceny naszych redaktorów. Dowiedz się więcej o Proces redakcyjny.

Czy chcesz dodać odliczanie kamieni milowych w WordPress?

Licznik odliczający czas pomaga w prezentowaniu ważnych osiągnięć, rocznic, nadchodzących wydarzeń i nie tylko.

W tym artykule pokażemy, jak łatwo dodać widżet odliczający czas do twojej witryny WordPress.

Adding a milestone countdown widget in WordPress

Kiedy i dlaczego używać widżetu odliczającego kamienie milowe?

Widżety odliczające kamienie milowe są przydatnymi narzędziami do przypominania twoim odbiorcom o ważnym kamieniu milowym, takim jak nadchodzące wydarzenie, wprowadzenie produktu na rynek lub wydarzenie sprzedażowe.

Odliczanie pomaga zbudować oczekiwanie wśród twoich klientów i zwiększyć zaangażowanie użytkowników.

Oto kilka typowych scenariuszy, w których można użyć widżetu odliczającego kamienie milowe:

  • Przed uruchomieniem Twojej witryny internetowej na stronie coming soon.
  • Podczas konserwacji witryny internetowej, aby poinformować odwiedzających, kiedy witryna będzie ponownie dostępna.
  • Przed wprowadzeniem nowego produktu do Twojego sklepu internetowego.
  • Podczas organizowania wydarzenia lub konferencji.
  • W dniu urodzin twojego biznesu online.
  • W święta i wydarzenia wyprzedażowe, takie jak Czarny Piątek, oferuj duże zniżki na twoje produkty lub usługi.

Możesz wyświetlać licznik kamieni milowych w swoich wpisach, na stronach i w obszarze widżetów panelu bocznego.

Odliczanie czasu można również dodać do wyskakujących okienek lightbox, pływających pasków, pól przewijania i innych elementów projektu, aby zaangażować opuszczonych użytkowników witryny i przyciągnąć ich z powrotem na twoją witrynę internetową.

Ponieważ istnieje tak wiele przypadków użycia licznika czasu, wymieniliśmy 3 różne metody dodawania widżetu odliczającego kamienie milowe w WordPress:

Przyjrzyjmy się, jak łatwo dodać widżet odliczania kamieni milowych w WordPress.

Film instruktażowy

Subscribe to WPBeginner

Jeśli wolisz pisemne instrukcje, czytaj dalej.

Metoda 1: Dodanie widżetu odliczającego kamienie milowe za pomocą wtyczki Countdown Timer Ultimate

Countdown timer demo

Countdown Timer Ultimate to prosta darmowa wtyczka, która pozwala dodać podstawowy licznik czasu do twojej witryny internetowej.

Pierwszą rzeczą, którą musisz zrobić, to zainstalować i włączyć wtyczkę Countdown Timer Ultimate. Aby uzyskać więcej informacji, zobacz nasz przewodnik krok po kroku, jak zainstalować wtyczkę WordPress.

Po włączaniu należy przejść na stronę Countdown Timer ” Add Timer w obszarze administracyjnym WordPress.

Na tej stronie musisz zacząć od dodania nazwy twojego kamienia milowego jako tytułu nowego licznika.

Uwaga: Licznik czasu korzysta ze strefy czasowej ustawionej w ustawieniach twojej witryny WordPress. Jeśli chcesz zmienić strefę czasową dla tego licznika, musisz przejść do Ustawienia ” Ogólne i zaktualizować ustawienia strefy czasowej twojej witryny WordPress.

Add timer title

Następnie możesz przewinąć w dół, aby ustawić datę wygaśnięcia, dzień i godzinę dla twojego licznika kamieni milowych.

Wybierz datę wygaśnięcia twojego licznika czasu.

Set expiry date

Następnie należy wybrać styl animacji z listy rozwijanej.

Można również łatwo dostosować szerokość okręgu i tła.

Choose animation

W polu Szerokość odliczania można zdefiniować szerokość dla pełnego wyświetlania twojego widżetu odliczania. Jeśli pozostawisz to pole puste, zegar będzie wyświetlany w domyślnym rozmiarze.

Następnie można dodać kolory tła i pierwszego planu dla licznika czasu. Możesz indywidualnie zmienić kolor dla dni, godzin, minut i sekund. Możesz także zmienić etykiety dla elementów takich jak dni, godziny itp.

Niestety, wtyczka nie dostosowuje etykiety do liczby mnogiej lub pojedynczej, więc zamiast „1 godzina” pojawi się „1 godzina”.

Background foreground color

Gdy ustawienia będą satysfakcjonujące, kliknij przycisk „Opublikuj”.

Wyświetlanie twojego widżetu odliczającego kamienie milowe w WordPressie

Po utworzeniu widżetu odliczającego kamienie milowe dodajmy go do twojej witryny internetowej.

Najpierw kliknij menu Countdown Timer. Utworzony timer pojawi się na stronie WP Countdown Timer.

Copy shortcode

Obok twojego licznika czasu zobaczysz krótki kod, który musisz skopiować.

Musisz skopiować i wkleić ten krótki kod do treści twojego wpisu lub strony.

Add a shortcode block

Następnie kliknij przycisk aktualizacji lub publikacji, aby zapisać twoje zmiany.

Możesz teraz przejść na swoją witrynę internetową, aby zobaczyć widżet odliczania kamieni milowych w działaniu.

Countdown timer demo

Możesz również dodać ten licznik czasu na panelu bocznym twojej witryny WordPress. Wystarczy przejść do strony Wygląd ” Widżety i dodać widżet z krótkim kodem do twojego panelu bocznego.

W ustawieniach widżetu należy wkleić krótki kod dla twojego licznika czasu.

Add a shortcode widget block

Po zakończeniu nie zapomnij kliknąć przycisku Aktualizuj, aby zapisać twoje ustawienia widżetu.

Możesz teraz przejść na swoją witrynę, aby zobaczyć licznik czasu na panelu bocznym lub w obszarze gotowym na widżet.

Countdown milestone preview

Metoda 2: Dodanie widżetu odliczającego kamienie milowe za pomocą OptinMonster

OptinMonster to najlepsza wtyczka WordPress popup na rynku, ale robi znacznie więcej niż tylko wyskakujące okienka. Pomaga przekształcić porzucających witrynę odwiedzających w subskrybentów i klientów.

Korzystając z funkcji licznika czasu OptinMonster, możesz zintegrować licznik kamieni milowych z wyskakującym okienkiem (okno) lightbox, widżetem na panelu bocznym, pływającym paskiem lub dowolnym innym rodzajem kampanii OptinMonster.

Poniżej znajduje się przykład jednej z gotowych kampanii z licznikiem czasu, ale możesz użyć kreatora przeciągnij i upuść, aby stworzyć całkowicie dostosowany licznik czasu.

OptinMonster Countdown Timer Popup for Holidays

OptinMonster to sprytny sposób na wyświetlanie licznika czasu w przyciągających uwagę elementach projektu. Pozwala nawet na tworzenie wiecznie zielonych liczników czasu w WordPress.

Wiecznie zielony licznik czasu rozpoczyna odliczanie dla każdego odwiedzającego. Odliczanie rozpoczyna się, gdy dana osoba wejdzie na twoją witrynę. Jest on również określany jako dynamiczny licznik czasu.

Po pierwsze, musisz przejść na witrynę internetową OptinMonster i zapisać się na plan, który spełnia twoje potrzeby.

OptinMonster

Następnie należy zainstalować wtyczkę OptinMonster na twojej witrynie WordPress. Aby uzyskać więcej informacji, zobacz nasz przewodnik krok po kroku, jak zainstalować wtyczkę WordPress.

Ta wtyczka będzie działać jako łącznik między twoją witryną WordPress a aplikacją OptinMonster.

Po włączaniu musisz przejść do OptinMonster ” Ustawienia z menu administratora WordPress i połączyć twoje konto.

Możesz kliknąć przycisk „Połącz istniejące konto”, aby rozpocząć.

Connect OptinMonster account

Następnie pojawi się wyskakujące okienko.

Wystarczy wybrać adres e-mail użyty do rejestracji konta OptinMonster i kliknąć przycisk „Połącz z WordPress”.

Click the Connect to WordPress button

Wtyczka połączy teraz twoją witrynę WordPress z kontem OptinMonster.

Po nawiązaniu połączenia możesz rozpocząć tworzenie nowej kampanii z twojego kokpitu OptinMonster. Po prostu przejdź do OptinMonster ” Kampanie i kliknij przycisk „Utwórz twoją pierwszą kampanię”.

Create a new campaign

Wtyczka pokazuje różne rodzaje kampanii i szablony do wyboru.

Możesz użyć dowolnego rodzaju kampanii i zintegrować z nią licznik czasu.

Choose type of OptinMonster campaign

Aby uzyskać więcej informacji, zobacz ten poradnik krok po kroku, jak utworzyć kampanię z licznikiem czasu w OptinMonster.

Metoda 3: Dodanie widżetu odliczającego kamienie milowe za pomocą SeedProd

SeedProd to najlepszy motyw i kreator stron docelowych dla WordPress. Jego kreator typu „przeciągnij i upuść” pozwala tworzyć niesamowite strony docelowe i dodawać licznik czasu, aby przyciągnąć uwagę twojego użytkownika.

Aby korzystać z funkcji licznika czasu, wymagana jest wersja SeedProd Pro. Dzięki planowi Pro można również uzyskać dostęp do różnych szablonów, bloków stron do konfiguratora, integracji z marketingiem e-mail i nie tylko.

SeedProd Preview of Countdown Timer

Pierwszą rzeczą, którą musisz zrobić, jest zainstalowanie i włączanie wtyczki SeedProd Pro na twojej witrynie internetowej WordPress. Aby uzyskać więcej informacji, zobacz nasz przewodnik krok po kroku, jak zainstalować wtyczkę WordPress.

Po włączaniu zostaniesz przekierowany do SeedProd w twoim obszarze administracyjnym WordPress. Zostaniesz poproszony o klucz licencyjny, który możesz uzyskać z twojego konta SeedProd. Po wpisz klucz licencyjny, możesz kliknąć przycisk „Zweryfikuj klucz”.

Enter your license key

Następnie możesz utworzyć nową stronę docelową, przechodząc do SeedProd ” Strony.

SeedProd pozwala skonfigurować różne rodzaje stron, w tym strony „coming soon”, strony logowania, własne strony koszyka WooCommerce i strony 404.

Możesz także utworzyć inne strony docelowe, klikając przycisk „Utwórz nową stronę docelową”, takie jak strona z podziękowaniem lub strona umożliwiająca zapisanie się na webinar.

W tym poradniku użyjemy strony Coming Soon, ponieważ jest to świetne miejsce do dodania licznika czasu i przypomnienia odbiorcom o nadchodzącym produkcie lub wydarzeniu.

Select a landing page type

Następnie możesz wybrać szablon dla twojej strony docelowej. Istnieje również opcja stworzenia strony od podstaw przy użyciu pustego szablonu.

Zalecamy jednak korzystanie z szablonu, ponieważ oszczędza to czas i pomaga edytować projekt tak, jak chcesz.

Choose a page template

Na następnym ekranie zostaniesz przeniesiony do kreatora stron SeedProd typu „przeciągnij i upuść” w karcie Projektowanie.

Tutaj możesz dostosować stronę docelową, dodając i usuwając różne sekcje, bloki strony i formatując układ strony.

Aby dodać licznik czasu, po prostu przejdź do sekcji Zaawansowane bloki strony z lewego menu i umieść blok „Odliczanie” w dowolnym miejscu na twojej stronie.

Add the countdown timer block

Możesz także edytować różne sekcje twojej strony. Po prostu kliknij sekcję, a zobaczysz więcej opcji w menu po lewej stronie.

Można na przykład edytować tekst w polu, zmienić jego krój pisma, kolor lub wyrównać treść.

Edit page sections

Kiedy skończysz edytować wygląd twojej strony docelowej, możesz przejść do karty Połącz i zintegrować usługi e-mail marketingu.

SeedProd obsługuje popularne usługi, takie jak Drip, Constant Contact, Brevo, ConvertKit i inne.

Connect email marketing services

Następnie kliknij kartę Ustawienia strony, aby opublikować twoją stronę docelową z licznikiem czasu.

W ustawieniach ogólnych możesz zmienić „Status strony” z Wersja robocza na Opublikuj, a twoja strona zacznie działać.

Change the Page Settings

Następnie możesz przejść do ustawień „Kontroli dostępu” na karcie Ustawienia strony i zarządzać tym, kto może zobaczyć twoją stronę docelową.

Ta funkcja jest naprawdę przydatna, jeśli chcesz, aby niektóre osoby omijały witrynę wkrótce i pracowały nad rozwojem twojej witryny.

SeedProd pozwala również uwzględniać i wykluczać adresy URL, na których będzie wyświetlana strona coming soon. Domyślnie strona będzie widoczna na całej witrynie internetowej. Można to jednak zmienić, aby wyświetlała się tylko na stronie głównej lub pod określonymi adresami URL.

Edit Access Control settings

Następnie możesz zoptymalizować twoją stronę pod kątem wyszukiwarek, przechodząc do ustawień SEO.

SeedProd pozwala dodać tytuł SEO, opis, favicon i miniaturkę mediów społecznościowych.

Optimize your page for SEO

Jeśli chcesz dodać fragmenty kodu do swojego landing page’a, przejdź do sekcji „Skrypty” w Ustawieniach strony. Tutaj możesz dodać skrypty w nagłówku, treści i stopce twojej strony.

Na przykład, możesz dodać kod śledzenia Google Analytics w skryptach nagłówka, aby zobaczyć, jak ludzie korzystają z twojej strony docelowej.

Add scripts to your landing page

Gdy będziesz zadowolony, kliknij przycisk Zapisz. Możesz również wyświetlić podgląd twojej strony docelowej, aby wprowadzić ewentualne zmiany w jej wyglądzie.

Następnie musisz przejść do SeedProd ” Pages i zmienić status twojej strony na „Active”.

Change page status to Active

To wszystko. Twoja strona docelowa z licznikiem czasu będzie działać.

Użytkownik może teraz przejść na twoją witrynę internetową, aby zobaczyć licznik coming soon w działaniu.

Countdown timer preview

Mamy nadzieję, że ten artykuł pomógł ci dowiedzieć się, jak dodać widżet odliczania kamieni milowych w WordPress. Możesz również zapoznać się z naszym przewodnikiem na temat sprawdzonych sposobów zarabiania pieniędzy na blogu online za pomocą WordPressa lub naszym kompletnym przewodnikiem na temat tworzenia biuletynu e-mail.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Ujawnienie: Nasze treści są wspierane przez czytelników. Oznacza to, że jeśli klikniesz na niektóre z naszych linków, możemy otrzymać prowizję. Zobacz jak WPBeginner jest finansowany, dlaczego to ma znaczenie i jak możesz nas wspierać. Oto nasz proces redakcyjny.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

Najlepszy zestaw narzędzi WordPress

Uzyskaj BEZPŁATNY dostęp do naszego zestawu narzędzi - zbiór produktów i zasobów związanych z WordPressem, które każdy profesjonalista powinien mieć!

Reader Interactions

5 komentarzyZostaw odpowiedź

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Mrteesurez says

    Count down can also be use for FOMO to create fear of missing out or sense of emergency product sales especially when offering a huge discount for a product.
    Thanks for the post.

Zostaw odpowiedź

Dziękujemy za pozostawienie komentarza. Pamiętaj, że wszystkie komentarze są moderowane zgodnie z naszymi polityka komentarzy, a Twój adres e-mail NIE zostanie opublikowany. NIE używaj słów kluczowych w polu nazwy. Przeprowadźmy osobistą i konstruktywną rozmowę.