Jak osadzić dźwięk z filmu z YouTube

Photo of author

By maciekx


Osadzanie filmów z YouTube jest stosunkowo proste. Na dole każdego wideo znajdziesz opcje udostępniania, które zawierają kod HTML potrzebny do wstawienia wideo na Twojej stronie. YouTube oferuje różne metody udostępniania, wszystkie skoncentrowane na filmach, co jest logiczne, biorąc pod uwagę, że to platforma do hostowania wideo. Warto jednak zaznaczyć, że wiele treści na YouTube to tylko dźwięk. Często w filmach występują dźwięki z niepowiązanymi obrazami, które są niezbędne do uzupełnienia sekcji „wideo”. Niestety, YouTube nie pozwala na udostępnienie ani osadzenie samego dźwięku z filmu – zawsze musisz dołączyć wideo. Jeśli chcesz zapoznać się z oficjalnymi opcjami osadzenia, istnieje prosty sposób, aby osadzić tylko dźwięk z filmu, opracowany przez Amita Agarwala, który stworzył fragment kodu do modyfikacji. Cała procedura opiera się na YouTube Javascript API, które udostępnił na GitHubie. Oto, jak to zrobić.

Krok 1: Zidentyfikuj wideo, które chcesz osadzić. Zanotuj „ID” filmu, które znajduje się w adresie URL po części „v=”, zaznaczone na poniższym zrzucie ekranu.

Krok 2: Wprowadź poniższy fragment kodu do HTML swojej strony, zastępując „VIDEO_ID” identyfikatorem wideo, który skopiowałeś wcześniej.

div data-video="VIDEO_ID"
data-autoplay="0"
data-loop="1"
id="youtube-audio">
</div>
<script src="https://www.youtube.com/iframe_api"></script>
<script src="https://cdn.rawgit.com/labnol/files/master/yt.js"></script>

Tak powinien wyglądać Twój kod.

Domyślnie dźwięk nie będzie odtwarzany automatycznie. Użytkownik musi kliknąć przycisk odtwarzania, aby uruchomić dźwięk. Możesz jednak wymusić automatyczne odtwarzanie i zapętlenie, wprowadzając kilka zmian w kodzie. Aby dźwięk zaczynał się automatycznie, zmień wartość „data-autoplay” na 1. Aby dźwięk był odtwarzany w pętli, ustaw „data-loop” na 1. Jeśli planujesz korzystać z tego kodu na swojej stronie internetowej i oczekujesz dużego ruchu, warto rozważyć hostowanie skryptu na własnym serwerze. Możesz pobrać skrypt z poniższego linku.

źródło: Digital Inspiration

Aktualizacja: 8 grudnia 2020 o 4:30


newsblog.pl