Hi,

da ich über den Mittag bereits das design und auch die Navigationsleiste der mobilen Seite fertiggestellt habe wäre es sehr mühevoll, wenn ich das nochmal machen müsste.

Aus diesem Grund habe ich den Scripttext aus dem HTML Head aus deiner Startseite übernommen und in meine eingefügt.

Das Video aus der Musikseite funktioniert zwar noch hörbar, allerdings sieht man kein Bild mehr.,

Leider hat das bloße Kopieren der Scriptcodes leider nicht funktioniert, das Ergebnis ist nach wie vor das Gleiche.😞

Was ich auch nicht verstehe ist der Link auf das Infopict?

Edit: Getestet habe ich es mit F5, Umschalt+F5 und dem doppelten Papier mit dem Auge in der Symbolleiste sowohl im Vorschaufenster als auch in Mozilla.

[...] da ich über den Mittag bereits das design und auch die Navigationsleiste der mobilen Seite fertiggestellt habe wäre es sehr mühevoll, wenn ich das nochmal machen müsste. [...]

Null Mühe wird es machen, wenn Du die funktionsfähigen Seiten aus der Demo Projektdatei übernimmst (klick) 🤓

[...] Das Video aus der Musikseite funktioniert zwar noch hörbar, allerdings sieht man kein Bild mehr. [...]

Das liegt, wie schon gesagt, an fehlenden IDs und falschen Indexwerten für die popup Ebenen.

[...] Leider hat das bloße Kopieren der Scriptcodes leider nicht funktioniert, [...]

Dann wird Dir beim Kopieren ein Fehler unterlaufen sein, denn in der online Demo funktioniert alles prächtig (klick) 😇

[...] Was ich auch nicht verstehe ist der Link auf das Infopict? [...]

Der Inhalt der Ebene "infopict" enthält ein Standbild, das die Slideshow überdeckt und 2 Rechtecke. Eins in der Hintergrundfarbe liegt ebenfalls über der Slideshow und eins liegt (transparent) über den Icons für Facebook und Instagram. Ein Klick auf einen der Buttons würde z. B. einen Kontakt zu Facebook herstellen, mit allen Folgen, die der DSGVO zuwider laufen. Der Button darf also erst geklickt werden, wenn die Cookie Info genehmigt wurde!

[...] Getestet habe ich es [...] sowohl im Vorschaufenster als auch in Mozilla. [...]

Ein aussagefähiger Test kann lokal nur dann korrekt ablaufen, wenn die Site exportiert wurde und eine der exportierten HTML Seiten in einem beliebigen Internet Browser geöffnet wird.
Die mit dem WD gelieferte Vorschau Funktion ist nur für einen überschlägigen Test brauchbar. Wenn Scriptlets in den Seiten werkeln, macht die Vorschau schon mal "schlapp" 😖

Dein foxyform Kontaktformular muss auch eine Sonderbehandlung bekommen, wenn es in allen Varianten (mobil/Desktop) funktionieren soll.
Weil das Formular mit einer eindeutigen ID im Code referenziert wird, funktioniert es nur dann in allen Varianten, wenn es in eine eigenständige HTML Datei ausgelagert wird und in den Varianten per Platzhalter + iframe eingebunden wird.
Die Projektdatei, die Du hier herunterladen kannst (klick), hat dazu ein Hilfsverzeichnis bekommen, in dem das Formular "foxyform.htm" enthalten ist. Bei einem Export/Upload des Projekts wird das Formular dann automatisch in das Verzeichnis "index_htm_files" übertragen.
In dem o. a. Hilfsverzeichnis sind auch die modifizierten CSS Dateien "xr_fonts.css" und "xr_fontsie.css" enthalten, die ohne Modifikation Google Fonts in Deine Site laden, die ggf. DSGVO Probleme machen können (s. Kommentar v. 16. 10.). Die "entschärften" CSS Dateien werden bei einem Export/Upload ebenfalls in das Verzeichnis "index_htm_files" übertragen und überschreiben da die problematischen Originaldateien. 🤓

Der Sonntag hat gerade erst angefangen, da bleibt Dir ja noch genug "Spielraum"... 😇

OK super, vielen Dank.

Ich muss noch ein paar Anpassungen machen wo ich jetzt wieder Fragen habe^^:

- Wie bekomme ich den Rahmen um die Cookieinfo weg?

- Ich möchte das das Hamburger Menü verwenden wie es marboe hier erklärt hat. Allerdings sobald ich das Menü aus meiner alten Datei herüber kopiere funktioniert die Cookieinfo nicht mehr ?!? Ich habe die dafür erstelle Ebene "menue" in der Hierarchie unter "infopict" eingeordnet. Theoretisch würde es mir auch reichen wenn das Wort Navigation durch die drei Striche ersetzt werden würde, aber die Möglichkeit habe ich noch nicht gesehen.

