Najlepszy Mega Przewodnik do korzystania z wideo z WordPress

Wyświetlanie wideo w witrynie może być potężnym sposobem pokazania – a nie tylko mówienia-odwiedzającym, o co chodzi w Twojej witrynie.

Filmy. Są wszędzie. Niezależnie od tego, czy jest to strona internetowa, aplikacja, media społecznościowe czy YouTube. Przyciągają naszą uwagę, zmuszają nas do oglądania, a my się uzależniamy. Więc tak-wyświetlanie wideo w witrynie WordPress może być rzeczywiście potężne na wiele sposobów.

Dobrym przykładem jest to, że filmy mają najwyższe udziały i zaangażowanie tuż obok zdjęć. W rzeczywistości 54% konsumentów chce zobaczyć więcej treści wideo.

Co więcej, 8 na 10 osób kupiło oprogramowanie lub aplikację po obejrzeniu filmu, a 88% specjalistów od marketingu wideo zgłasza, że są zadowoleni z zwrotu z inwestycji w marketing wideo w mediach społecznościowych.

Ale jeśli masz fantastyczny pomysł na film lub już go masz, jak go dodać do swojej witryny? W tym ostatecznym przewodniku omówimy wszystko, co musisz wiedzieć o Wideo, od szczegółów technicznych na temat współczynników proporcji i kodeków, po self-hosted versus hosted video, kodowanie filmów dla wielu urządzeń i rozpoczęcie przesyłania filmów do witryny WordPress.

Zaczynajmy.

  1. Wspólne Terminy Wideo Zdefiniowane
  2. Przesyłanie i dodawanie typów plików wideo do WordPress
  3. Jakich Ustawień Należy Używać?
  4. Self Hosted vs Hosted Videos
  5. Przesyłanie filmów do WordPress
  6. Przesyłanie filmów do biblioteki multimediów
  7. Porady Naszego Wewnętrznego Eksperta Wideo Joshuy Dailey
  8. Kodowanie filmów dla wielu urządzeń
  9. Wyświetlanie responsywnych filmów w WordPress
  10. Streszczenie

Wspólne Terminy Wideo Zdefiniowane

Zanim zagłębimy się w sposób, w jaki filmy działają z WordPress, pomocne może być najpierw zapoznanie się z powszechnymi definicjami, jeśli chodzi o filmy. W szczególności zrozumienie terminów używanych podczas przesyłania i wyświetlania filmów w witrynie może pomóc w wyeliminowaniu nieporozumień.

A jeśli uważasz, że znasz już terminy wideo na wylot, poniższe definicje mogą być pomocnym przypomnieniem.

For professional videos on your site, the 16:9 aspect ratio is usually best.
W przypadku profesjonalnych filmów na twojej stronie zwykle najlepszy jest Współczynnik Proporcji 16: 9.

Proporcje obrazu – termin ten jest najczęściej używany do zdjęć, telewizorów i wideo.

Odnosi się do proporcjonalnego rozmiaru obrazu lub ekranu w szerokości, a następnie długości w postaci stosunku.

Na przykład, wspólny współczynnik proporcji to 16:9, gdzie 16 jednostek to szerokość filmu lub obrazu, a dziewięć jednostek to długość.

Rozdzielczość-to inne słowo na jakość obrazu wideo i może być mierzona w pikselach na cal (PPI) lub częściej, kropki na cal (DPI). Jednostki te są używane do wyjaśnienia, ile kolorowych kropek (w przypadku drukowanych obrazów) lub ile kolorowych pikseli (w przypadku treści cyfrowych) na cal kwadratowy jest wyświetlanych w obrazie lub filmie. Wyższy DPI lub PPI oznacza wyższą rozdzielczość i lepszą jakość. Standardem dla wideo wysokiej jakości (HQ)jest 300 PPI.

Jeśli chodzi o wyświetlanie wideo, rozdzielczość jest zwykle zapisywana w postaci szerokość x wysokość gdzie szerokość odnosi się do liczby wyświetlanych poziomych pikseli i wysokość liczba pikseli pionowych djest wyświetlany na ekranie.

Po napisaniu w krótkiej formie wygląda to tak wysokość p, lub użyć wspólnego przykładu, 1080p.

Standard Definition (SD) – wspólna rozdzielczość wideo to 640×480 lub 480p i jest uważana za standardową definicję. Wideo w standardowej rozdzielczości wydaje się wielkości starszego, głównie kwadratowego telewizora.

High Definition (HD) – większość telewizorów i monitorów komputerowych wykonanych dzisiaj jest w 1920×1080 lub znanych również jako 1080p. obraz jest wyraźny i wyraźny, ponieważ monitory i ekran są przeznaczone do filmów o wysokiej rozdzielczości.

Istnieją również inne rozdzielczości, które są uważane za wysoką rozdzielczość, takie jak 1920×720. Obejmuje to również proporcje 2,39:1 i 1,85: 1, które są uważane za super panoramiczne i są powszechnie używane do filmów, które można sprawdzić w swoim ulubionym kinie.

Przeplot-starszy sposób wyświetlania sygnałów wideo na ekranie. Sygnały wysyłają poziome linie wideo na ekran, które razem tworzą ruchome obrazy. Filmy z przeplotem wyświetlają każdą inną poziomą linię I przełączają się między nieparzystymi i parzystymi numerowanymi liniami.

