Jak dodać piękne osie czasu wydarzeń w WordPress

Czy chcesz dodać piękną oś czasu wydarzenia do twojej witryny internetowej WordPress?

Historia może być skomplikowana, zwłaszcza gdy istnieje wiele różnych dat, faktów i innych informacji do zrozumienia. Tworząc oś czasu wydarzeń, możesz pokazać historię swojej firmy, osobistą oś czasu lub dowolną serię wydarzeń w bardziej angażujący sposób.

W tym artykule pokażemy, jak można dodać piękną oś czasu wydarzenia w WordPress.

Dlaczego warto dodać piękną oś czasu wydarzenia w WordPress?

Wielu właścicieli witryn internetowych WordPress korzysta z osi czasu, aby pokazać serię powiązanych ze sobą wydarzeń w ładnie zorganizowany i atrakcyjny wizualnie sposób.

Firmy i organizacje często używają osi czasu, aby pokazać swoją historię. Na przykład firma zarządzająca WPBeginner, Awesome Motive, pokazuje oś czasu, w jaki sposób rozwinęliśmy się z prostego bloga do rodziny wtyczek premium WordPress.

Jeśli prowadzisz bloga podróżniczego lub witrynę internetową poświęconą fotografii, możesz również pokazać swoje zdjęcia na ładnej pionowej osi czasu, która pokazuje twoją podróż dookoła świata. Może to być bardziej angażujące niż napisanie twojej historii i dodanie jej do witryny jako strony zwykłego tekstu.

Jak dodać oś czasu wydarzenia w WordPress

Najprostszym sposobem na dodanie osi czasu wydarzenia w WordPress jest użycie wtyczki Cool Timeline.

Wtyczka ta utworzy nowy obszar Timeline Addons w kokpicie WordPress, w którym można zbudować twoją oś czasu. Korzystając z tego obszaru dodatków, możesz dodać każde wydarzenie osobno, wpisując rodzaj tytułu i opisu, ustawiając obrazek wyróżniający i dodając inne ważne informacje, jak widać na poniższym obrazku.

Po zakończeniu dodawania wydarzeń, Cool Timeline wyświetli wszystkie te relacje z wydarzeń na tej samej osi czasu. Oś czasu można następnie dodać do dowolnej strony lub wpisu.

Ta metoda jest idealna, jeśli chcesz wyświetlać tę samą oś czasu wiele razy na twojej witrynie internetowej. Pozwala ona jednak na utworzenie tylko jednej osi czasu.

Inną opcją jest użycie Cool Timeline Block, aby wizualnie zbudować oś czasu w edytorze bloków WordPress.

Dodając wiele bloków Cool Timeline Blocks do twojej witryny internetowej, możesz wyświetlać różne osie czasu w różnych częściach witryny. Metoda ta nie pozwala jednak na wielokrotne wykorzystanie tej samej osi czasu w twojej witrynie internetowej, chyba że sam zapiszesz ją jako wzorzec bloku.

W tym przewodniku omówimy obie metody. Bez względu na to, w jaki sposób zbudujesz swoją oś czasu, będziesz musiał zainstalować i włączyć wtyczkę Cool Timeline. Jeśli potrzebujesz więcej szczegółów, zapoznaj się z naszym przewodnikiem na temat instalacji wtyczki WordPress.

Gdy już to zrobisz, możesz utworzyć twoją oś czasu za pomocą menu Timeline Addons lub edytora bloków. Jeśli wolisz od razu przejść do konkretnej metody, możesz skorzystać z poniższych odnośników.

• Metoda 1. Jak utworzyć oś czasu wydarzenia wielokrotnego użytku przy użyciu menu dodatków osi czasu
• Metoda 2. Jak utworzyć wiele osi czasu wydarzeń w WordPress przy użyciu bloku osi czasu

Metoda 1. Jak utworzyć oś czasu wydarzenia wielokrotnego użytku przy użyciu menu dodatków osi czasu

