Jak stworzyć zaawansowany akordeon za pomocą Elementora

Odwiedzający witrynę lubią zwijane sekcje, aby szybko sprawdzić informacje i zwinąć je w zależności od swoich zainteresowań. Tak więc dobrze dostosowane zaawansowane akordeony pomagają utrzymać witrynę WordPress w czystości i płynniej korzystać z niej.

W tym przewodniku przeprowadzimy Cię krok po kroku przez proces tworzenia zaawansowanego akordeonu za pomocą Elementora.

Czym jest akordeon?

Akordeon to składany element umożliwiający ukrywanie i ujawnianie treści na stronie internetowej WordPress.
Możesz użyć akordeonu, aby uporządkować informacje w sekcje. Sekcje można rozwijać lub zwijać w razie potrzeby, oszczędzając miejsce i poprawiając doświadczenie użytkownika.

Korzyści ze stosowania zaawansowanych akordeonów w projektowaniu witryn WordPress

⭕ Zaawansowany akordeon Elementor zapewnia przejrzysty i uporządkowany sposób prezentacji informacji.

⭕ Możesz skróć czas ładowania strony ukrywając mniej ważne treści w akordeonach. Może to również poprawić rankingi Twojej witryny w wyszukiwarkach.

⭕ Dostęp do dodatkowych informacji za pomocą zaawansowanych akordeonów jest łatwy. Tak więc, może zachęcać użytkowników do eksploracji Twoja strona internetowa dalej. Ponadto akordeony są dostosowane do różnych stylów projektowania i układów.

⭕ Możesz zaprojektować zaawansowany akordeon WordPress zezwalaj użytkownikom niepełnosprawnym aby uzyskać dostęp do informacji.

Przedstawiamy Moduły i widżety ElementsKit! 😍😍😍

Jak utwórz zaawansowany akordeon w Elementorze

Chociaż widget akordeonu jest zawarty w Elementorze, możesz znaleźć ograniczone opcje stylizacji. Jeśli szukasz bardziej zaawansowanej personalizacji, rozważ użycie dodatku Elementor. 

Tutaj, wybraliśmy ElementsKit. Wtyczka oferuje zaawansowany widget akordeonu co pozwala ci stworzyć bardziej atrakcyjną wizualnie i funkcjonalną stronę internetową.

Jak utworzyć akordeon za pomocą ElementsKit

Widżet akordeonowy to rodzaj widżetu, który umożliwia tworzenie zwijanych sekcji w witrynie WordPress. Umożliwia organizowanie treści w wielu sekcjach, z których każda może być rozwijana lub zwijana, aby odsłonić jej zawartość. Jest to często używane do wyświetlania informacji w sposób kompaktowy i przyjazny dla użytkownika.

Krok 1: Pobierz wtyczkę ElementsKit

Dostęp do pulpitu WordPress:
1. Przejdź do Wtyczek
2. Kliknij Dodaj nową wtyczkę
3. Wyszukaj ElementsKit
4. Po znalezieniu kliknij przycisk Zainstaluj teraz

Możesz również pobierz wtyczkę ElementsKit z WordPress.org szybko. Następnie wystarczy przesłać go do sekcji wtyczek na pulpicie.

Jednakże, Advanced Accordion to profesjonalny widget ElementsKit. Nie spóźnij się! Wybierz elastyczny plan i ciesz się z łatwością tworzysz zaawansowane akordeony.

Krok 2: Aktywuj wtyczkę

Po zainstalowaniu wtyczki należy ją aktywować.

Krok 3: Włącz widget Zaawansowanego akordeonu

1. Przejdź do ElementsKit
2. Znajdź widżety
3. Znajdź Zaawansowany akordeon i włącz przycisk przełączający
4. Kliknij ZAPISZ ZMIANY

Krok 4: Otwórz stronę z pulpitu nawigacyjnego 

1. Przejdź do stron
2. Otwórz dowolną istniejącą stronę lub dodaj nową stronę
3. Kliknij Edytuj za pomocą Elementora (w przypadku nowej strony tę opcję znajdziesz po jej otwarciu)

Krok 5: Dodaj zaawansowany akordeon do edytora

Wyszukaj widżet według nazwy, kliknij go lub przeciągnij i upuść w edytorze.

Krok 6: Poznaj opcje dostosowywania

W części zawierającej treść zobaczysz –

• Akordeon:
  • Treść: Tutaj możesz dodać treść, edytować tytuł, przełączyć przycisk „pozostaw otwarte”
  • Pozostaw pierwszy suwak otwarty automatycznie: Jeśli chcesz pozostawić pierwszy slajd otwarty, możesz włączyć ten przycisk.
  • Ajaks: Jeśli włączysz tę opcję, zaktualizuje ona tylko odpowiednią zawartość akordeonu, zapewniając płynniejsze działanie użytkownika. Może to być szczególnie przydatne w przypadku dużej liczby elementów akordeonu.
  • Styl: Można wybierać spośród kilku stylów akordeonu.
• Ikona:
  • Pozycja ikony: Tutaj ustaw pozycję ikony.
  • Pokaż liczbę pętli: Możesz wyświetlić liczbę pętli lub ją ukryć.
  • Prawa ikona: Wybierz symbol, który wskazuje na prawo. Oznacza on rozszerzenie elementu akordeonu.
  • Prawa ikona aktywna: Wybierz ikonę, aby wskazać stan prawej ikony po jej kliknięciu lub dotknięciu.

W części poświęconej stylowi możesz dostosować akordeon, korzystając z następujących opcji –

• Tytuł: Tutaj możesz zmienić typografia, kolor, krój tła, cień pola, margines dolny itp. dla tytułów.
• Treść: Aby nadać styl zawartości akordeonu, możesz użyć różnych kolorów, typografii, promienia obramowania, wypełnienia itd.
• Granica: Aby zmienić typ obramowania, szerokość, kolor, cień pola itd. każdej zakładki lub akordeonu, możesz skorzystać z tej opcji.
• Ikona: Umożliwia dostosowanie marginesu, koloru i rozmiaru ikony.

Oto w skrócie, jak stworzyć zaawansowany akordeon za pomocą Elementora! ✌️

Dlaczego warto wybrać widżet ElementsKit Advanced Accordion zamiast widżetu Elementor Accordion?

Poznajmy pewne różnice między akordeonem ElementsKit Advanced i akordeonem Elementor.

💡 Dodaj wyjątkowości swojej witrynie WordPress, stosując Maskowanie obrazu Elementor!

Teraz twoja kolej

Teraz spróbuj sam! Z ElementsKit możesz skutecznie zawierają wyjątkowo zaawansowane akordeony do projektu Twojej witryny internetowej.

Porady dla Ciebie –

⭐ Eksperymentuj z różnymi opcjami personalizacji, aby uzyskać pożądany wygląd i funkcjonalność.

⭐ Weź pod uwagę ogólny projekt swojej witryny.

⭐ Przetestuj końcowy wynik na różnych urządzeniach i przeglądarkach.
⭐ Regularnie aktualizuj swoje akordeony.