Jeśli nadal masz duży telewizor box, który kupiłeś w latach 90-tych, filmy na nim będą wyświetlane jako przeplot. To był stary standard dla filmów.

Remember the big, old TVs?
Pamiętasz te duże, stare telewizory?

Skanowanie progresywne – jest to nowy standard dla filmów. Wyświetlanie sygnałów wideo każdy pozioma linia zapewnia bogatszy i bardziej wysokiej jakości obraz, w przeciwieństwie do przeplatanej alternatywy, która wyświetla każdą inną linię.

Jeśli kupiłeś telewizor z płaskim ekranem lub monitor, ponieważ zostały one po raz pierwszy wykonane, będziesz właścicielem ekranu, który wyświetla filmy ze skanowaniem progresywnym.

Liczba klatek na sekundę – jest to prędkość, z jaką czujnik rejestruje wideo w ciągu sekundy. Pojedyncza klatka wygląda jak fotografia. Kiedy połączysz każdą klatkę razem, otrzymasz ruchomy obraz lub innymi słowy, wideo.

Klatek na sekundę (FPS) – termin ten jest używany do opisania liczby klatek używanych na Sekundę wideo. Typowe FPS to 24, 25, 29.97, 30 i 50. Jeśli masz film, który ma 30 klatek na sekundę lub więcej, jest uważany za HD.

Szybkość transmisji-określa ilość danych przesyłanych na sekundę podczas przesyłania wideo, zwykle mierzona w megabitach na sekundę (MB / s) lub kilobitach na sekundę (kbps).

Jeśli znajdziesz hosta wideo, który przesyła filmy z bitrate mniejszym niż 1000 kbps, najlepiej poszukać innego hosta, ponieważ proces przesyłania będzie zbyt wolny dla większości ludzi.

Kompresja – chociaż termin ten może dotyczyć więcej niż tylko filmów, w tym przypadku oznacza to zmniejszenie ilości danych przechowywanych w pliku wideo.

To świetny pomysł, aby skompresować swoje filmy, ponieważ będą one przesyłać do witryny lub hostingu wideo szybciej. Jeśli zdecydujesz się umożliwić użytkownikom pobieranie wideo, będzie to również znacznie szybsze.

Każda usługa hostingu wideo może mieć różne wytyczne i sugestie dotyczące kompresji, więc warto przyjrzeć się, jeśli zdecydujesz się hostować swoje filmy poza witryną WordPress.

Stratny – podczas kompresji pliku wideo kompresja stratna oznacza, że jakość wideo spada w porównaniu do oryginalnego pliku. Pomimo gorszej jakości kompresja stratna zwykle skutkuje mniejszym rozmiarem pliku.

Bezstratny – byłoby to przeciwieństwem stratny, gdy you kompresują plik wideo. Podczas gdy kompresja bezstratna oznacza, że oryginalny plik i skompresowany plik mają tę samą jakość wideo, zwykle powoduje to większy rozmiar pliku w porównaniu do stratnych plików skompresowanych.

Lossy compression is lower in quality and smaller in file size than lossless compression.
Kompresja stratna ma niższą jakość i Mniejszy Rozmiar Pliku niż kompresja bezstratna.

Kodek-jest to najczęściej metoda kompresji i dekompresji wideo. Jest również znany jako pojemnik.

Oprogramowanie, które kompresuje filmy, jest również często określane jako kodek, jeśli może zarówno kompresować, jak i dekompresować filmy. Jeśli może tylko kompresować filmy, jest powszechnie określany jako koder, a oprogramowanie, które tylko dekoduje, jest zwykle nazywane dekoderem.

Popularne kodeki to H. 264 / MPEG-4, VP6 i WMV.

Kodowanie-opisuje proces pobierania oryginalnego (źródłowego) pliku wideo i konwertowania go z jednego rozszerzenia do drugiego w celu przeglądania na różnych urządzeniach i przeglądarkach.

Na przykład, konwersja pliku wideo o nazwie myvideo.mov na myvideo. mp4 umożliwia przesyłanie i odtwarzanie wideo w witrynie WordPress.

Ponieważ różne przeglądarki i urządzenia mobilne akceptują różne rodzaje formatów plików wideo, kodowanie filmów może pomóc zapewnić, że filmy są widoczne dla wszystkich odwiedzających, bez względu na to,jak zdecydują się wyświetlić film.

Video

Przesyłanie i dodawanie typów plików wideo do WordPress

Mówiąc o kodowaniu, istnieją pewne rozszerzenia plików wideo, które WordPress pozwala domyślnie przesyłać.

  • .MP4,M4V (MPEG-4)
  • .MOV (QuickTime)
  • .WMV (Windows Media Video)
  • .AVI
  • .MPG
  • .OGV (Ogg)
  • .3GP (3GPP)
  • .3G2 (3GPP2)

Istnieje wiele typów plików, które nie są domyślnie akceptowane ze względów bezpieczeństwa. Jeśli nie potrzebujesz typu pliku, który nie jest akceptowany przez WordPress, najlepiej po prostu go nie używać.

Error message in WordPress: File type not permitted.
Jeśli spróbujesz przesłać Typ pliku, który nie jest jeszcze zaprogramowany w WordPress, pojawi się błąd.