Ich habe mich heute Mittag dazu entschieden auf der mobilen Seite keine Slideshow laufen zu lassen, somit entfällt das Cover über die Slideshow. Hier wird zu Gunsten der mobilen Daten nur ein Bild angezeigt.

Ebenso finde ich es vom Handling her unpraktisch, das Kontaktformular in der mobilen Seite anzubieten, aus diesem Grund habe ich das Kontaktformular dort weg gelassen.

https://www.magix.info/de/tutorials/varianten-geteilter-text-mobile-navileisten--1231669/

Hier findest Du im letzten Teil eine Schnellanleitung für den Einbau des Hamburgermenüs (ohne die PopupEbenen) als normale Navi. Vielleicht reicht dir das ja.

Dann klappt es auch mit dem anderen Code 😉. VG marboe

[...] Wie bekomme ich den Rahmen um die Cookieinfo weg?[...]

Die Cookie Info (Text + Grafiken) wurde in einer Gruppe zusammengefasst. Um den Hintergrund (Rechteck mit Rahmen) bearbeiten zu können, muss die Gruppe also aufgelöst werden.

[...] Ich möchte das das Hamburger Menü verwenden wie es marboe hier erklärt hat [...]

@marboe hat Dir in ihrer Antwort ja schon eine Alternative vorgeschlagen. Noch viel einfacher geht es, wenn Du das Hamburger Menü aus einem der Templates per copy & paste übernimmst. Dann musst Du nur noch die Menüeinträge automatisch übernehmen lassen und die nicht gewünschten Einträge löschen. Fertig. 😉

[...] habe mich heute Mittag dazu entschieden auf der mobilen Seite keine Slideshow laufen zu lassen, [...]

Kein Problem, dann kannst Du in der Smartphone Variante das "Standbild" aus der infopict Ebene in die MouseOff Ebene verschieben und das große, abdeckende Rechteck aus der infopict Ebene entfernen.

[...] Ebenso finde ich es vom Handling her unpraktisch, das Kontaktformular in der mobilen Seite anzubieten, [...]

Das Löschen des Kontaktformulars aus der Smartphone Variante macht den Einbau des Kontaktformulars für die Desktop Variante einfacher. Da kann dann der Umweg über das separat angelegte Formular- und das Einbinden via Platzhalter und iframe entfallen.
Lösch' die im Hilfsverzeichnis angelegte Datei "foxyform.htm" und kopier' den Scriptcode für das Formular wieder in den HTML Body des Platzhalters für das Kontaktformular in der Desktop Variante.

Wenn Du alles richtig gemacht hast, kann das in der Smartphone Variante so aussehen

Schau's Dir nochmal online an (klick).

Die entsprechend geänderte Projektdatei kannst Du hier herunterladen (klick).

P.S.
Die modifizierten CSS Dateien müssen im Hilfsverzeichnis bleiben, damit der WD beim Upload des Projekts nicht wieder Google Fonts einbindet!

OK, ich glaube ich habe dann jetzt alles soweit fertig 🙂

Vielen Dank @marboe und @BeRo für die vielen Hilfestellungen 😘

Zwei Fragen habe ich jetzt noch: Wenn ich jetzt die Webseite neu exportiere, wie ist das dann mit den modifizierten CSS-Dateien? Bleiben die erhalten oder muss ich die neu ersetzen? Eigentlich wurde ja nur die Googelschriftart ausgesetzt, wie oben beschrieben?

Und: Jetzt habe ich endlich das finale Video, welches in den bisherigen Platzhalter eingesetzt werden soll. Allerdings sobald ich den Link ersetze funktioniert das Video nicht mehr.

Das sieht dann jetzt im HTML Head, wo der Scriptcode drin ist, so aus:

Youtube generiert ja einen iFrame-Code, aus welchem ich nur den Link entnehme:

<iframe width="560" height="315" src="https : //www.youtube-nocookie.com/embed/i8y9h7hY75A" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Somit ist für mich relevant:

https: // www.youtube-nocookie.com/embed/i8y9h7hY75A

Was ich dann an folgender Stelle einfüge:

https: // www.youtube-nocookie.com/embed/tV5h0l25dvs?  

Ich habe sowohl das fett gedruckte als auch den ganzen Code ersetzt, allerdings ohne Erfolg. Die Leerzeichen habe ich absichtlich gesetzt, sonst wird hier nicht der Code angezeigt.

Das Video lässt sich nicht mehr starten.

VG

Ich nutze nur noch den "embed"-Code für YouTube.

<iframe width="100%" height="100%" src="https:// www.youtube.com/embed/i8y9h7hY75A?rel=0"  frameborder="0" allowfullscreen></iframe>

Damit geht es auch so 😬.

Vorsicht: vor dem www ist ein Leerzeichen eingebaut. Das musst du wieder entfernen.
Wie sich das mit dem nocookie-Code verträgt, musst du noch selbst testen.
VG marboe