Menu Timeline Addons to nowa sekcja kokpitu WordPress, w której można utworzyć każde wydarzenie osobno. Cool Timeline doda następnie wszystkie te wydarzenia do osi czasu, gotowej do wyświetlenia na twoim blogu lub witrynie internetowej WordPress.

Aby utworzyć twoje pierwsze wydarzenie, przejdź do Timeline Addons ” Add New Story. Następnie możesz nadać temu wydarzeniu tytuł, wpisując go w polu Dodaj tytuł.

W głównym edytorze możesz przejść dalej i wpisać cały rodzaj tekstu, który chcesz wyświetlić na swojej osi czasu. Zazwyczaj będzie to opis wydarzenia.

Gdy już to zrobisz, czas kliknąć odnośnik „Ustaw obrazek wyróżniający”.

Możesz teraz wybrać obrazek, który będzie reprezentował wydarzenie na twojej osi czasu. Możesz kliknąć, aby wybrać obrazek z multimediów WordPress lub przesłać nowy plik obrazu z twojego komputera.

Jeśli potrzebujesz pomocy w tworzeniu profesjonalnie zaprojektowanych obrazków na twoją oś czasu, zapoznaj się z naszą ekspercką listą najlepszych programów do projektowania stron internetowych.

Następnie przewiń do sekcji Ustawienia relacji na osi czasu. Tutaj kliknij pole „Data / rok relacji”. Możesz teraz użyć wyskakującego okienka kalendarza, aby wybrać godzinę i datę wydarzenia.

Można również wybrać „Pełny” lub „Mały” obrazek dla wydarzenia.

Na poniższym obrazku można zobaczyć przykład „Pełnego” obrazka.

Większe obrazki przyciągną uwagę odwiedzającego do najważniejszych wydarzeń na osi czasu. Pełne obrazki zajmują jednak więcej miejsca.

Poniższy obrazek przedstawia to samo zdarzenie, ale tym razem z „małym” obrazkiem.

Jeśli chcesz dodać wiele różnych wydarzeń do twojej osi czasu, możesz użyć ustawienia „Mały”.

Dzięki temu twoja oś czasu nie będzie wyglądać na zagraconą.

Po wprowadzeniu tych zmian, przewiń do góry strony i kliknij przycisk „Opublikuj”.

Możesz teraz powtórzyć te kroki, aby utworzyć więcej zdarzeń.

Chcesz zobaczyć wszystkie wydarzenia, które utworzyłeś do tej pory? W takim razie po prostu przejdź do Timeline Addons ” Cool Timeline Stories.

Po utworzeniu wszystkich wydarzeń, następnym krokiem jest dostosowanie wyglądu osi czasu na twojej witrynie internetowej. Aby to zrobić, przejdź do Dodatki osi czasu ” Ustawienia osi czasu.

Aby rozpocząć, upewnij się, że wybrana jest karta „Ustawienia ogólne”.

W polu „Tytuł osi czasu” możesz wpisać rodzaj tytułu, który będzie wyświetlany nad twoją osią czasu.

Cool Timeline może również wyświetlać obrazek nad osią czasu, taki jak logo twojej firmy. Może to pomóc wzmocnić twój branding i poinformować odwiedzających, co pokazuje oś czasu.

Aby dodać ten opcjonalny obrazek, kliknij przycisk „Prześlij”.

Możesz teraz wybrać obrazek z twojej biblioteki multimediów WordPress lub przesłać nowy plik z komputera.

Jeśli dodasz dużo tekstu do osi czasu, może ona zacząć wyglądać na zagraconą i nieatrakcyjną.

Mając to na uwadze, możesz ustawić maksymalną liczbę słów, które będą wyświetlane na osi czasu. Następnie możesz dodać odnośnik „Dowiedz się więcej” dla wszystkich odwiedzających, którzy chcą dowiedzieć się więcej o wydarzeniu.