Jeśli nadal chcesz pozwolić sobie i użytkownikom przesyłać więcej typów plików, które nie są domyślnie dozwolone, możesz to zrobić, dodając kod na dole szablonu funkcje.php plik pod wp-content > themes > your-theme.

Pamiętaj tylko, że wszelkie zmiany wprowadzone do funkcji motywu.plik php zostanie usunięty po zainstalowaniu aktualizacji do motywu.

Aby temu zapobiec, możesz utworzyć motyw potomny. Jeśli potrzebujesz wskazówek, jak to zrobić, sprawdź nasz post Jak stworzyć motyw potomny WordPress.

Oto kod, który musisz dodać, aby dołączyć dodatkowe typy plików:

Aby dodać wybrane rozszerzenie pliku, zmień rozszerzenie word on line four na rzeczywiste rozszerzenie pliku, które chcesz dodać, a następnie zamień mime / type na prawidłowy typ mime, który możesz znaleźć na liście typów MIME z FreeFormatter.com.

Aby dodać drugie rozszerzenie pliku, Zmień doc oraz zastosowanie / msword do twojego dewywołane rozszerzenie i typ na linii szóstej. Możesz również usunąć tę linię, jeśli chcesz dodać tylko jeden typ pliku.

Jeśli chcesz usunąć Typ pliku z listy akceptowanych typów plików, dodając inne, dodaj ten kod:

Dodałbyś go do tego samego miejsca, do dołu funkcje.php plik znaleziony pod wp-content > themes > your-theme.

Pamiętaj tylko, aby edytować linię ósmą, aby odzwierciedlić rozszerzenie, które chcesz usunąć. W tym przykładzie zmienisz exe na typ pliku, który chcesz wyeliminować.

W przypadku instalacji wielostanowiskowych po dodaniu powyższego kodu do motywu musisz dodać rozszerzenie pliku za pomocą Pulpitu nawigacyjnego super admin > Ustawienia > Ustawienia sieciowe. W obszarze Prześlij Typ pliku wprowadź rozszerzenie pliku, który chcesz dodać, upewniając się, że każdy typ pliku jest oddzielony pojedynczą spacją.

Po zakończeniu dodawania rozszerzeń do listy kliknij Zapisz zmiany na dole strony.

Ty i Twoi użytkownicy możecie teraz przesyłać dodane typy plików.

Jeśli wolisz unikać dodawania kodu do swojego motywu,nadal możesz dodać rozszerzenia plików, które chcesz za pomocą wtyczki WP Add MIME Types plugin lub wtyczki Media Library Assistant.

Jakich Ustawień Należy Używać?

Zanim zaczniesz przesyłać swoje filmy, możesz się zastanawiać, jakie ustawienia powinieneś wybrać, aby zapewnić, że będą dobrze wyświetlane. Pod koniec dnia może to wyglądać inaczej dla każdego, zwłaszcza jeśli zdecydujesz się przesłać do usługi hostingu wideo, ponieważ każdy z nich zwykle ma swoje własne zalecane ustawienia.

Z drugiej strony, jeśli sam hostujesz swoje filmy, ogólna zasada może być pomocna w podejmowaniu decyzji, jak powinny wyglądać ustawienia dla konkretnego projektu.

Te zalecane przez Video4Change powinny Cię na dobry początek:

Format: MP4

Wideo

  • Kodek: H264 (High profile)
  • Liczba klatek na sekundę: 24, 25 lub 30 (stała)
  • Rozmiar klatki / Rozdzielczość: 1280 x 720 (720p)
  • Pola: Progresywne
  • Bitrate: 5000-10000 kbps

Audio

  • Kodek: AAC-LC
  • Bitrate: 320 kbit / s
  • Częstotliwość próbkowania: 44.100 lub 48,000 kHz (zachowaj oryginalną częstotliwość próbkowania)

Należy tylko pamiętać, że wyższy bitrate spowoduje większy rozmiar pliku, więc jeśli twoim celem jest utrzymanie porządku i szczelności, wybierz bitrate bliżej 5000 kilobitów na sekundę.

Teraz jesteś prawie gotowy, aby przesłać swoje filmy.

Video

Self Hosted vs Hosted Videos

Przed zagłębianiem się w tajniki dodawania filmów do witryny, ważne jest, aby najpierw zrozumieć, gdzie powinny być przechowywane filmy. W tym celu istnieją dwie opcje: self-hosted i hosted.

Samodzielne hostowanie filmów oznacza, że są one przechowywane na serwerze w witrynie WordPress.

Opcja hostowana oznacza, że Twoje filmy są przechowywane w innym miejscu i połączone lub osadzone w Twojej witrynie.

