Hallo zusammen, seit rund 2 Jahren verwende ich als Template den Testshop 3 mit Hintergrund-Video auf der Startseite: Lifeshop hier: www.kellermanngolf.com Auf den mobilen Geräten wird das Video nicht richtig dargestellt. Deshalb würde ich gern ein kleines und ein großes Video hinterlegen. Kann ich den Code "video controlls" in templates/Honeygrid/index-USERMOD.html so einfügen? if ""|detect_page == "Index"} <video autoplay loop id="bgvid"> <source src="images/content/index/KKGOLF1.mp4" type="video/mp4"> </video> <video controls> <source type="video/mp4" media="all and (min-width:680px)" src="video-large.mp4" > <source type="video/mp4" media="all and (min-width:320px)" src="video-small.mp4" > </video> {/if} Im Teshop sind die beiden Videos bereits hinterlegt, aber derzeit läuft nur das Hauptvideo KKGOLF1.mp3: http://test.cartbags.de Hat jemand vielleicht einen Tip für mich, um diesen Punkt zu optimieren? Im voraus vielen Dank. Gruß, Kerstin
Würde das so einbauen: {if ""|detect_page == "Index"} <div class="hidden-xs"> ...video groß... </div> <div class="visible-xs"> ...video klein... </div> {/if}
Hallo Gerd, vielen Dank für Deine schnelle Hifle. So habe ich das jetzt eingebaut: {if ""|detect_page == "Index"} <video autoplay loop id="bgvid"> </video> <div class="hidden-xs"> <source type="video/mp4" media="all and (min-width:680px)" src="video-large.mp4" > </div> <div class="visible-xs"> <source type="video/mp4" media="all and (min-width:320px)" src="video-small.mp4" > </div> {/if} Wahrscheinlich noch nicht korrekt, oder? Im Testshop wird immer noch das alte Universalvideo geladen. Es liegt noch auf dem Server. Wenn ich die Datei deaktiviere, wird gar kein Video geladen. Aber video-large.mp4 und video-small.mp4 erscheinen noch nicht. Wo liegt mein Fehler? Gruß, Kerstin
Das kann nicht gehen, da Du "Video" schließt, bevor Du die Videos lädst. Versuche es mal mit Code: {if ""|detect_page == "Index"} <video autoplay loop id="bgvid"> <div class="hidden-xs"> <source type="video/mp4" media="all and (min-width:680px)" src="video-large.mp4" > </div> <div class="visible-xs"> <source type="video/mp4" media="all and (min-width:320px)" src="video-small.mp4" > </div> </video> {/if}
Nein, was sollen die Angaben media="all and (min-width:680px)" ?, kenne ich bei <video> nicht. Die Anzeige wird doch mit : hidden-xs - sichtbar ab min 768px (also nicht sichtbar auf Handys etc.) visible-xs - sichtbar bis max 767px (also nicht sichtbar auf Tablet, Desktop etc.) ein/aus geschaltet. Richtig wäre: HTML: {if ""|detect_page == "Index"} <div class="hidden-xs"> <video autoplay loop id="bgvid"> <source type="video/mp4" src="video-large.mp4" /> </video> </div> <div class="visible-xs"> <video autoplay loop id="bgvid"> <source type="video/mp4" src="video-small.mp4" /> </video> </div> {/if} Wenn du ein video per html in der Größe einschränken willst, geht das so (Abhängig vom Film-Format) HTML: <video width="320" height="240" autoplay loop id="bgvid" /> Wobei ich das nicht empfehle, sondern vorher das Video mit einer Video-Bearbeitung auf die Größe schrumpfen. Denn Ziel ist ja Ladezeit einzusparen. Nachtrag Noch ein Tipp, schalte/bearbeite das Video auf stumm, die Musik ist furchtbar, vergrault die Kunden!
Hallo Barbara, hallo Gerd, vielen Dank für die Tips. Beide Version haben leider nicht funktioniert. Es wird weiterhin das alte Video geladen. video-large.mp4 und video-small.mp4 werden nicht abgespielt. Aktuell ist Gerds Version auf dem Server (http://test.cartbags.de). Könnte es sein, dass das Video noch in einer anderen übergeordneten Datei voreingestellt wird? Ich weiss schon, wie man die Dateigröße des Videos mit dem Programm Handbrake auf die optimale Größe bringt. Mein Problem ist, dass bei Android Tablets und Smartphones, das Video nur im Hochformat abgespielt wird. Das Video wird nicht auf die passende Größe skaliert. Bei Apple-Geräte ist ohnehin eine Abspielsperre voreingestellt, aber zumindest wird das erste Bild geladen und auf die richtige Größe skaliert. Querformat oder Hochformat ist hier kein Problem. Deshalb bin ich auf die Idee gekommen, das Video in zwei Größen anzubieten, damit Android-Geräte besser funktionieren. Was ratet Ihr mir? Grüße, Kerstin
Da liegt wahrscheinlich auch der Fehler: Die zuständige Datei wird nicht mit templates/Honeygrid/index-USERMOD.html überladen, vielleicht hast du das Demoshop3-Template komplett übernommen und angepasst, schau mal bei dir unter .../GXModules/Gambio/DemoshopTemplate/Shop/Templates/Honeygrid/index.html
Hallo Gerd, ja Cache geleert. Auch unter .../GXModules/Gambio/DemoshopTemplate/Shop/Templates/Honeygrid/index.html habe ich keinen Verweis auf das Video gefunden. Aber mir ist gestern ein Fehler passiert. {if ""|detect_page == "Index"} war doppelt drin. Das habe ich jetzt behoben. Das alte Video wird nicht mehr geladen. Jetzt wird gar kein Video mehr geladen. Ein Fortschritt. Als Anlage einmal die angepasste Datei. Vielleicht fällt Dir noch etwas auf, was ich anpassen könnte. Grüße, Kerstin
in deiner Datei stimmt der Pfad zum Video nicht! src="images/content/index/video-large.mp4" und src="images/content/index/video-small.mp4" war der richtige, soweit ich mich erinnern kann. Wieso arbeitest du noch mit USERMOD, welche Shopversion hast du ?
Da gehört der Video-Link eigentlich hin. Schicke mal die Datei ../GXModules/Gambio/DemoshopTemplate/Shop/Templates/Honeygrid/index.html hier als Anhang.
Hallo Gerd, Danke für die Fehlerkorrektur. Ich habe den Pfad angepasst. Und das Video wird geladen, aber es wird nicht abgespielt. Was kann ich hier noch tun? Ja, ich arbeite noch mit mit USERMOD. Das Template für den Testshop 3 stammt von 2017. Der Testhop hat die Version v3.14.1.0. Der Liveshop hat schon v3.15.2.1. Und Du meinst der Bildpfad muss in die ../GXModules/Gambio/DemoshopTemplate/Shop/Templates/Honeygrid/index.html? Wo ungefähr und in welche Zeile? Im Anhang ist die Datei. Vielen Dank für die umfangreiche Hilfe. Gruß, Kerstin
Hallo Kerstin, da sollte einiges überarbeitet werden. Seit Gambio 3.10.x.x wird mit Smarty-Block gearbeitet. - Lade dir mal den Gambio-Testshop-3 für Gambio 3.10 von (Link nur für registrierte Nutzer sichtbar.) herunter. - Schaue dir davon die index.html an und vergleiche diese mit deiner index-USERMOD.html . - bei jedem Shop-Update sollten die selbst angepassten Dateien mit den entsprechenden Neuen verglichen werden und überarbeitet werden. - Die originale index.html wird seit Gambio 3.10 eigentlich durch GXModules/...../index.html überladen. Bei dir wird das ausgehebelt durch deine index-USERMOD.html (diese hat noch Vorrang, Gambio wird demnächst aber keine USERMOD mehr zulassen). - Jetzt kommt ABER: wenn wir das Video in die richtige index.html einbauen, kann sein das einige Anpassungen von dir nicht mehr richtig funktionieren. Das kann man nur testen. Das liegt an den Browsern, dein Testshop hat kein SSL, da meckern diese. Im Firefox kann man einstellen ob Mediadaten abgespielt werden können und da funktionieren deine Videos. Nachtrag: Teste mal diese index.html. Sichere erst deine Dateien. Ersetze damit die ../GXModules/Gambio/DemoshopTemplate/Shop/Templates/Honeygrid/index.html und lösche deine index-USERMOD . Caches leeren und testen.
Hallo Gerd, da kommt Arbeit auf mich zu. Vielen Dank für die Tips. Bei jedem Master-Update habe ich immer wieder Probleme. Es ist eine gute Idee, das Template so auf neue Füße zu stellen. Testhop und Liveshop haben zu viele unterschiedliche Anpassungen. Ich werde einen neuen Teshop aufsetzen und Deine Vorgehensweise mit der index-USERMOD.html in Ruhe durchführen. Im Teshop wird das Video tatsächlich in Safari abgespielt. Die Musik wird scheinbar doppelt abgespielt. Ich weiss jetzt, was Du meinst, dass mein Sound die Kunden vergrault. Ich nehme als erstes Mal die Musik komplett raus - so lange ich dieses Überlagerungsproblem habe. Bevor ich aber an den Liveshop gehe, mache ich erst eine frische Shopkopie. Ich melde mich dann zurück. Vielen Dank für die Unterstützung. Gruß, Kerstin
Hallo Gerd, so, der neue Testshop ist startklar. Du hattest mich auf diesen Link verwiesen: https://www.gambio.de/forum/threads/neue-testshops-sind-online.25422/ Hier hatte ich auch 2017 die Dateien heruntergeladen. Soweit ich das Forum verfolgt habe, macht das Template bei neueren Gambio-Versionen Schwierigkeiten. Bei mir läuft aktuell alles. Aber das Usermod-System wird bald abgeschafft. Deshalb habe ich die beiden Dateien index.html und index-USERMOD.html aus dem Ordner Honeygrid verglichen. In meiner Usermod-Datei ist das Video eingebaut, aber ansonsten scheint die Datei wesentlich kürzer als die index.html. Ich habe Screenshots gemacht. Zuerst kommt die Usermod-Datei. Du meinst also, ich soll das Video hier herausnehmen und in der index.html einbauen? Welche Vorgehensweise schlägtst Du vor? Gruß, Kerstin
Hallo Kerstin, Bin heute erst durch Zufall auf deinen Beitrag gestoßen. Damit ich einen Hinweis bekomme, wenn du mir etwas schreibst, solltest du etwas aus meinem Beitrag markieren und zitieren wählen. Oder schreibe am Anfang @GerdP . Ja, du solltest die index-USERMOD.html löschen und das Video in die index.html einbauen. Du legst einen neuen Ordner unter GXModules an und schiebst die kleine index.html aus (Link nur für registrierte Nutzer sichtbar.) angepasst da hinein. So sollte der Pfad dann aussehen: GXModules/MeineAnpassungen/IndexVideo/Shop/Templates/Honeygrid/index.html Denn mit der neuen Version, die du jetzt hast, brauch nur der jeweilige Block überladen werden. Siehe: (Link nur für registrierte Nutzer sichtbar.)
Hallo Gerd, bin noch neu im Forum. Vielen Dank für den Tip mit dem Zitat. Ich habe jetzt das Video in die index.html aus dem Ordner Honeygrid eingebaut, die index-USERMOD.html gelöscht und die angepasste index.html in den Order GXModules/MeineAnpassungen/IndexVideo/Shop/Templates/Honeygrid/index.html verschoben. Im Testhop läuft das Video jetzt nicht mehr. http://test.cartbags.de Ich vermute, dass ich das Video an der falschen Stelle eingebaut habe. Hier ist die Datei. Wo liegt mein Fehler? Gruß, Kerstin
Hallo Kerstin, ja, falsch eingebaut. Die originale index.html aus Honeygrid bleibt wo diese ist und wird nicht geändert. Diese wird überladen durch GXModules/MeineAnpassungen/IndexVideo/Shop/Templates/Honeygrid/index.html mit folgenden Inhalt in der index.html: HTML: {block name="index_popup_notification" append} {if ""|detect_page == "Index"} <div class="hidden-xs"> <video autoplay loop id="bgvid"> <source type="video/mp4" src="images/content/index/video-large.mp4" > </video> </div> <div class="visible-xs"> <video autoplay="" loop="" id="bgvid" style="max-width: 100%;top: 280px;"> <source type="video/mp4" src="images/content/index/video-small.mp4" > </video> </div> {/if} {/block} mehr nicht. Zur Erklärung, {block name="index_popup_notification" append} bedeutet das an den originalen Block durch append etwas danach eingefügt wird, in deinen Fall das Video.