TechBlogSD - Wszystko do WordPressa i tworzenia stron internetowych
Instrukcje WEB i WordPress, nowości, recenzje motywów i wtyczek

Jak dodać odtwarzacz audio w witrynie WordPress bez wtyczki?

17

Media są bardzo ważne, aby przyciągnąć użytkowników i zatrzymać ich na swojej stronie. Możesz łatwo osadzić YouTube i inne filmy na swoim WordPressie. Podobnie, jeśli chcesz osadzić dźwięk w swojej witrynie, oto jak możesz to zrobić. WordPress ma zintegrowany odtwarzacz audio HTML5, który w prosty sposób prezentuje Twoje pliki audio. Możesz utworzyć odtwarzacz z pojedynczym dźwiękiem lub z wieloma plikami audio jako listę odtwarzania. W tym artykule wyjaśnimy, jak dodać odtwarzacz audio w witrynie WordPress przy użyciu domyślnego krótkiego kodu audio.



Dodaj dźwięk do WordPressa bez wtyczki

WordPress ma wbudowany krótki kod audio do wstawiania odtwarzacza audio HTML5 do swoich postów, stron i widżetów. Obsługuje wszystkie obsługiwane typy plików HTML5, takie jak .mp3, .egg i .wav.

Wstawianie pojedynczego pliku audio

Podobnie jak w przypadku innych obrazów i filmów, prześlij plik audio za pomocą przycisku „Dodaj multimedia" w edytorze postów WordPress. Po przesłaniu pliku wprowadź szczegóły utworu na ekranie multimediów. WordPress umożliwia dodawanie szczegółów utworu, takich jak tytuł audio, nazwę wykonawcy, nazwę albumu, podpis i opis pliku audio, jak pokazano poniżej.

Jak dodać odtwarzacz audio w witrynie WordPress bez wtyczki?

Dodawanie szczegółów ścieżki pliku audio w WordPress

Mimo że odtwarzacz dźwięku pojedynczego pliku nie używa tych informacji na ekranie, szczegóły te są wyświetlane na liście odtwarzania. Przewiń w dół do końca okienka i sprawdź, czy wybrałeś opcję "Osadź odtwarzacz multimedialny". Należy go wybrać z menu rozwijanego obok „Umieść lub link” w sekcji „Ustawienia wyświetlania załączników”.

Jak dodać odtwarzacz audio w witrynie WordPress bez wtyczki?

Wybierz opcję osadzania odtwarzacza multimediów

Jest to ważne ustawienie, które umożliwia WordPressowi wstawienie odtwarzacza audio zamiast linkowania do pliku multimedialnego lub strony załącznika. Kliknij przycisk „Wstaw do postu”, aby dodać plik do posta WordPress. WordPress automatycznie doda odtwarzacz audio HTML5.

Poniżej znajduje się przykład domyślnego odtwarzacza audio HTML5 wstawionego za pomocą krótkiego kodu audio.

Odtwarzacz audio ma minimalną kontrolę z przyciskami odtwarzania / pauzy, pasek postępu pokazujący czas trwania, regulację głośności i pasek głośności. Domyślny odtwarzacz audio jest responsywny i zajmuje dostępną szerokość w oparciu o szerokość przeglądarki. Opublikowany artykuł będzie miał ten sam odtwarzacz audio, który widzisz w edytorze postów.

Dostosowywanie krótkiego kodu audio

Teraz kliknij zakładkę „Tekst” w edytorze, aby zobaczyć, że plik audio zasadniczo używa skrótu do wyświetlania jako odtwarzacz.

[if lt IE 9]><script>document.createElement('audio');</script><![endif]

Chociaż shortcode zawiera zarówno znaczniki otwierające, jak i zamykające, zamykający znacznik dźwiękowy nie jest obowiązkowy. Możesz także dodać zapasowe pliki audio, korzystając z poniższego krótkiego kodu. W takim przypadku, jeśli wystąpi problem z odtwarzaniem pliku .mp3, WordPress wybierze opcję awaryjną .ogg, a następnie .wav.

Audio Player

Opcje zapętlania i autoodtwarzania można dodać, jak poniżej:

Audio Player

Pamiętaj, aby włączyć opcję autoodtwarzania tylko wtedy, gdy jest to wymagane, aby zapewnić dobre wrażenia użytkownika.

Wstawianie listy odtwarzania