Istnieje wiele powodów, dla których wybrałbyś jeden nad drugim, a oto kilka wskazówek, które pomogą Ci określić, która opcja jest odpowiednia dla Ciebie:

  • Czy planujesz wyświetlać wiele filmów o wysokiej jakości lub wysokiej rozdzielczości? Jeśli tak, limit miejsca na serwerze może szybko się wypełnić i może być właściwe hostowanie wideogdzie indziej.
  • Rodzaj hostingu, który skonfigurowałeś, jest ważny:
    • Hosting współdzielony – Jeśli jesteś w stanie załadować nawet jeden wysokiej jakości film o dużym rozmiarze pliku, uważaj się za szczęściarza. Zdecydowanie rozważ hosting swoich filmów gdzie indziej.
    • Hosting VPS – Możesz mieć wystarczająco dużo miejsca na przechowywanie kilku filmów, o ile nie planujesz ciągłego dodawania kolejnych w miarę upływu czasu.
    • Hosting dedykowany – Powinieneś być dobry, aby przejść i mieć sporo miejsca na wiele filmów, chociaż w zależności od konfiguracji i jeśli chcesz dodać wiele filmów w czasie, być może będziesz musiał później uaktualnić.
  • Aby dobrze hostować filmy, upewnij się, że Twoja witryna i serwer są zoptymalizowane pod kątem szybkości – upewnij się, że twój serwer ma dużą ilość pamięci RAM i dość dużą prędkość procesora. Kwota, której potrzebujesz, zależy od liczby filmów, które planujesz samodzielnie hostować. Ogólnie rzecz biorąc, wideo o rozmiarze 1GB powinno wygodnie pasować do planu hostingowego, który ma dwa i pół gigabajta pamięci RAM, co najmniej dwurdzeniowy procesor i 1500 MB przestrzeni dyskowej.
  • Upewnij się, że masz wystarczającą przepustowość przydzieloną do pakietu hostingowego – ilu gości oczekujesz? Jeśli uważasz, że Twoja witryna wybuchnie popularnością, powinieneś rozważyć, ile przepustowości może wykorzystać Twoja witryna. Im więcej gości oczekujesz, tym większa przepustowość będzie Ci potrzebna. Aby dać ci wyobrażenie o tym, ile przepustowości możesz potrzebować, jeden gigabajt wideo odtworzonego lub pobranego 1000 razy potrzebuje jednego terabajta przepustowości (to jest 1000 GB). Jeśli planujesz wyświetlać wiele wysokiej jakości filmów z mnóstwem wizyt w Twojej witrynie, powinieneś rozważyć hosting swojej witryny gdzieś indziej niż własny serwer.

Jeśli twój serwer nie ma dużo miejsca, prędkości i przepustowości, zdecydowanie rozważ hostowanie filmów poza serwerem. Jeśli masz dużo miejsca na serwerze, a także mnóstwo prędkości i przydzielonej przepustowości, ale chcesz hostować mnóstwo filmów z tysiącami odwiedzających, rozważ również hostowanie swoich filmów gdzieś indziej niż serwer.

Z drugiej strony, jeśli masz serwer z tonami przestrzeni dyskowej, kilkoma szybkimi procesorami i dużą przepustowością dającą Ci oddech, powinieneś być w stanie hostować co najmniej kilka filmów o wysokiej rozdzielczości bez problemów.

Jeśli nadal nie jesteś pewien, czy masz wystarczająco dużo zasobów do hostowania własnych filmów, ale chcesz, to świetny pomysł, aby zapytać zespół obsługi klienta dostawcy hostingu. Mogą najlepiej pomóc uporządkować najlepszą opcję dla konkretnych potrzeb.

Przesyłanie filmów do WordPress

Dzięki wprowadzeniu Gutenberga przesyłanie wideo i audio do WordPress nigdy nie było łatwiejsze. Teraz wystarczy kilka kliknięć i jesteś gotowy do pracy.

Jeśli zdecydowałeś się na samodzielne hostowanie swoich filmów, oto jak dodać je do swojej witryny WordPress.

Dodawanie filmów do posta lub strony

W edytorze bloków jest już blok wideo, do którego możesz po prostu przesłać swój film, a następnie umieścić go w dowolnym miejscu w swoim poście lub stronie.

Where you find the audio block in Gutenberg.
Gdzie znajdziesz blok audio w Gutenbergu.

Tutaj możesz pobrać wideo, przesyłając, bibliotekę multimediów lub wstawiając adres URL.>

Ponieważ przesyłasz, możesz kliknąć opcję przesyłania.

Example of Gutenberg video block.
Przykład bloku wideo Gutenberga.

Wybierz plik, prześlij swoje multimedia i to wszystko.

Jeśli wolisz korzystać z klasycznego edytora, w poście lub na stronie kliknij przycisk Dodaj Multimedia, a następnie kliknij kartę Prześlij Multimedia u góry, jeśli nie jesteś jeszcze na tej karcie, gdy otworzy się wyskakujące okienko inline.

Adding media in a post
Przesyłanie wideo bezpośrednio do posta jest łatwe.

Następnie kliknij przycisk Wybierz pliki, który pojawia się na środku strony.

Selecting files to upload
Możesz również wybrać już przesłany plik, wybierając kartę Biblioteka multimediów.

Wybierz plik wideo, który chcesz przesłać, i postępuj zgodnie z instrukcjami komputera.

Attachment display settings
Jeśli nie chcesz osadzać filmu, dostępne są inne opcje.

Po przesłaniu pliku Wprowadź tytuł, podpis i opis zgodnie z potrzebami po prawej stronie i upewnij się, że opcja osadzanie Odtwarzacza multimedialnego jest wybrana z rozwijanego pola osadzanie lub łącze w ustawieniach wyświetlania załącznika. Powinien być wybrany domyślnie.

