Bin inzwischen auch mit der Skalierung weitergekommen, habe es aber noch nicht dokumentiert.
weswegen ich jetzt schon schreibe:
wir sollten die "nicht permanent gültigen Links" nicht aus den Augen verlieren. Stichwort: Dauerhaft gültige Links für Dateianhänge weniger Sicherheit, schnellere Ladezeiten
kann ja immer mal vorkommen, dass man Deeplinks verhindern möchte ...
dann ist noch ein Forencode notwendig, der das kapselnde <div> erzeugt. Die Eingabe muss noch benutzerfreundlicher werden, aber wir experimentieren ja noch ...
[video=180px][[File:https://files.homepagemodules.de/b104774/f31t2057p7049n2_TezjEQgq.mp4|left|auto]] [b]links ausgerichtet 180px[/b] lorem ipsum ...[/video][clear]
[video=300px][[File:https://files.homepagemodules.de/b104774/f31t2057p7049n2_TezjEQgq.mp4|right|auto]] [b]rechts ausgerichtet 300px[/b] lorem ipsum ...[/video][clear]
links ausgerichtet 180px lorem ipsum . Sed ut perspiciatis, unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam eaque ipsa, quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt, explicabo. Nemo enim ipsam voluptatem, quia voluptas sit, aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos, qui ratione voluptatem sequi nesciunt, neque porro quisquam est, qui dolorem ipsum, quia dolor sit amet consectetur adipisci[ng] velit, sed quia non numquam [do] eius modi tempora inci[di]dunt, ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit, qui in ea voluptate velit esse, quam nihil molestiae consequatur, vel illum, qui dolorem eum fugiat, quo voluptas nulla pariatur?
..
rechts ausgerichtet 300px lorem ipsum Sed ut perspiciatis, unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam eaque ipsa, quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt, explicabo. Nemo enim ipsam voluptatem, quia voluptas sit, aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos, qui ratione voluptatem sequi nesciunt, neque porro quisquam est, qui dolorem ipsum, quia dolor sit amet consectetur adipisci[ng] velit, sed quia non numquam [do] eius modi tempora inci[di]dunt, ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit, qui in ea voluptate velit esse, quam nihil molestiae consequatur, vel illum, qui dolorem eum fugiat, quo voluptas nulla pariatur?
...
dank Wolfgangs Vorarbeit, funktioniert's jetzt schon 😊
Trotzdem bin ich gespannt, was der Support noch verbessert, warten wir's ab ...
Hatte auch schon eine Lösung parat, allerdings mit JavaScript im Foren-Code selbst und einen CSS-Eintrag der Mobil die Videos erst angezeigt hat! Ist mit Deinem "Super CSS-Code " nicht mehr notwendig!
Der SCSS-Eintrag für die mobile Anzeige
1 2 3 4
div.embed-responsive, div.embed-responsive video { position: relative !important; display: inline-flex; }
Durch das viele Testen ist mir aufgefallen, dass bei unformatiertem MP4-Code, wenn er somit allein dastand, mobil keine Videos angezeigt wurden. Ein Zusatz im SCSS-Code war notwendig! Der Textfluss rechts/links ist bei Upload- und Url-Dateien möglich, wollte durch die vielen Änderungen nicht so richtig funktionieren! Eine kleine Anpassung im Skript von "display: inline-block" auf "inline" behob den Fehler!
Neu! Mit einer kleinen Erweiterung können jetzt auch animierte GIF's skaliert werden! Wichtig! Animierte GIF's müssen mit "fullsize" eingetragen werden!
Es ist nicht immer eindeutig, wenn beim Einfügen des Foren-Codes geschweifte Klammer auftauchen. Der folgende Eintrag schafft Abhilfe. Hier fliest noch eine Idee von Bernd ein, die eine Abfrage der Breite und des Textflusses beinhaltet (+prompt und alert )
Abfrage der Videobreite ×
Abfrage der Videobreite
Kurzinfo zum Textfluss ×
Kurzinfo zum Textfluss
Installation für die Templates V4, V6 & Mobil
Neu! CSS-Eintrag fürs V4
Neu! SCSS-Eintrag fürs V6 & Mobil
Foren-Code erstellen
Neu! Einbau Iconbar mit Vorlage
Die CSS kann auch für das Template (v4) nach Eigener CSS Code kopiert werden, ohne "<style>" und "</style>"!
Zeile 4 ermöglich die Nebeneinanderdarstellung von kleineren Videos.
Zeile 8 verhindert einen Überlauf bei übergroße Videos.
Zeile 9 passt die Höhe der Videos an!
1 2 3 4 5 6 7 8 9 10 11
/* Video Mp4 */ div.vid_w { --vid_w: 320px; display: inline;
Wird der Foren-Code nicht umgesetzt, kann es an der Reihenfolge liegen!
Hier den Wert "0" wählen und ausprobieren!
Schließen
Hier der Eintrag für die Iconbar unter HTML mit Abfrage der Größe und Zusatzinfo zum Textfluss :
Iconbar unter "Admin > Layout >Iconbar" öffnen.
Reiter "HTML" aufrufen.
Namen vergeben, z.B.: Mp4- und GIF-Videos.
Folgenden Code eintragen und evtl. anpassen!
Erstellten HTML-Code in der Iconbar an die richtige Stelle schieben (Auslöse-Button ).
Für Mp4- und GIF-Dateien, für Upload- und Url-Dateien:
1 2 3 4
<div onclick="xob_insert('[video='+prompt('Wie breit soll das Video werden?','320px')+']', '[/video]'); alert(`Ein neuer Textfluss wird im Mp4-Code oder GIF-Code wie folgt nachgetragen! \n\nMöglich sind: |right oder |left\n\nz.B.: [[File:video.mp4|right|fullsize]] oder [[File:video.gif|right|fullsize]] \n\nMit Foren-Code [clear] kann der Textfluss beendet werden! \n`)" class="xob_icon_cont" id="icon_1110"> <img alt="Mp4+GIF" title="Mp4- oder GIF-Upload-Video einfügen" class="xob_icon" src="//img.homepagemodules.de/ds/static/gaia/movie.png"> </div>
Schließen
So sehen die Foren-Codes im Beitrag für Upload-Dateien ohne & mit Textfluss aus:
Wichtig! Animierte GIF's müssen mit "fullsize" eingetragen werden!
Moderations-Kommentar: Beitrag nochmals überarbeitet, neuen Foren-Code eingetragen Skalierung auch für animierten GIF's ohne zusätzliches JavaScript möglich!
Gif-Animationen werden durch ein Mouseover gestartet:
GIF-Animation - 210px ×
GIF-Animation - 210px
GIF-Animation - 180px ×
GIF-Animation - 180px
GIF-Animation - 100px ×
GIF-Animation - 100px
Habe durch das viele Testen in der Bildergalerie an die GIF's in den Beiträgen gedacht! Wie wir festgestellt haben, bleibt die Animation der GIF's nur erhalten, wenn keine Größeneinstellungen in der Bildadresse eingetragen werden, wie z.B. "resize/400x100". Mit einer kleinen Erweiterung in Deinem CSS-Code kann er auch für animierte GIF's eingesetzt werden! Habe auch im Hilfe-Text die GIF-Animationen mit untergebracht!
Wenn man die GIF-Animationen mit "fullsize" einträgt, kann man auf das JavaScript verzichten, dass "resize" aus der Bildadresse löscht!
Hab jetzt endlich ausprobiert, da es alles schon ausgereifter scheint und xobor die Idee wohl nicht übernimmt.
Aber bin noch unsicher was passieren soll und was tatsächlich passiert.
Auf Laptop hab ich glaub ich alles richtig eingetragen. Beim Auslösen hier entsteht aber nur video=320px ... / video Es kommt nicht wie ich dachte ein Auswählmenü left/right plus Größe, bevor ich durch Draufklicken den [[File...-Namen eintragen lasse. Edit: Reihenfolge auf 0 gestellt hat nix geändert.
In diesem Fall (und meist) ist es egal, ich will es eh fullsize haben, ohne Textfluss, deswegen hab ich 320px im Nachhinein durch fullsize ersetzt.
Aber woran liegts?
Mein anderes Problem zurzeit ist, dass ich es nicht schaffe xeno-canto-Audios einzubinden, wie auch hier (edit: im o.g. Beitrag) nicht s. was ich hier dazu schreibe, ist für euch glaub ich ne Kleinigkeit?
Fehlersuche: Kurze Videoclips als MP4 oder GIF einbinden!
So wie ich das sehe, hast Du es bereits hinbekommen..
Nach dem Update können auch GIF's abgespielt und skaliert werden! Bitte mit Beitrag #16 abgleichen, die CSS (v4) , SCSS (v6) und Eintrag Iconbar ändern!
Der Wert "320px" der mit in den Beitrag eingefügt wird, kann frei gewählt werden! Hier kann auch "1000px" oder auch "auto" für max. Größe gewählt werden!
Wichtig! Damit GIF-Animationen laufen, müssen sie im Vollbild mit "fullsize" eingetragen werden, der Wert "320px " kann frei gewählt werden und bestimmt dann die skalierte Größe!
Da der Textfluss kaum oder auch gar nicht genutzt wird, kann man ihn aus dem Menü streichen und bei Bedarf manuell nachtragen!
MP4-Videos werden nach dem Upload nicht gleich in der Vorschau angezeigt, der Beitrag muss erst gespeichert werden!
So sollte der Foren-Code bei Dir aussehen (hier auf 1000px geändert):
1 2 3 4 5 6 7 8
Upload-Dateien mit "File" (MP4 + GIF): [video=1000px][[File:Das Bierglas.mp4|fullsize]][/video] [video=1000px][[File:Das Bierglas.gif|fullsize]][/video]
GIF-Animation 200px, mit Mouseover-Start und Upload-Datei ×
GIF-Animation 200px, mit Mouseover-Start und Upload-Datei
GIF-Animation 200px, mit Mouseover-Start und URL-Adresse ×
GIF-Animation 200px, mit Mouseover-Start und URL-Adresse
Videoclips in Deinem DropDown-Menü:
Wenn Du die Videoclips in Dein Dropdown Menu-Menü einbauen möchtest, könnte die Zeile wie folgt aussehen! Zum Einbau in Dein spezielles Dropdown-Menü bitte @L2otbart fragen.
also die Skripte waren alle schon deine aktuellen, nur hab ich dann jetzt überall auf 1000px umgestellt.
Fehlen - hätt ich gedacht - tut aber nach wie vor eine automatische Eintragung von |left/right/none und von |fullsize. Beides müsste bei mir nach jetzigem Stand manuell nachgetragen werden, wenn sie nötig wären. So versteh ich jetzt den "alert(`Ein neuer Textfluss wird im Mp4-Code oder GIF-Code wie folgt nachgetragen!" Heißt also manuell vom User nachgetragen, richtig? So hab ich den Text dann abgeändert. Und fullsize scheint nur bei einem GIF nötig zu sein?