Kliknij przycisk „Dodaj multimedia” w edytorze postów, a następnie kliknij opcję „Utwórz listę odtwarzania audio”. Prześlij lub wybierz żądane pliki audio do wyświetlenia na liście odtwarzania i kliknij przycisk „Utwórz nową listę odtwarzania”.

Jak dodać odtwarzacz audio w witrynie WordPress bez wtyczki?

Tworzenie listy odtwarzania audio w WordPress

Zostaniesz przeniesiony do ekranu edycji listy odtwarzania, jak pokazano poniżej. Przeciągnij i upuść pliki, aby zmienić kolejność odtwarzania i zmienić podpisy, jeśli to konieczne.

Jak dodać odtwarzacz audio w witrynie WordPress bez wtyczki?

Edycja listy odtwarzania audio w WordPress

W okienku „Ustawienia listy odtwarzania” po prawej stronie włącz lub wyłącz listę utworów, nazwę wykonawcy i polecane obrazy, które mają być wyświetlane w odtwarzaczu audio lub nie.

Na koniec kliknij „Wstaw listę odtwarzania audio”, a zobaczysz odtwarzacz audio z listą odtwarzania, jak poniżej:

Jak dodać odtwarzacz audio w witrynie WordPress bez wtyczki?

Odtwarzacz audio z listą odtwarzania w WordPress

Uwaga: Aby dodać polecany obraz do plików audio, przejdź do menu „Media > Biblioteka”. Edytuj przesłane pliki audio i dodaj wyróżniony obraz do każdego pliku audio.


Powiązane artykuły:


Dostosowywanie krótkiego kodu listy odtwarzania

Po przejściu do zakładki „Tekst” ponownie zauważysz, że WordPress używa skrótu do wstawiania listy odtwarzania, jak poniżej:

[playlist ids="xxx,xxx,xxx"]

Aby dostosować listę odtwarzania, możesz dodać następujące parametry:

Parametr Domyślna wartość Inne możliwe wartości Opis
rodzaj audio wideo Zmień odtwarzacz audio na odtwarzacz wideo (musisz mieć przesłane wymagane filmy).
zamówienie ASC DESC W porządku rosnącym lub malejącym
identyfikatory Identyfikatory załączników Oddzielone przecinkiem
wykluczać pusty Wpisz identyfikatory załączników Wprowadzone identyfikatory zostaną wykluczone z listy odtwarzania
Lista utworów prawda fałszywe Pokaż lub ukryj playlistę
numery utworów prawda fałszywe Pokaż lub ukryj numery utworów na liście odtwarzania
obrazy prawda fałszywe Pokaż lub ukryj wyróżniony obraz w odtwarzaczu
artyści prawda fałszywe Pokaż lub ukryj nazwę wykonawcy na liście odtwarzania
styl lekki ciemny Zastosuj jasną lub ciemną skórę

Na przykład możesz zmienić domyślny odtwarzacz w stylu jasnym na styl ciemny i wyłączyć numery utworów na liście, używając następującego krótkiego kodu:

[playlist ids="xxx,xxx,xxx" style="dark" tracknumbers="false"]

Wstaw odtwarzacz audio w pasku bocznym i stopce

Cel używania shortcode jest bardzo prosty – można go umieścić w dowolnym obszarze witryny, takim jak pasek boczny i stopka. W sekcji „Wygląd > Widżety” przeciągnij i upuść widżet „Tekst” na pasku bocznym lub w obszarze stopki, w którym chcesz dodać odtwarzacz.

Jak dodać odtwarzacz audio w witrynie WordPress bez wtyczki?

Dodaj odtwarzacz audio w obszarze widżetów

Wstaw skróty audio lub listy odtwarzania z dostosowaniem, jak wyjaśniono powyżej. Zapisz widżet, a odtwarzacz zostanie wyświetlony w wybranym obszarze widżetów.

Ostatnie słowa

Chociaż wbudowane osadzenie audio jest dobrą opcją, jest proste i może nie spełnić, gdy potrzebujesz pełnej konfiguracji odtwarzacza audio. Alternatywne opcje to użycie wtyczki odtwarzacza audio lub osadzenie odtwarzacza audio ze stron internetowych innych firm, takich jak SoundCloud.

Źródło nagrywania: webnots.com
Leave A Reply

Ta strona korzysta z plików cookie, aby poprawić Twoje wrażenia. Zakładamy, że nie masz nic przeciwko, ale możesz zrezygnować, jeśli chcesz. Akceptuję Więcej szczegółów