Na koniec kliknij Wstaw do postu, a Twój film zostanie dodany do Twojego postu lub strony wraz z miniaturą.

Dodawanie listy odtwarzania wideo do posta lub strony

Jeśli przesłałeś dwa lub więcej filmów, możesz utworzyć listę odtwarzania.

Create video playlist menu item
Tworzenie listy odtwarzania wideo jest tak proste, jak wybranie filmów z listy w bibliotece multimediów.

Aby to zrobić, kliknij ponownie przycisk Dodaj Multimedia, wybierz Utwórz listę odtwarzania wideo z menu po lewej stronie wyskakującego okienka, a następnie kliknij ikony filmów, które chcesz dodać.

Jeśli popełnisz błąd, po prostu kliknij znacznik wyboru w prawym górnym rogu ikony filmu, który chcesz usunąć.

Możesz także kliknąć Wyczyść link u dołu okna, aby odznaczyć wszystkie wybory.

Po zakończeniu selekcji kliknij każdy film, aby dodać tytuł, podpis i opis po prawej stronie dla każdego z filmów, a następnie kliknij przycisk Utwórz nową listę odtwarzania wideo u dołu sekcji Szczegóły załącznika.

W tym momencie możesz edytować tytuły wybranych filmów, dodać więcej filmów, klikając Menu Dodaj do listy odtwarzania wideo po lewej stronie i odwrócić kolejność wybranych filmów, klikając przycisk Odwróć kolejność obok ustawień listy odtwarzania po prawej stronie.

Pod ustawieniami znajdują się dwa pola wyboru:

  • Pokaż listę wideo-Ta opcja wyświetla Twoje filmy z miniaturką.
  • Pokaż obrazy-zaznaczenie tego ustawienia wyświetla tekstową listę filmów.

Po zakończeniu selekcji kliknij przycisk Wstaw listę odtwarzania wideo w prawym dolnym rogu.

Na koniec, ale nie mniej ważne, być pamiętaj, aby kliknąć przycisk Publikuj lub Aktualizuj na swoim poście lub stronie, aby zapisać zmiany.

Przesyłanie filmów do biblioteki multimediów

Jeśli chcesz przesłać filmy, ale nie chcesz od razu wstawiać ich do postu,możesz to zrobić, przechodząc do Media > Dodaj nowy w panelu administratora i klikając Wybierz pliki przycisk. Postępuj zgodnie z monitami komputera, aby wybrać i przesłać film.

Po zakończeniu przesyłania kliknij ikonę pliku, która pojawia się na stronie po zakończeniu ładowania paska. W wyświetlonym wyskakującym okienku SZCZEGÓŁY załącznika kliknij łącze Edytuj więcej szczegółów na dole.

Po załadowaniu strony Edytuj Media możesz łatwo dostosować ustawienia filmów, edytując tytuł, dodając podpis i opis.

Na tej stronie powinieneś również zobaczyć obraz podglądu wyświetlany w podglądzie odtwarzacza. Jeśli chcesz zmienić wyświetlany obraz i ustawić własny do wyświetlania, kliknij łącze Ustaw wyróżniony obraz w prawym dolnym rogu strony.

Powinno się pojawić wyskakujące okno programu Media uploader, w którym można wybrać obraz z biblioteki multimediów.

Set featured image link on the edit media page.

Set featured image link on the edit media page.
Możesz zmienić wiele ustawień na stronie edytuj Multimedia, w tym ustawienie polecanego obrazu wideo.

Na tej stronie powinieneś również zobaczyć obraz podglądu wyświetlany w podglądzie odtwarzacza. Jeśli chcesz zmienić wyświetlany obraz i ustawić własny do wyświetlania, kliknij łącze Ustaw wyróżniony obraz w prawym dolnym rogu strony.

Powinno się pojawić wyskakujące okno programu Media uploader, w którym można wybrać obraz z biblioteki multimediów.

Możesz również przesłać nowy plik, klikając Prześlij pliki > wybierz pliki, a następnie postępując zgodnie z monitem komputera.

Dodaj tytuł, podpis, tekst alternatywny i opis, a następnie kliknij przycisk Ustaw wyróżniony obraz w prawym rogu przycisku.

Na koniec kliknij przycisk Aktualizuj, a nowy polecany obraz i inne zmiany powinny zostać zapisane. Twój film jest teraz gotowy do dodania do postu lub strony w dogodnym dla Ciebie czasie.

Pamiętaj tylko, że aby Twoje filmy miały możliwość osadzenia w Twoich postach i stronach i były odtwarzane za pomocą domyślnego odtwarzacza WordPress, Twoje pliki wideo będą musiały być zakodowane za pomocą kodeka MPEG – 4 lub innymi słowy, mają rozszerzenie .mp4.

Jeśli chcesz wybrać inny odtwarzacz wideo, inny niż domyślny, z którym pochodzi WordPress, sprawdź nasze bezpłatne wtyczki wideo WordPress do zaawansowanego osadzania.

Porady Naszego Wewnętrznego Eksperta Wideo Joshuy Dailey

Poprosiłem naszego kamerzystę Joshuę Dailey o radę podczas pracy z wideo, a w szczególności o to, jakich porad udzieliłby firmom pracującym z wideo.