Aby ustawić maksymalny limit słów, wystarczy wpisać rodzaj liczby w polu Długość treści.

Jeśli ustawisz limit, dobrym pomysłem jest dodanie odnośników „Dowiedz się więcej” do twojej osi czasu. Cool Timeline doda ten odnośnik do każdego opisu, który przekracza twój limit słów.

Aby dodać ten odnośnik, znajdź sekcję „Wyświetlić Dowiedz się więcej?”. Następnie kliknij przycisk „Tak”.

Możesz teraz zdecydować, czy kliknięcie odnośnika „Dowiedz się więcej” spowoduje wyświetlenie reszty twojego tekstu w tej samej karcie, czy w nowej karcie przeglądarki. Aby dokonać tego wyboru, wystarczy kliknąć przycisk opcji „Ta sama karta” lub „Nowa karta”.

Domyślnie oś czasu pokazuje rok, w którym miało miejsce każde wydarzenie. Nie zawsze jednak konieczne jest wyświetlanie tej informacji, na przykład jeśli wszystkie wydarzenia miały miejsce w tym samym roku.

Aby ukryć etykietę roku, wystarczy kliknąć na pokaz slajdów „Etykieta roku”, aby zmienić ją z „Pokaż” na „Ukryj”.

Domyślnie pierwsze wydarzenie na twojej osi czasu pojawi się po prawej stronie pionowej linii osi czasu.

Chcesz zamiast tego wyświetlić to wydarzenie po lewej stronie osi czasu? Kliknij przycisk „Po lewej” obok opcji „Pionowa oś czasu, od której rozpoczynają się relacje”.

Kiedy będziesz zadowolony z twoich zmian, kliknij przycisk Zapisz, aby zapisać zmiany.

Następnie kliknij kartę „Ustawienia stylu”.

Domyślnie oś czasu nie ma tła.

Jeśli chcesz, możesz dodać kolorowe tło do swojej osi czasu, klikając pokaz slajdów Tło osi czasu, aby zmienić go z „Nie” na „Tak”.

Następnie kliknij przycisk obok opcji „Kolor tła relacji”.

Możesz teraz wybrać kolor tła za pomocą ustawień próbnika kolorów.

Ten ekran ma również podobne ustawienia kolorów dla wszystkich różnych części twojej osi czasu, w tym linii pionowej i tytułów wydarzeń.

Aby zmienić dowolny z tych domyślnych kolorów, wystarczy kliknąć przycisk sekcji, a następnie użyć wyświetlonego próbnika kolorów.

Gdy będziesz zadowolony z wprowadzonych zmian, nie zapomnij kliknąć przycisku Zapisz.

Następnie kliknij kartę Ustawienia typografii. Tutaj możesz zmienić wielkość i krój pisma używanego dla różnych treści na twojej osi czasu, takich jak tytuł osi czasu i tytuł relacji.

Jeśli zmienisz domyślne ustawienia typografii, nie zapomnij zapisać swoich zmian, klikając przycisk Zapisz.

Po zakończeniu konfiguratora osi czasu możesz dodać ją do swojej witryny internetowej.

Po prostu otwórz stronę lub wpis, w którym chcesz wyświetlić oś czasu, a następnie kliknij przycisk +.

Teraz wpisz „Cool Timeline”. Ta wtyczka ma kilka różnych bloków, więc upewnij się, że kliknąłeś „Cool Timeline Shortcode Block”.

Teraz możesz zaktualizować lub opublikować twoją stronę w normalny sposób.

Teraz, jeśli przejdziesz na twoją witrynę internetową, zobaczysz oś czasu na żywo.

Metoda 2. Jak utworzyć wiele osi czasu wydarzeń w WordPress przy użyciu bloku osi czasu

Możesz również zbudować piękną oś czasu wydarzenia w WordPressie za pomocą edytora bloków i „Cool Timeline Block”.

