ElementsKit to kompletny dodatek do Elementora, który zawiera prawie wszystkie typy funkcji dla witryn WordPress, w tym widżet Elementor Audio Player.

Korzystając z widżetu Odtwarzacz audio, możesz osadzać muzykę na swojej stronie internetowej za pomocą przyjaznego dla użytkownika sterowania odtwarzaczem audio. Widżet zawiera kilka opcji przesyłania dźwięku, mnóstwo opcji dźwięku i sterowania oraz wiele innych.

Funkcje widgetu odtwarzacza audio: #

• Prześlij dźwięk za pośrednictwem biblioteki multimediów WordPress.
• Osadź dźwięk za pomocą adresu URL.
• Opcje audio, w tym automatyczne odtwarzanie, pętla i wyciszenie.
• Sterowanie odtwarzaniem i pauzą.
• Kontrola głośności.
• Kontrola paska postępu.
• Pokaż czas odtwarzania i całkowity czas trwania.
• Dostosuj wygląd odtwarzacza audio.

Krok 1: Włącz widżet odtwarzacza audio #

Po pierwsze, musisz włączyć widget z poziomu panelu WordPress. Aby włączyć widżet Odtwarzacz audio:

1. Nawigować do ElementsKit > Widżety.
2. Znaleźć Odtwarzacz muzyki z listy i włącz widget.
3. Kliknij na ZAPISZ ZMIANY.

Krok 2: Przeciągnij i upuść widżet #

Następnie przeciągnij i upuść widżet ElementsKit Audio Player do edytora Elementor.

Krok 3: Skonfiguruj widget odtwarzacza audio Elementor #

Możesz to zrobić na karcie Treść prześlij dźwięk i skonfiguruj Opcje dźwięku I Opcje sterowania odtwarzacza audio. Możesz użyć następujących opcji, aby skonfigurować odtwarzacz audio WordPress w Elementorze.

3.1 Źródło #

Możesz przesłać plik audio lub użyć adresu URL, aby dodać dźwięk do odtwarzacza. Dostępne są dwie opcje źródła dźwięku.

Źródło – hostowane samodzielnie: #

Jeśli jako źródło dźwięku wybierzesz opcję Self Hosted, możesz przesłać plik audio z biblioteki multimediów WordPress.

Wybierać „Self Hosted” jako źródło > Kliknij przycisk przesyłania > dodać plik audio z biblioteki multimediów.

Źródło – zewnętrzne: #

Wybierając źródło zewnętrzne, możesz osadzić dźwięk z Internetu wraz z jego adresem URL.

Wybierać „Zewnętrzne” jako źródło > wprowadź adres URL dźwięku w wymaganym polu.

3.2 Opcje audio #

Oto opcje audio dostępne w widżecie Odtwarzacz audio:

1. Automatyczne odtwarzanie: Włącz autoodtwarzanie, aby dźwięk był odtwarzany automatycznie po załadowaniu strony.
2. Pętla: Włącz tę opcję, aby odtwarzać dźwięk w pętli.
3. Niemy: Po włączeniu dźwięk jest początkowo wyciszony po uruchomieniu odtwarzacza. Użytkownicy muszą ręcznie wyłączyć wyciszenie dźwięku.

3.3 Opcje sterowania #

Oto opcje sterowania dostępne w widżecie Odtwarzacz audio:

1. Odtwórz pauzę: Umożliwia użytkownikom kontrolę odtwarzania/pauzy (przycisk).
2. Pasek postępu: Aby wyświetlić pasek postępu dźwięku w odtwarzaczu.
3. Obecny czas: Pokazuje bieżący czas odtwarzania w odtwarzaczu audio Elementor.
4. Całkowity czas trwania: Pokazuje całkowity czas trwania dźwięku.
5. Pasek głośności: Aby wyświetlić i kontrolować poziom głośności dźwięku.
6. Ukryj głośność na urządzeniach dotykowych:
7. Układ suwaka głośności: Dostępne są dwa układy paska głośności: poziomy i pionowy.
8. Objętość początkowa: Ustaw początkowy poziom głośności po uruchomieniu odtwarzacza.

Krok 4: Dostosuj style odtwarzacza audio Elementor #

Możesz dostosować styl przycisku pauzy odtwarzania, paska postępu, czasu i głośności w widżecie Odtwarzacza audio Elementor.

4.1 Przycisk pauzy w odtwarzaniu #

Aby dostosować przycisk pauzy w odtwarzaniu,

1. Poprawić Rozmiar przycisku.
2. Wybierz przycisk Kolor, Kolor tła, Pudełko Cień, I Typ obramowania dla przycisku.
3. Ustaw Promień granicy, Wyściółka, I Margines.

4.2 Pasek postępu #

Aby dostosować pasek postępu,

1. Możesz dostosować Wysokość paska postępu.
2. Wybierz Kolor tła paska postępu.
3. Ustaw Typ obramowania, Szerokość granicy, I Kolor ramki.
4. Poprawić Promień granicy paska postępu.

5. Załadowany pasek postępu: Możesz wybrać kolor tła załadowanego paska postępu.
6. Aktualny pasek postępu: Ustaw kolor tła i promień obramowania bieżącego paska postępu.
7. Najechanie w czasie: Wybierz kolor tła dla najechania kursorem na czas.

4.3 Czas #

Aby dostosować style czasu odtwarzacza audio Elementor,

1. Ustaw Typografia dla cyfr tekstu.
2. Wybierz Kolor i dostosuj Margines dla Obecny czas.
3. Wybierz Kolor i dostosuj Margines dla Czas trwania.

4.4 Objętość #

Aby dostosować style przycisku głośności,

1. Możesz dostosować Wysokość przycisku głośności.
2. Wybierz Kolor tła przycisku głośności.
3. Ustaw Typ obramowania, Szerokość granicy, I Kolor ramki.

4. Pasek głośności: Dostosuj wysokość, szerokość, kolor i style obramowania paska głośności.
5. Bieżący pasek głośności: Ustaw kolor i promień obramowania bieżącego paska głośności.

Wreszcie możesz korzystać z odtwarzacza audio na swojej stronie internetowej ze wszystkimi przydatnymi funkcjami. Widget Elementor Audio Player jest dostarczany z ElementKits Pro. Pobierz wtyczkę, aby w najprostszy sposób dodać dźwięk i muzykę do swojej witryny WordPress.