Support » Allgemeine Fragen » Video autoplay on mobile

  • Ich habe auf meiner Seite ein Video im header platziert. Es spielt auf allen Geräten und in allen Browsern automatisch im loop ab, so wie geplant. Auf Apple mobile geht das nicht. Hat jemand eine Idee wie ich das lösen kann?

    Ich habe bei meiner Recherche herausgefunden, dass es eine „playsinline“ Funktion gibt, die genau das ermöglichen soll! Ich weiß leider nicht, wie ich diese in den HTML Code von WP (Theme: Sydney) an die richtige Stelle einbinden kann.

    Referenz: hermesanna.de

    ——–english version———————————————————–

    I placed a video on autoplay with a loop in my header. It works perfectly fine on all devices with every browser, except apple mobile! There, the autoplay function is not working. Has someone any ideas how to fix this?

    While my research for a solution I´ve found a function „playsinline“, wich should solve this problem. But I don´t know where and how to add it to the HTML code of my WP-Theme Sydney.

    Referene: hermesanna.de

    Die Seite, für die ich Hilfe brauche: [Anmelden, um den Link zu sehen]

Ansicht von 5 Antworten - 1 bis 5 (von insgesamt 5)
  • Das scheint wohl ein Problem zu sein, das mit dem theme zusammenhängt, siehe hier. Insofern wäre es sinnvoll, wenn du dich direkt an den Entwickler wendest. Dieser Beitrag ist allerdings schon fast drei Jahre alt. Möglicherweise gibt es da mittlerweile eine Lösung.
    Außerdem ist das hier ein deutschsprachiges Forum. Insofern benötigen wir hier keine englische Übersetzung.

    Thread-Starter hermesanna

    (@hermesanna)

    Hallo Hans,

    Ja, es scheint nicht so einfach zu sein. Ich versuche es tatsächlich mal beim Entwickler. Den Beitrag habe ich auch schon gefunden und gelesen. Das ist die Lösung mit „playsinline“, die ich meinte. Nur ist mir nicht bewusst, wo genau ich diesen Code platzieren soll.

    VG
    Anna

    Zunächst der Hinweis, dass die Lösung mit dem Video nicht optimal ist:
    Zum einen sind 2MB Video für eine Webseite, die sonst keinerlei Informationen enthält, recht üppig. Wer unterwegs (mit schlechtem Datenempfang) auf dem Smartphone deine Website rasch öffnen möchte, um deine Telefonnummer herauszufinden, wird sich über die Ladezeiten nicht unbedingt freuen. Für Suchmaschinen ist eine Startseite ohne Inhalt (das Video wird ja nicht als Inhalt indexiert) auch nicht ideal. So gesehen würde ich eher eine andere Lösung anstreben. Aber das war ja eigentlich nicht deine Frage.

    Für die Einbindung des Videos verwendet das Theme eine mit WordPress 4.7 eingeführte Funtion the_custom_header_markup();, die den Header jenachdem ob du ein Bild oder Video verwendest, in passendes HTML packt. Diese Funktion erlaubt nur sehr wenige Anpassungen, etwa in Höhe und Breite des Videos, aber nicht die Ergänzung weiterer Attribute wie hier das gewünschte playsinline.

    Deshalb kannst du dir vermutlich nur behelfen, indem du dem Tag per JavaScript nachträglich das Attribut zuweist. Dazu kannst du das Plugin Code Snippets installieren und dort folgenden Code-Schnipsel hinzufügen:

    add_action( 'wp_head', 'pix_change_video_tag' );
    
    function pix_change_video_tag() {
    	echo '<script>';
    	echo "(function(window, document, undefined){
    		  window.onload = init;
              function init(){ 
    		   var videoElement = document.getElementById( 'wp-custom-header-video' );
               videoElement.setAttribute('playsinline', 'playslinline');
        }
        })(window, document, undefined);";
    	echo '</script>';
    }

    Allerdings bin ich mir nicht sicher, ob diese nachträgliche Änderung des HTML-Tags rechtzeitig ausgeführt wird, um das Videos auf dem iPhone automatisch zu starten und leider habe ich im Moment auch kein iPhone irgendwo rumliegen, um die Funktion zu testen. Also: Ausprobieren!

    Thread-Starter hermesanna

    (@hermesanna)

    Hallo @pixolin,

    ich danke dir für deinen Lösungsvorschlag. Ich habe alles genau so gemacht, wie du es geschrieben hast. Leider funktioniert es auf dem iPhone immer noch nicht, auch bei längerem Warten nicht. Hast du vielleicht eine Idee woran es liegen kann? Oder einer andere Idee, mit der ich das Problem lösen kann?

    Ich habe schon daran gedacht es mit einem GIF zu probieren, allerdings lässt der Header-Bereich keine GIF´s zu.

    Viele Grüße
    Anna

    Tut mir leid, da muss ich passen. ¯\_(ツ)_/¯

Ansicht von 5 Antworten - 1 bis 5 (von insgesamt 5)
  • Das Thema „Video autoplay on mobile“ ist für neue Antworten geschlossen.