Ten blok zawiera wiele treści zastępczych. Aby zbudować swoją oś czasu, wystarczy zastąpić każdy element zastępczy własnym tekstem i obrazkami. W ten sposób zbudujesz swoją oś czasu w bardziej wizualny sposób.

Aby rozpocząć, po prostu otwórz stronę lub wpis, do którego chcesz dodać oś czasu.

Następnie możesz kliknąć ikonkę + i wpisać „Cool Timeline Block”. Gdy pojawi się ten blok, kliknij, aby dodać go do strony lub wpisu.

Blok Cool Timeline zawiera cztery zdarzenia zastępcze.

Aby rozpocząć, kliknij pierwsze wydarzenie na osi czasu. W menu po prawej stronie zastąp symbol zastępczy „Nagłówek relacji” nagłówkiem, którego chcesz użyć dla tego wydarzenia.

Następnie wpisz opis w polu „Opis relacji”.

Następnie znajdź pole „Primary Label (Date/Steps)”. W tym miejscu wpisz rodzaj daty wystąpienia zdarzenia.

Domyślnie blok Cool Timeline pokazuje pierwsze zdarzenie po prawej stronie osi czasu.

Jeśli wolisz, możesz wyświetlić zdarzenie po lewej stronie pionowej linii, klikając przycisk opcji „Po lewej”.

Blok Cool Timeline zawiera obrazek zastępczy dla każdego wydarzenia. Aby zastąpić ten symbol zastępczy twoim własnym obrazkiem, po prostu kliknij przycisk „Usuń”.

Gdy to zrobisz, kliknij przycisk „Prześlij/Wybierz obrazek”.

Następnie możesz wybrać obrazek z biblioteki multimediów WordPress lub przesłać nowy plik z twojego komputera.

Domyślnie Cool Timeline Block wyświetla każdy obrazek w pełnym rozmiarze. Jeśli zamiast tego chcesz wyświetlić mniejszy obrazek, po prostu otwórz menu rozwijane „Rozmiar obrazka” i wybierz „Średni” lub „Miniaturka”.

Po kliknięciu na różne rozmiary obrazków, blok zostanie zaktualizowany, aby pokazać nowy obrazek. Pozwala to na wypróbowanie różnych rozmiarów, aby zobaczyć, co wygląda najlepiej na twojej witrynie internetowej.

Domyślnie oś czasu oznacza każde zdarzenie na linii pionowej za pomocą kropki. Zwykłą kropkę można zastąpić własną ikonką. Można na przykład użyć różnych ikonek dla różnego rodzaju zdarzeń.

Aby przyjrzeć się różnym konfiguratorom ikon, których możesz użyć na swojej osi czasu, po prostu kliknij „Custom (Font Awesome Icon)”.

Następnie kliknij ikonkę strzałki. Możesz teraz przewijać różne ikonki.

Gdy znajdziesz ikonkę, której chcesz użyć w tym wydarzeniu, po prostu kliknij ją.

Możesz teraz dostosować pozostałe zdarzenia zastępcze, postępując zgodnie z tym samym procesem opisanym powyżej.

Jeśli chcesz dodać więcej wydarzeń do osi czasu, po prostu kliknij ikonkę „Dodaj relację”.

Spowoduje to utworzenie nowego zdarzenia zastępczego, gotowego do dostosowania.

Gdy jesteś zadowolony z wyglądu osi czasu, możesz zaktualizować lub opublikować stronę w normalny sposób. Jeśli przejdziesz na swoją witrynę internetową, zobaczysz teraz oś czasu na żywo.

Mamy nadzieję, że ten artykuł pomógł ci dowiedzieć się, jak dodać piękną oś czasu wydarzenia do twojej witryny internetowej WordPress. Warto również zapoznać się z naszym przewodnikiem na temat śledzenia odwiedzających twoją witrynę internetową WordPress oraz najlepszych usług telefonii biznesowej dla małych firm.

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.