Joshua kieruje, pisze i skryptuje filmy produktowe tutaj w WPMU DEV i ma pomoc od innych utalentowanych kamerzystów w naszym zespole.

dth= ” 490 “height =” 312 ” / >Video guy Joshua Dailey.

“Pracujemy nad tym, aby dać użytkownikom lepsze zrozumienie produktów WPMU DEV i WordPress, aby mogli podejmować szybsze, świadome decyzje o tym, które produkty najlepiej pasują do ich potrzeb.”- Joshua Dailey

Video experts at WPMU DEV.
“Pracujemy nad tym, aby dać użytkownikom lepsze zrozumienie produktów WPMU DEV i WordPress, aby mogli szybciej podejmować świadome decyzje o tym, które produkty najlepiej pasują do ich potrzeb. Dzięki naszym samouczkom staramy się pomóc ludziom rozpocząć pracę tak szybko, jak to możliwe.”- Joshua Dailey

“Dzięki naszym samouczkom staramy się pomóc ludziom rozpocząć pracę tak szybko, jak to możliwe.”- Joshua Dailey

Oto lista Top 10 Joshua dla najlepszych praktyk UI i UX, w żadnej konkretnej kolejności:

1. Znajdź odpowiedniego hosta

Ważne jest, aby znaleźć taki, który może zaspokoić wszystkie twoje potrzeby przed przesłaniem ponad 100 filmów. Niezależnie od tego, czy jest to hosting własny, darmowy hosting, czy hosting premium, upewnij się, że Twój host nie tylko spełnia Twoje bieżące potrzeby, ale może i chce się rozwijać, aby zaspokoić twoje przyszłe potrzeby.

Przeniesienie WPMU DEV z Vimeo do Wistii było dużo pracy. Było warto, ale zaoszczędziłoby to dużo czasu i pieniędzy, gdybyśmy znaleźli je pierwsi. Możesz dowiedzieć się więcej o procesie przejścia w naszym artykule Dlaczego przenieśliśmy się z Vimeo Pro do Wistii – i dlaczego ty też powinieneś.

2. Filmy muszą być zakodowane

Upewnij się, że filmy są poprawnie zakodowane. Po pierwsze, aby uzyskać najlepsze wyniki, ale po drugie, do odtwarzania na wszystkich typach urządzeń. Jest to coś, o czym możesz początkowo nie myśleć, jeśli sam hostujesz swoje filmy.

Jeśli kiedykolwiek korzystałeś tylko z YouTube, Vimeo lub Wistii, ponownie kodują Twoje multimedia, aby Twoje filmy działały na wszystkich typach urządzeń – we wszystkich typach przeglądarek. Podczas samodzielnego hostingu może być konieczne przechowywanie wielu wersji tego samego filmu w różnych formatach lub wyświetlanie wideo może nie być możliwe w zależności od przeglądarki lub urządzenia, z którego korzysta.

3. Publiczność Na Całym Świecie Powinna Mieć Równy Dostęp

Jeśli Twoja witryna jest skierowana do użytkowników z całego świata, pamiętaj, że prędkości internetu mogą uniemożliwić niektórym użytkownikom dostęp do ciężkich treści wideo. Cały czas się to poprawia, ale daleko nam do równego dostępu na całym świecie.

Nie oznacza to, że nie powinieneś używać wideo, ponieważ jest to potężna forma komunikacji, ale oznacza to, że powinieneś zdawać sobie sprawę z tego, kim są Twoi odbiorcy podczas udostępniania. Ważne jest również, aby upewnić się, że używasz odpowiedniego odtwarzacza i metody kompresji.

4. Prezentacja Ma Znaczenie

Użytkownicy mogą łatwo pominąć klikanie wideo na podstawie samej miniatury. Pamiętaj, miniatury wideo mają znaczenie.

5. Przetestuj swoje filmy pod kątem wydajności

Wypróbuj swoje szalone pomysły, ale wiedz, kiedy działają, a kiedy nie. Poświęcamy dużo czasu na tworzenie filmów, dzielenie się nimi wewnętrznie i dostosowywanie treści przed ich uruchomieniem. Jest to ważny krok w zapewnieniu każdemu członkowi twojej publiczności równego i pełnego dostępu do Twoich filmów.

Always test the performance of your videos.
Zawsze testuj wydajność swoich filmów.

6. Poznaj Swoich Odbiorców

Gdy film jest published, spędzamy czas obserwując, jak użytkownicy wchodzą w interakcję z naszymi treściami i wprowadzają jeszcze więcej poprawek w razie potrzeby. Na przykład zrobiliśmy kilka długich, szczegółowych samouczków wideo na temat naszych wtyczek, ale okazało się, że krótkie przewodniki konfiguracji są bardziej dostępne dla większej liczby widzów.

Dzięki zaangażowaniu śledzenia widza w analitykę byliśmy w stanie określić, co preferują nasi odbiorcy, zwłaszcza że nie jest to takie samo we wszystkich firmach.

7. Dbaj o jakość

Dźwięk dobrze zrobiony często pozostaje niezauważony, a dźwięk źle zrobiony oszukuje widzów, wierząc, że cały film jest śmieciem. Zachowaj ostrożność podczas korzystania z wideo jako narzędzia sprzedaży, ponieważ jakość filmów odzwierciedla jakość produktu lub usługi.

