Ein Video soll auf der eigenen Jimdo-Website gezeigt werden. Doch geht die Einbindung auch ohne eigenen Youtube-Channel (oder von Vimeo oder einer anderen Quelle)?
Sicher, denn mit einem kleinen "Trick" kann man ein Video direkt auf der Website einbinden.
Eine kleine Anleitung.
Vor dem Start noch ein Tipp:
Schritt 1:
Legen Sie eine im Menü versteckte Unterseite an.
Schritt 2:
Fügen Sie das Inhaltselement "Dateidownload" hinzu und laden Sie die MP4-Datei auf Ihre Jimdo-Website.
Laden Sie auch noch ein angefertigtes Vorschaubild für das Video auf Ihre Website hoch.
Schritt 3:
Klicken Sie oben rechts auf das Bildschirm-ICON und wechseln Sie in die Besucheransicht.
Schritt 4:
Klicken Sie mit der rechten Maustaste auf das Datei-Download-Element und wählen Sie "Adresse des Links kopieren" aus.
Nehmen Sie sich ein Inhaltselement "Textfeld" und fügen Sie dort den kopierten Link ein (dann haben Sie ihn später sofort griffbereit)
Schritt 5:
Nun an die Stelle auf der Jimdo-Website wechseln, wo der Film für die Besucher sichtbar sein soll. Jetzt das Inhaltselement "Widget/HTML" einfügen.
Letzter Schritt:
Nun benötigen Sie den rechts abgebildeten HTML-Code:
- Gelb markiert => da muss der Link hinein, den Sie für das Vorschaubild in Schritt 4 kopiert haben
- Orange markiert => und hier der Link der MP4 Datei
Die Code-Schnipsel "Width" und "Height" geben Breite und Höhe des auszugebenden Films an. Wollen Sie die Fläche verringern, dann probieren Sie mal einen kleineren Wert einzusetzen (immer die gleichen Werte, ansonsten verzerren sich die Proportionen). Und einen weiteren Hinweis zu den Werten gleich nachfolgend in den Ergänzungen.
Kopierhilfe als Textversion siehe weiter unten im Text
Nachsatz:
Danke an Nadja Rothenbühler, die mir den "Anschubser" zu diesem Artikel gegeben hat.
Update I zum Artikel:
Tipp von Phillip Roth: "im Code-Schnipsel die Höhe auf Auto setzen (height=„auto“) und die Breite über Prozentangaben steuern (width=„100%“ oder width=„80%“ etc), dann wird das Video auch bei Responsive optimal dargestellt"
Super - aktualisiere ich gleich nachfolgend in der Textversion
Kannst Du den HTML-Code nochmal nochmal als Text angeben?
<video controls=“controls“ poster=“Hier die URL der JPG-Datei einsetzen“ width=“100%“ height=“auto“><source src=“Hier die URL der MP4 Datei“ type=“video/mp4“/></video>
Warum wird im HTML-Code auch eine JPG-Datei abgefragt?
Damit ich auch das Vorschaubild anzeigen kann.
Ich brauchte im Code noch nicht einmal die Url eines Vorschaubildes einfügen. Das Video wird automatisch mit Bild angezeigt.
Habe ich so noch nicht ausprobiert - danke für den Hinweis. Mit einem einem ansprechenden Bildmotiv oder einem selbst gestalteten Motiv lässt es sich jedoch noch ein Stückchen schöner machen.
Update II zum Artikel:
Tipp von Ernesto (siehe Kommentar unten):
Vielleicht wäre es noch gut, wenn du in deinem Artikel erwähnen würdest, dass das Video nicht grösser als 100 MB sein darf, sonst funktioniert der Upload zur Jimdoseite nicht (JimdoPro Abo).
Danke, Ernesto!
Update III zum Artikel:
Wenn der Code über die Zwischenablage kopiert wird, kann es sein, dass die Anführungszeichen nicht im erforderlichen Format kopiert werden. Bitte dann den Codeschnipsel auf der Website nochmal per Hand durchprüfen: Anführungszeichen löschen und über die Tastatur neu eingeben.
Ihnen hat mein Praxistipp gefallen?
Sie haben vielleicht noch einen ergänzenden Hinweis?
Ich freue mich auf Ihren Kommentar:
Organisation mit Sabine (Donnerstag, 12 November 2020 08:26)
yeah, hat funktioniert! Vielen Dank für die tolle Anleitung und liebe Grüße
Sabine
Martina (Freitag, 14 August 2020 15:59)
Vielen lieben Dank! Das hat tatsächlich funktioniert. Danke auch für die Updates. Das mit den Anführungszeichen war der letzte entscheidende Hinweis, dann funzte es. :-)
Christina (Donnerstag, 18 Juni 2020 20:10)
Lieber Andreas, danke für die tolle Anleitung.
Bei mir hat's leider nicht geklappt. Ich bekomme nach Schritt 5 die Meldung, dass „kein Video mit unterstütztem Format und MIME-Typ gefunden“ wurde.
Vielleicht auch ein Problem mit den überzähligen " ?
Ich versuche es die Tage noch mal.
P.S.: In der FreeVersion kann man kein .mp4 (mehr) als Download-Datei hochladen.
Das geht nur in der Bezahlversion.
Herzliche Grüße
Christina
Antonio (Mittwoch, 03 Juni 2020 15:56)
Klasse vielen Dank! Kann man auch irgendwo sehen wieviele Visualisierungen das Video hatte?
Makena (Samstag, 18 April 2020 17:43)
Ich versuche das jetzt schon seit 3 Stunden, aber es geht einfach nicht. Einmal ging zwar das Video, aber nicht mit dem Bild. Bitte um klare Schritt-für-Schritt Anleitung, für jemanden wie mich, die zwar eine jimdo-Webseite bearbeiten kann, aber keine Ahnung von Codes hat und wie diese (mit oder ohne und wenn wo die Anführungszeichen sein müssen) eingefügt werden. Vielen Dank.
Dj (Dienstag, 14 April 2020 10:34)
Super, lieben Dank für die Hilfe :)
Andreas d. M. (Donnerstag, 26 März 2020 16:54)
Vielen lieben Dank Andreas.
Super Anleitung, hat mir sehr geholfen. Schade das die Videos auf 100MB begrenzt sind.
Bleib gesund.
Viele Grüße
Andreas
Heinz Lindeman (Sonntag, 15 März 2020 20:42)
Ich brauche eine Möglichkeit, auf meiner Website (ich bin Trauerredner) eine mp3 mit meiner Rede "hinter" einem passenden Bild abzuspielen. Dazu habe ich mir Ihren HTML-Code (riesigen Dank dafür!) angepasst. Vielleicht nicht alles astrein, aber es funktioniert:
<video controls="controls" poster="URL zur jpg" width="100%" height="auto"><source src="URL zur mp3" type="audio/mp3" /></video>
Heinz Lindeman (Sonntag, 15 März 2020 14:00)
Super Anleitung, vielen Dank! Hatte erst auch das Problem mit den überzähligen ", aber jetzt klappt es prima. Ätsch, Youtube!
René Willemsen (Sonntag, 15 März 2020 12:16)
Hi Andreas,
Super wie du das machst hier weiter so. Ich habe aber eine Frage und weiss nicht ob das mit deine Art von Videos einbinden machbar ist. Ich würde gerne das Video über die ganze Breite von meiner Jimdo-Page laufen lassen. Beispiel wie bei treibholz.de. Ist das machbar, wenn ja wie?
Vielen Dank für deine Bemühungen.
René
Sonja (Dienstag, 03 März 2020 14:44)
Supergute Anleitung, vielen Dank lieber Andreas!
Es hat nicht auf Anhieb geklappt, weil durch die Link-Kopiererei ein paar Anführungszeichen zu viel im Code waren, aber nachdem ich die entfernt hatte, läuft jetzt alles :-)
Andreas (Freitag, 31 Januar 2020 19:25)
Antwort für Katrin:
da kann ich leider aus der Ferne nichts dazu sagen. Komm doch in meine Video-Sprechstunde und dann sehen wir uns das gemeinsam an
Anna (Montag, 27 Januar 2020 14:42)
Kleines Update; ich habe das mit dem Autoplay herausgefunden und sogar mit Loop, wenn gewünscht: <video controls controlsList="nodownload" video controls="controls" autoplay="autoplay" loop="loop" width="100%" height="100%"><source src="Url video" type="video/mp4"></source>
</video>
Oder ohne loop=”loop” wenn es nur 1x abgespielt werden soll.
Anna (Mittwoch, 22 Januar 2020 10:30)
Hallo, vielen Dank für die Anleitung, ohne die ich es nie geschafft hätte! Eine Frage habe ich noch: kann ich das Ganze so einstellen, dass das Video automatisch abgespielt wird und nicht erst beim Klick? LG & Danke
Katrin (Mittwoch, 15 Januar 2020 09:45)
Vielen Dank für die Anleitung, leider funktioniert das bei mir wie bei Jutta nicht, d.h. "Sehe nur ein schwarzes Rechteck mit Play Taste". Das Video ist mp4 und hat auch nur 22,3 MB... Kannst du mir vielleicht weiterhelfen?
Vielen Dank und viele Grüße
Katrin
Martin (Sonntag, 22 Dezember 2019 13:25)
Vielen Dank für die Anleitung! Bei mir hat es zunächst nicht funktioniert, obwohl ich genau nach der Anleitung vorgegangen bin. Nach einiger Zeit ist mir dann aufgefallen, dass die Anführungszeichen das falsche Format hatten. Ich habe dann “ in " geändert.
Lightsite Fotografie (Montag, 25 November 2019 16:09)
Ich bin dankbar für diesen Workaround. Funktioniert sehr gut, eben ohne einen Videochannel auf einer anderen Plattform eröffenen und verknüpfen zu müssen.
Andreas (Dienstag, 17 September 2019 16:04)
Hallo Anna,
ja so ein automatisches Abspielen des Videos wäre sicher cool. Aber dann bitte ohne Ton - denn man weiß ja nicht, wo der Betrachter gerade sitzt. Hmm - wenn ich hierzu etwas finde, dann werde ich eine Artikel-Ergänzung veröffentlichen.
Anna (Donnerstag, 12 September 2019 16:41)
Hej :)
Vielen Dank für diesen Tipp! Hat uns schon sehr weitergeholfen.
Gibt es die Möglichkeit, den Code noch so zu erweitern, dass das Video automatisch abgespielt wird, sobald Nutzer auf die Seite gelangen?
Andreas (Donnerstag, 22 August 2019 10:07)
Hallo Jutta,
ich befürchte, dass die Datei zu groß ist.
Auch mal einen kleineren Film austesten, ob der Weg klappt.
Gruß Andreas
Jutta Leder (Donnerstag, 22 August 2019 09:26)
Hallo Andreas,
vielen Dank für die tolle Erklärung, habe alles soweit hinbekommen nur lädt der Film nicht hoch.
Sehe nur ein schwarzes Rechteck mit Play Taste, nur hat es wohl nicht das unterstützte Format??
Ich habe 88,7 MB und eine MP4 Datei, kannst Du mir da helfen.
Bitte auf diekuechenlounge@web.de antworten
Viele Grüße
Jutta Leder
Susanne (Samstag, 11 Mai 2019 11:25)
Hallo Andreas,
war wohl doch der späten Stunde geschuldet....ich hatte ein " zuviel gesetzt. Jetzt läuft das Video. Herzlichen Dank für deine angebotene Hilfe und für diese tolle Anleitung.
Andreas (Samstag, 11 Mai 2019 06:43)
Hallo Susanne,
so spät noch am Rechner gewesen und für die Website gewerkelt - toll !
Vielleicht ist es ja doch nur eine Kleinigkeit - sollen wir mal gemeinsam drauf schauen => dann melde Dich direkt bei mich => ich unterstütze Dich da gern.
Susanne (Freitag, 10 Mai 2019 23:48)
Ich bin gem. Anleitung vorgegangen. Am Ende erscheint das Bild als Video. Aber man kann es nicht abspielen, d.h. der Play-Button läßt sich nicht drücken. Der Lautstärkeregler funktioniert dagegen tadellos.
Das Video ist kleiner 100 MB und konnte hoch geladen werden.
Ansonsten bin ich stolz auf mich überhaupt so weit gekommen zu sein. Die Anleitung ist super!
Andreas (Montag, 25 März 2019 15:09)
@Tina:
Download verhindern - nun, die Datei ist ein eingebundenes Element Deiner Website - und die ist leider komplett offen. ggf. gibt es hier via HTML/CSS ein paar Programmierschnipsel, di das verhindern können - dazu einen Programmierer befragen. Ansonsten mal schauen bei VIMEO - die bieten im kostenpflichtigen Account ein paar schicke Features ein - da kann man dann auch die Filme auf der eigenen Website einbinden und sich gegen das Herunterladen schützen.
Carmen (Sonntag, 24 März 2019 16:18)
Den Fehler habe ich im Backend nicht gesehen - vll lag das dann auch daran, dass die html Schrift zu klein war...
Im Frontend gibt es eine Einstellung, wo man den html Code sehen kann u dort waren überall doppelte "" davor u danach - davon habe ich jeweils eines gelöscht u tadaaa... � - ich habe KEINE Ahnung von html Codes... ��
Tina (Samstag, 23 März 2019 09:34)
Wow, vielen Dank für den Tip, es hat wunderbar funktioniert.
Kann man ev. denn Download irgendwie verhindern? Weiss das jemand ob man das Feld ausschalten kann?
Andreas (Samstag, 23 März 2019 06:23)
@Wolfgang: In der FreeVersion von Jimdo gibt es wohl Speichergrenzen. Vielleicht doch auf den Bezahltarif upgraden => probiere doch mal die 30 Tage-Testversion aus: https://www.paersch.com/jimdo/ => dann siehst Du, was da alles mehr möglich ist.
@Carmen: wie schön, dass Du dran geblieben bist und den Fehler gefunden hattest. [via Support hätte ich Dich auch unterstützt: https://www.paersch.com/kontakt/fernwartung/ - wäre dann aber kostenpflichtig]
@Claus E: die "Ecke" im Code meint, wenn da ein Mini-Fehler vorhanden ist, will der HTML-Code nicht richtig arbeiten. Das passiert - dann heißt es suchen suchen...
Carmen (Freitag, 22 März 2019 21:43)
YEAH - ich bin genial - keinen blassen Schimmer von Programmieren, aber ICH HABE DEN FEHLER GEFUNDEN!!!
Jetzt funzt es :-)
Schöne Grüße
Carmen
Wolfgang K. (Donnerstag, 21 März 2019 19:18)
Hatte mich schon so sehr gefreut, das Youtube layout durch deine Angaben zu verbannen. Möchte JimdoFree nutzen für eine gratis webseite.
Beim Dateiupload erscheint dann die Meldung (in rot ) 'die Datei ist zu groß! Erlaubte Maximalgröße: 10.0 MB'.
Wäre einfach toll gewesen. Danke trotzdem für deine Bemühungen, Andreas!
Andreas (Dienstag, 05 März 2019 10:45)
Hallo Claus E.,
doch doch - es klappt. Ich vermute, dass da eine kleine Ecke im HTML-Code nicht will. Das hatte ich kürzlich auch in einem Supportfall - so ein Mini-Fehler im Code kann zuweilen große Auswirkung haben.
Mein Vorschlag: ich setze im Support pcvisit zur Bildschirmteilung ein - da kann ich dann auf dem Computer des Kunden sehen. Mein Einsatz wird dann gegen Zeit abgerechnet. Wenn Dir dies helfen würde, melde Dich doch telefonisch oder via E-Mail
bei mir.
Claus E. (Montag, 04 März 2019 11:16)
Also ich hab es jetzt mehrfach versucht. Ich habe mich zu 100% an die angaben gehalten. Aber alles , was bei mir am Ende erscheint, ist ein kleiner, nicht funktionierender Videokasten.
Unsichtbare Unterseite -> check
Dort ein Video und ein Bild als Downlod -> reingepackt -> check
URLs ausgelesen -> check
Auf der eigentlichen Seite den HTML-Code von hier reinkopiert und die Video- bzw. BildURL eingefügt. -> check
Aber es funktioniert einfach nicht. Was mach ich falsch? Ich möchte einfach nicht dieses YouTube-Zeug da mit dabei haben.
Ernesto (Montag, 21 Januar 2019 18:21)
Vielleicht wäre es noch gut, wenn du in deinem Artikel erwähnen würdest, dass das Video nicht grösser als 100 MB sein darf, sonst funktioniert der Upload zur Jimdoseite nicht (JimdoPro Abo). Mein Video von 3:30 Minuten war schon zu gross. Ich weiss alle deine Tipps sehr zu schätzen und habe dank dir viel gelernt, herzlichen Dank!
Ursula Schmid (Sonntag, 06 Januar 2019 19:54)
Danke für den Tipp - danach habe ich schon länger gesucht!
Nadja Rothenbühler (Dienstag, 21 August 2018 15:51)
Sehr gerne, lieber Andreas Paersch. Super umgesetzt! Das wird ab sofort meine neue und viel übersichtlichere Vorlage.
Sonnige Grüsse Nadja
Silvia (Dienstag, 21 August 2018 14:47)
Ich hatte auch vergeblich nach einer Lösung gesucht. Danke für den genialen Tipp und die ausführliche Beschreibung dazu.
Sven-Olaf (Sonntag, 12 August 2018 21:43)
Danach hatte ich lange gesucht. Super Tipp, vielen Dank!
Dagmar (Sonntag, 12 August 2018 13:56)
Danke für den wertvollen Tipp.