8. Dokładnie Zaplanuj Swój Marketing Wideo

Klienci i użytkownicy końcowi utożsamiają jakość marketingu z jakością produktu, nawet jeśli nie jest to dokładne odzwierciedlenie. Mając solidną strategię marketingową pomaga utrzymać użytkownika końcowego zadowolony z firmy.

9. Filmy powinny być dostępne dla wszystkich

Według wstępnych badań z 2012 National Health Interview Survey szacuje się, że 20.6 milionów dorosłych Amerykanów zostało zgłoszonych jako mających problemy z widzeniem, nawet przy pomocy okularów i kontaktów lub są prawnie ślepi.

Gallaudet University w Waszyngtonie poinformował również, że od dziewięciu do 22 na 1000 Amerykanów ma poważne upośledzenie słuchu lub jest głuchy prawnie.Mając na uwadze te liczby, ważne jest, aby upewnić się, że Twoje filmy są dostępne dla osób, które mogą zidentyfikować te upośledzenia.

Przesyłanie dokumentów z napisami do filmów pomaga osobom niedosłyszącym z łatwością przeglądać filmy. Podobnie, w tym zapis filmów pomaga osobom niedowidzącym uzyskać dostęp do filmów.

Ważne jest również upewnienie się, że odtwarzacz wideo zawiera nawigację za pomocą klawiatury i obsługę czytników ekranu. Wszystkie filmy powinny być odtwarzane tylko po kliknięciu przycisku odtwarzania lub w inny sposób dostępne za pomocą klawiatury, aby być uważane za Dostępne.

Jeśli Twoje filmy są odtwarzane automatycznie po załadowaniu strony, nie są one dostępne i należy dostosować ustawienia.

Have you ever wondered how easy it is for people with disabilities to access your site and then navigate around it?
Czy kiedykolwiek zastanawiałeś się, jak łatwo jest osobom niepełnosprawnym uzyskać dostęp do twojej witryny, a następnie poruszać się po niej?

Nie wspominając już o prostym pomyśle, że filmy odtwarzane automatycznie mogą być często zaskakujące, zwłaszcza gdy użytkownicy nie są świadomi, skąd nagle dochodzi dźwięk lub jeśli głośność jest ustawiona na wysoką. Jest to również drenaż na rachunku internetowym większości użytkowników końcowych, ponieważ muszą płacić za przesyłanie strumieniowe filmów.

Może to nie być ogromny problem dla użytkowników komputerów stacjonarnych w domu lub w biurze, ale użytkownicy urządzeń mobilnych często mają znacznie mniejszy i ograniczony plan transmisji danych ze swoim operatorem, a każdy odtworzony film kończy się ich kosztem. Dlatego powinieneś rozważyć pominięcie tła wideo, choćby dla motywów mobilnych, a także wyeliminować filmy, które odtwarzają się automatycznie.

10. Responsywny Design i styl

Częścią utrzymania filmów dostępnych dla wszystkich użytkowników jest upewnienie się, że reagują na ekrany o różnych rozmiarach, od przeglądarek po urządzenia mobilne. Można to łatwo osiągnąć dzięki responsywnemu odtwarzaczowi, host wideo lub jakiś CSS.

Mając na uwadze te wskazówki, przyjrzyjmy się, w jaki sposób można osadzać filmy zakodowane na wielu urządzeniach i jak sprawić, aby filmy były responsywne dla filmów z własnym hostingiem.

Kodowanie filmów dla wielu urządzeń

Jak wspomniał Josh, łatwo jest zapomnieć, że hostowane przez siebie Filmy wymagają samodzielnego kodowania, ponieważ nie jest to wykonywane automatycznie, na przykład w przypadku wielu opcji hostingu wideo. Przeglądarki i urządzenia mobilne często mają różne wymagania, jeśli chodzi o metody kompresji wideo, które mogą być wyświetlane.

Po przesłaniu filmów do witryny WordPress możesz użyć skrótu wideo, aby wyświetlić je na poście lub stronie. Możesz także dodać parametry, aby niektóre pliki wideo były odtwarzane w zależności od urządzenia, z którego odwiedzający przeglądają stronę.

Oto jak wygląda shortcode z dołączonym pojedynczym filmem:

Aby użyć tego krótkiego kodu, wystarczy zmienić myvideo. mp4 na źródło wideo w bibliotece multimediów. Możesz nawet wpisać adres URL do zewnętrznego źródła, jeśli nadal chcesz korzystać z odtwarzacza wideo WordPress bez samodzielnego hostowania filmów.

Aby dodać alternatywne opcje plików wideo do odtwarzania na różnych urządzeniach, jest to kod skrócony z dołączonymi parametrami, których chcesz użyć:

Nie musisz poświęcać dużo czasu na definiowanie różnych urządzeń, które chcesz obsługiwać. Po prostu wprowadź źródło pliku wideo, tak jak w poprzednim przykładzie, jednocześnie podając prawidłowy typ pliku.

Gdy odwiedzający rozpocznie ładowanie strony, WordPress wykrywa typ pliku obsługiwanego przez urządzenie odwiedzającego i automatycznie ładuje ten plik wideo na stronie na podstawie tego krótkiego kodu. Całkiem fajne, nie sądzisz?

Na przykład, jeśli chcesz dodać flash (.flv) wideo do listy, należy wprowadzić spację po ostatnim parametrze, a następnie dodać flv= ” myvideo.flv ” i zapisać stronę lub post. Nie zapomnij zmienić myvideo.flv do rzeczywistego pliku wideo wymienionego w bibliotece multimediów lub URL do zewnętrznego źródła.

Typy plików, których możesz użyć z kodem wideo to: .MP4, .M4v,WEBM,OGV,WMV,FLV

Istnieją również inne opcje, które możesz dołączyć, inne niż plik źródłowy.

Dodanie dowolnej z poniższych opcji przed lub po src w powyższych przykładach dodaje różne funkcje do odtwarzacza WordPress.

  • plakat-dodaje obraz konkretnej funkcji do odtwarzacza wideo. Domyślnie ustawiona jest na none.
  • loop-dodaje funkcję automatycznego odtwarzania wideo w pętli. Aby to zrobić, ustaw go na ” on “zamiast domyślnego ustawienia, które jest” off.”
  • Autoodtwarzanie-jeśli jest ustawione na “on”, wideo może być automatycznie odtwarzane po wczytaniu strony. Domyślnie to ustawienie jest ustawione na “off”, co jest również naszym zaleceniem, aby pozostać w pełni dostępnym dla osób niedosłyszących i niedowidzących.
  • preload-Ustawia dane, które są ładowane automatycznie. Domyślnie jest to “metadane”, które ładują tylko metadane wideo, ale możesz wybrać” auto”, aby załadować wszystko lub” brak”, aby w ogóle nie załadować wideo.
  • wysokość-jeśli chcesz wyświetlić inną wysokość wideo niż domyślny rozmiar przesłanego wideo.
  • szerokość-możesz również zmienić szerokość w ten sam sposób, jeśli chcesz mieć inny rozmiar niż oryginalny film źródłowy w bibliotece multimediów.

Jeśli jesteś programistą i chcesz poeksperymentować z kodem do tego shortcode, można go znaleźć w media.php plik w folderze wp-includes.

Po dodaniu niestandardowego kodu wideo i zapisaniu zmian jesteś gotowy do pracy. To wszystko, co musisz zrobić, aby zapewnić odtwarzanie filmów na różnych urządzeniach i przeglądarkach. Naprawdę, to jest to!

Wyświetlanie responsywnych filmów w WordPress

Dzięki nowemu algorytmowi Google Twój ranking wyszukiwania może szybko wzrosnąć, jeśli Twoja strona nie jest w pełni responsywna. Google nie uważa również witryn, które wymagają przewijania w poziomie, aby były responsywne.

Filmy mogą być ogromnym przestępcą, jeśli nie jesteś ostrożny, więc ważne jest, aby przetestować swoją witrynę, aby upewnić się, że działa dobrze zarówno w przeglądarkach stacjonarnych, jak i mobilnych.

Na szczęście, jeśli używasz domyślnego odtwarzacza WordPress, Twoje filmy powinny być w pełni responsywne. Jeśli korzystasz z jednej z najlepszych usług hostingu wideo do wyświetlania filmów, prawdopodobnie możesz również przejść.

Czasami może to być problem, jeśli używasz niesprawdzonego odtwarzacza lub ramki iframe do wyświetlania filmów. Jeśli zdecydujesz się użyć innego odtwarzacza, upewnij się, że dokładnie przetestujesz go pod kątem responsywności.

Jeśli zdecydujesz się wyświetlać filmy za pomocą ramki iframe, ważne jest, aby dodać dodatkowy kod, aby zapewnić jego responsywność. Ważne jest, aby pamiętać, że wiele hostów wideo, takich jak YouTube i Vimeo, daje możliwość osadzania filmów za pomocą ramki iframe.

Prześlij kopię do swojej biblioteki multimediów, a następnie przejdź do plików WordPress. Na każdej stronie pliku używanego dla konkretnego motywu-lub przynajmniej typu strony, na której chcesz wyświetlać filmy. Na przykład możesz dodać ten skrypt do swojego / wp-content / themes / your-theme / page.plik php, aby móc wyświetlać responsywne filmy osadzone z ramkami iframe na stronach WordPress.

Edytuj plik i wywołaj skrypt w kierunku góry strony, po wszystkich początkowych notatkach na stronie.

Skrypt można nazwać tak:

Zapisz plik i to wszystko, co musisz zrobić. Nie jest to koniecznie najlepsze rozwiązanie, ponieważ Twoje filmy nie są gwarantowane, aby wyglądać świetnie.

Może to również stanowić problem, jeśli przeglądarka odwiedzającego nie załaduje skryptu. Dlatego użycie opcji player lub embed, o której wiesz, że jest w pełni responsywne, jest często najbezpieczniejszą opcją.

Streszczenie

Jak wykazano, filmy mogą być potężnym, łatwym do zwiększenia wrażeń widzów w witrynie WordPress.

Aby dowiedzieć się ciekawych sposobów integracji wideo z witryną, sprawdź niektóre z naszych innych postów: Korzystanie z terminów + do konfiguracji i usprawnienia konsultacji z klientami, jak dodać tło wideo do witryny WordPress w 4 prostych krokach i najlepsze wtyczki do czatu wideo WordPress – w zależności od Twoich potrzeb.

Tagi: