Beiträge von Clemens-XS

OK, vielen Dank für die Klärung!

Ich habe jetzt ziemlich experimentiert, um das Caching auch mit iCagenda hinzubekommen, auch wenn es in einen Artikel platziert wurde. Es funktioniert nicht mit Joomla, wohl aber mit JCH-optimize. Dabei darf man aber nur die die Cache-Stufe Average oder Intermediate nutzen. Noch mehr Zusammmenfassung / Caching und das Setzen der Scripte an das Ende der Seiten verträgt YooTheme Pagebuilder nicht. Da verschwand bei mir das Hamburger Menü-Icon jedes Mal, wenn man zu einer anderen Seite navigiert war. Lädt man diese Seite dann im Browser per refresh neu wird das Menü-Icon wieder angezeigt.

YooTheme rät dringend von Caching-Extensions ab. Ich habe aber gerade ausgetestet, dass ich ca. 30% an Ladetempo gewinne, wenn JCH-Optimize auf die o.g. Weise aktiviert wird. Bilder komprimiert YooTheme aber selbstständig in verschiedene Größen und packt sie als SourceSet zusammen. YooTheme cached selbst aber nix!

Wichtig ist aber, dass iCagenda nun auch mit aktiviertem Caching läuft und wir damit eine Lösung haben.

Doch im Modul gibt es fest vorgegeben die Einstellung, dass nicht gecached wird.

Ich habe soeben nochmals getestet und konnte nicht sehen, dass sich bei eingeschaltetem Joomla-Cache die Ladezeit der Site verringert. Die meisten Scripte und CSS aber vor allem alle Bilder (= SourceSet) werden bereits über YooTheme komprimiert und gecached, so hat es den Anschein.

Frage nochmals hier:

Worin besteht der Unterschied, wenn in Joomla in der Konfiguration das Caching aktiviert wird oder wenn statt dessen in der htaccess das Caching aktiviert wird?

Und: Wie ist eure Erfahrung betr. Joomla Caching: wird die Website mit aktivem Caching wirklich schneller geladen?

Es handelt sich eindeutig um den Joomla-Cache, der unter Konfiguration / System eingestellt wird. Setze ich den auf 1 Minute, kann nach Ablauf einer Minute einmal die Monats- oder Jahresnavigation benutzt werden. Nach einer weiteren Minute wieder. Schalte ich den Cache aus, funktioniert der Calendar einwandfrei.

Ich war inzwischen auf der Muster-Website der Französin. Sie hat in dem zweiten Beispiel, in dem es angeblich ebenfalls nicht funktioniert, den Calender in die Seitenspalte gelegt (.aside). Dann funktioniert der. Sie hat im anderen Beispiel den Kalender, so wie ich ich, in einen YooTheme-Container gelegt. Dann funzt es nicht, weil es im Joomla-Cache blockiert wird.

Der YooTheme-Support meinte ja auch, dass zwar mit dem Klick auf die Monats- / Jahresnavigation der Vorgang zwar angestoßen wird, aber dennoch der Inhalt des (gleich gebliebenen) Cache ausgeliefert wird und daher keine Änderung für den Besucher angezeigt wird.

Gerade habe ich auch Joomla "erweitertes Caching" ausprobiert. Das macht den gleichen Fehler. Dann habe ich das Caching ganz deaktiviert und die Netzwerkanalyse von Firefox bemüht: egal ob mit oder ohne Cache, die Laufzeit bis alles geladen ist, bleibt bei 1,28 Sekunden. Und natürlich hatte ich mit Cache-Cleaner AddOn in Firefox den Browsercache jedes Mal gelöscht.

Frage: Was ist eigentlich der Unterschied zwischen dem Joomla-internen Cache und dem Caching, das ich mittels htaccess aktivieren kann?

Sorry wegen meiner verzögerten Antwort:

Elwood Die neue Website hatte ich ja online entwickelt. Ich hatte der Klarheit halber nur darauf hinweisen wollen, dass ich sie in dem Verzeichnis auf dem Webserver belassen habe, in dem ich sie aufgebaut habe. Der zunächst beobachtete Fehler ist also nicht auf eine Änderung des Verzeichnisses zurück zu führen, in dem die Joomla-Installation liegt. Ich betreibe mehrere Websites auf dem Webspace und jede hat natürlich ein eigenes Verzeichnis.

eumel1602 Danke für deinen Hinweis! Ja die Schriftfarbe im Menü werde ich noch optimieren. Darf ja auch noch ein wenig größer werden.

Ja das mit den Großbuchstaben am Anfang in Menüs und Überschriften sehe ich anders.

Betr. Impressum im Hamburgermenü:

Ja, man könnte es so sehen, dass das rechtlich nicht einwandfrei ist. Ich glaube, da bist du sehr genau. Aber in dieser Hinsicht gibt es noch viel mehr Dinge, wo die Rechtslage unklar ist:

OSM-Karte Beispiel ist auch die Art, wie ich auf der Homepage die OSM-Karte eingebunden habe. Es gibt die Ansicht, dass eine Zweiklick-Lösung erforderlich sei, um die Karte angezeigt zu bekommen. Ich sehe es so, dass jeder externe Link auf der Website dann ja ebenfalls / analog dazu nur mit zwei Klicks erreichbar sein dürfte.

Und was ist mit der Matomo-Analyse?

Ich nutze die cookiefreie Einstellung von Matomo. Und da auch sonst keine Komponente Cookies setzt, muss ich dann dennoch ein Cookie-PoUp schalten?

Und nochmals Matomo: Ich anonymisiere alle erfassten Daten von Anfang an. Aber grundsätzlich erfasse ich schon die Daten, die ja dann nicht personenbezogen sind. Nicht personenbezogene Daten unterliegen aber eigentlich nicht der DSGVO. Ist es demnach dennoch erforderlich, ein OptIn / OptOut anzubieten? Wenn ja, dann müsste das aber ähnlich wie ein CookieBanner oder Cookie-PopUp direkt bei Beginn des Besuchs der Site gezeigt werden sodass der Besucher jeglicher Analyse (also auch nicht personenbezogener Daten) widersprechen kann.

Ich verwende iCagenda als Modul und platziere es mittels YooTheme Pagebuilder in einer Webseite. Leider funktioniert die Navigation zwischen den Monaten und den Jahren nicht. Nach etwas Recherche im Web fand ich heraus, dass eine Französin das gleiche Problem hat und es versucht hat, im Forum von YooTheme zu klären. Dort wurde es aber nicht geklärt. So weit, wie ich die dortige Erklärung (englisch) verstanden habe, werden alle Inhalte, die im Rahmen eines Artikels von Joomla ausgeliefert werden, gecached. Und weil das Icagenda-Modul im Artikel platziert ist, wird es genau so behandelt. Dann verhindert das Caching, dass sich Werte ändern z.B. durch die Navigation zwischen Monaten.

YooTheme Support empfahl nun, iCagenda außerhalb eines Artikels auf eine der üblichen Modul-Positionen zu setzen. Die Französin antwortete dann aber, dass es dann ebenfalls nicht funktionieren würde mit der Navigation.

Meine Frage nun in die Runde hier: Gibt es eine Möglichkeit, bestimmte Daten in einer Webseite (nämlich die von iCagenda stammen), vom Caching auszunehmen? Und wenn ja, wie macht man das?

Zitat

Was ich nicht verstehe: Warum hast du die Webseite denn unter PHP 7.4 entwickelt. Für Joomla 4 ist sollte man aktuell doch PHP 8.1 verwenden.

Auf meinem Webspace laufen noch zwei alte Joomla-3 Websites mit alten Templates, die nicht PHP-8.x kompatibel sind. Und mein Hoster (Webgo) lässt nicht zu, dass innerhalb eines Webspaces die eine Site mit PHP 7.x und die andere mit PHP-8.x läuft.

Ich arbeite in der nächsten Zeit daran, die beiden anderen Sites ebenfalls mittels YooThem Pagebuilder fertig zu stellen. Das dürfte jetzt viel schneller gehen, weil ich mir die Gestaltungselemente in der Bibliothek gespeichert und in die neuen Sites hochgeladen habe.

Während der Online-Entwicklung hatte ich natürlich noindex, nofollow gesetzt und zudem eine index.html im Rootverzeichnis, sodass jemand, der die URL ausprobiert hat, lediglich einen dummen Spruch vorgefunden hat.

Aber es ist sicher viel besser, den Zugang zur ganzen Site mittels htaccess Passwortschutz abzusichern.

astrid Herzlichen Dank für deine Antwort (und das, obwohl ich das Thema als gelöst markiert hatte).

Und ich danke dir für diesen Tipp.

Ach ja, warum auch nicht?

Hier zeige ich mal meine neue Website, die ich mit YooTheme Pagebuilder und UIkit zusammen gebaut habe. Nur wenige zusätzliche Extensions habe ich verwendet und alle Basis-Funktionen wirklich mit YooTheme und UIkit realisieren können. Nur iCagenda und eine (zurzeit nicht in der Site aktivierte) Extension "SimpleQuiz" sind drin.

Und wenn euch was einfällt, was ich optimieren könnte, lasst es mich bitte wissen - ggfs. per PN. Danke!

Habe gestern Nacht endlich meine neue Website fertig gestellt. Sie war während der Entwicklung über eine öffentliche URL zugänglich. Nun habe ich die Website auf die endgültige URL umgestellt. Das Installationsverzeichnis auf dem Server habe ich gleich gelassen.

Die Site läuft einwandfrei und ich kann mich auch im Backend einloggen und Änderungen vornehmen. Aber die automatische Überprüfung ob Joomla und die Extensions aktuell sind, funktioniert nicht mehr.

Ich habe die System-Einstellungen / Konfiguration untersucht, aber ich finde nirgends einen unstimmigen Punkt darin. Was muss ich wo ändern, damit die interne Überprüfung wieder funktioniert?

Uuups, Ich habs gefunden: In der configuration.php hatte ich vergessen, "live_site" auf die neue URL zu ändern. Alles OK jetzt!

Re:Later Da stimme ich dir zu und habe schon immer im laufenden Text einen Hinweis, dass ich nun zu einer externen Quelle verlinke. Mit dem CSS, das ich oben veröffentlichte, habe ich jetzt ein "Weltkugel-Icon" an jeden Link angefügt, der http oder https enthält.

Aktuell beschäftigt mich nur die technische Seite der DSGVO-korrekten Einbindung von OSM. Vermutlich komme ich nicht um die Verwendung des Leaflet-Scripts herum. Leider steht in der Dokumentation hier nur, wie man das Ganze per weiterem JS einbindet. Und von JS verstehe ich nun mal nix.

Ich fand jetzt noch diese Seite hier: https://switch2osm.org/using-t…ing-started-with-leaflet/

Dort findet sich ein Beispiel, wie OSM in eine Webseite integriert wird. Damit müsste ich damit eine HTML-Seite basteln, die dann über eine reguläre URL in den Iframe geladen wird. Genau das habe ich gerade ausprobiert. Die Seite wird prima angezeigt, wenn ich sie direkt lade. Wenn ich sie aber über mod_icctwoclick im Iframe darstellen will, wird sie nicht geladen.

Zitat

Ich fand jetzt noch diese Seite hier: https://switch2osm.org/using-t…ing-started-with-leaflet/

Dort findet sich ein Beispiel, wie OSM in eine Webseite integriert wird. Damit müsste ich damit eine HTML-Seite basteln, die dann über eine reguläre URL in den Iframe geladen wird. Genau das habe ich gerade ausprobiert. Die Seite wird prima angezeigt, wenn ich sie direkt lade. Wenn ich sie aber über mod_icctwoclick im Iframe darstellen will, wird sie nicht geladen.

Weiß auch nicht, aber jetzt funktioniert es endlich mit der separat angelegten Seite. Aber die Gestaltungsmöglichkeiten gefallen mir nicht: Schön ist, dass der Datenschutz-Text ausgeblendet wird, sobald man mit dem Button akzeptiert hat. Aber der Erklärungstext und die beiden Links (Datenschutzerklärung und Karte öffnen) laufen ineinander in einem <p>-Block. In der CSS finden sich vier Zeilen und ich sehe nicht, wo ich noch etwas beeinflussen kann. Das Vorschaubild zur Karte wird bei schmalerer Screenwidth in der Breite gestaucht, die Höhe bleibt gleich. Bei Mobilgeräten im Portraitmodus sieht das nicht so toll aus.

Nun habe ich das mod_qliframe auch noch installiert. Der Datenschutztext wird hier nicht ausgeblendet, nachdem man per Button zugestimmt hat. Optisch gut ist, dass nun zwei echte Buttons oben an der Karte dran hängen. Das Vorschaubild zur Karte wird hier gleichmäßig scaliert auf 100% width gehalten.

Nachdem also erstmal die Karte über eine separate HTML-Datei in den Iframe geladen werden kann, prüfe ich jetzt noch Lösungen, die ich in Verbindung mit YooTheme Pagebuilder und Lightbox / Modalbox selbst erstellen kann.

Ich komme also so oder so zu einer Lösung und ich danke für eure Unterstützung hier!

Ahhhh unter "Releases" ganz rechts war es zu finden. Herzlichen Dank dir!

So ich habs probiert und das Modul funktioniert als solches auch prima. Aber die Einbindung der interaktiven OSM-Karte gelingt mir noch nicht.

In YooTheme gibt es extra ein Element, bei dem ganz komfortabel OSM integriert wird und zahlreiche Gestaltungsoptionen möglich sind. Dazu wird ein Script von Leafletjs.com genutzt und OSM dahinein geladen. Da ich den zugehörigen Code, den YooTheme dazu in die Webseite schreibt, nicht extrahieren und irgendwo einfügen kann, habe ich einfach einen Joomla-Beitrag mit dem YooTheme-Element und der OSM-Karte als einzigen Inhalt angelegt und diesen Beitrag dann mit vollständiger URL in den iframe eingetragen.

Nun wird die Karte angezeigt, aber sie ist statisch, nicht interaktiv. Vermutlich lädt nun das Script von Leafletjs.com nicht mehr.

Ich fand auch zwei weitere Extensions, die ich aber vorerst mal nicht nutzen möchte, die ich hier aber für Interessenten nenne:

Bei Framotec gibt es eine Extension zur korrekten Einbindung von OSM, kostet aber 17,85 EUR je Jahr pro Website. Ist mir zuviel. und ich fand ein weiteres Github-Projekt, das ähnlich wie mod_ccctwoclick arbeitet. Es heißt mod_qliframe

Mein Ziel ist es nun, in dem URL-Feld für den Iframe, der von mod_ccctwoclick erzeugt wird, eine erweiterte URL einzugeben, mit der eine interaktive OSM-Karte mitsamt meinem Standort als Symbol dargestellt wird. (Besser zwei beschriftbare Symbole für Haus und für Parkplatz). Aber gemäß der Erläuterungen bei OSM hierist das ohne ein Script-Gedöne nicht möglich.

Gibt es doch noch einfachere Lösungen?

Stef Herzlichen Dank dir. Die von dir vorgeschlagene Lösung scheint genau das zu sein, was ich brauche.

Ich kenne mich mit Github nicht aus. Wie / wo kann ich dort dasa Modul herunter laden, sodass es in einer installierbaren Zip-Datei vorliegt? Das finde ich nicht.

Jetzt muss ich nur noch schauen, wie ich das mit meinem YooTheme Pagebuilder kombiniere. Dort werden Lightboxen entweder als Modal oder per Lightbox angezeigt und in der Lightbox der iframe geöffnet.

Das zugehörige CSS verwendet Uikit. Leider funktionieren die Light- / Modalboxen immer noch nicht wirklich so, wie in deren Dokumentation angegeben.

Meine neuen Websites stehen bald vor der Fertigstellung. In den diversen Beiträgen habe ich auch Links zu manchen anderen Websites angelegt. Klickt der Besucher darauf, so werden dann ja personenbezogene Daten an den Inhaber der externen Website übertragen wie z.B. IP-Adresse, Referrer, Browsertyp usw. usw.

Generell aber habe ich die Site incl. Matomo so gestaltet, dass kein Cookie-Consent erforderlich ist und somit das lästige „Weg-Klick-Banner” entfällt.

Wie sollte dann ein externer Link gestaltet sein, damit er der DSGVO genügt?

1. Ist dort ein Button erforderlich, der zunächst ein PopUp mit Hinweis zur Datenübertragung zeigt und von dem aus erst dann der Link genutzt werden kann? Und welche frei konfigurierbaren Lösungen als Joomla-Extensions sollte ich hierzu nutzen
2. Oder reicht es aus, den nach extern gehenden Link als solchen eindeutig zu kennzeichnen, z.B. durch ein Kästchen mit Pfeil nach rechts oben? Und wie würde im letztgenannten Fall der Besucher über die Bedeutung dieser Kennzeichnung informiert, sodass eine "informierte Einwilligung" gemäß DSGVO überhaupt möglich wird?

Der zweite Fall ist die Einbindung einer interaktiven OpenStreetMap-Karte. Hier bin ich mir sicher, dass die relativ aufwendige Lösung gemäß Frage 1 erforderlich ist, genau so als wenn ich YouTube- oder Vimeo-Videos einbinden würde.

Trotz sorgfältiger Suche bei extensions.joomla.com habe ich keine aussagekräftige Beschreibung bei den Extensions gefunden, aus der hervor geht, ob ich außer YouTube oder Vimeo-Links auch Links zu anderen Websites wie z.B. OpenStreetMap mit einem Vorschaltbutton versehen kann. (Der einzubindende Content der anderen Site würde vermutlich dann immer per Iframe geladen.)

Und zu Frage 2 fand ich folgende CSS-Lösung. (Könnte ja auch für andere hier hilfreich sein.):

Externe Links auf Webseiten: Was ist zu beachten?

Aus Datenschutzgründen sind Social Media Plugins wie die von Facebook oder Twitter hochkritisch. Wie sieht es mit einer einfachen Verlinkung auf Social Media…

dr-dsgvo.de

a[href^="http://"]:not([href*="dr-dsgvo.de"]):after,
a[href^="https://"]:not([href*="dr-dsgvo.de"]):after {
content: url('/fonts/external-link_sm2.png');  vertical-align:unset;  padding-left:4px;
}

Ob das funktioniert, hab ich noch nicht ausprobiert.

Weil die Installation "mit Bordmitteln" eine manuelle Installation wäre, die dann auch nicht über den Paketmanager aktuell gehalten würde.

XAMPP liegt im AUR Repo und wird aktiv gepflegt.

Für alle, die ebenfalls eine Lösung haben möchten:

XAMPP - ArchWiki

Allerdings habe ich auch da Schwierigkeiten. Von allen Anleitungen scheint mir die aber die aktuellste und zugleich stimmigste zu sein. z.B. wird dort keine Firewall aktiviert.

Inzwischen zeigt sich, dass es eher ein XAMPP-Linux-Problem ist und daher ist unklar, ob dieses Thema hier weiter diskutiert werden sollte. – Mein Vorschlag: Wenn ich eine Lösung gefunden habe, werde ich sie hier mitteilen.

Ich fand inzwischen die Info, dass ich die Linux-Firewll entsprechend konfigurieren muss:

sudo ufw enable 
Firewall is active and enabled on system startup

sudo ufw allow 80/tcp
Rule added
Rule added (v6)

sudo ufw deny 56/tcp
Rule added
Rule added (v6)

sudo ufw allow from 192.168.0.1
Rule added

sudo ufw allow http
Rule added
Rule added (v6)

Danach änderte sich leider immer noch nichts.

In einer weiteren Anleitung fand ich den Hinweis, dass ich bei XAMPP im Verzeichnis opt/lampp/etc/ die Datei httpd.conf hinsichtlich Benutzername und Gruppe ändern müsse auf meine Userdaten.

Nachdem ich das ausgeführt hatte, gelang erstmalig der Zugriff per Webbrowser auf die index.php, sofern ich diese mit der verlinkenden Datei verknüpft hatte. Aber die PHP-Datei wurde nicht ausgeführt, sondern deren Inhalt erschien im Browserfenster, ähnlich wie bei einem Text-Editor.

Verknüpfe ich die verlinkende Datei aber nur mit dem Vereichnis, in dem die entpackte Joomla-Installation liegt, so findet der Browser weder die index.php noch was anderes und die Meldung erscheint:

Objekt nicht gefunden!

Der angeforderte URL konnte auf dem Server nicht gefunden werden. Sofern Sie den URL manuell eingegeben haben, überprüfen Sie bitte die Schreibweise und versuchen Sie es erneut.

Sofern Sie dies für eine Fehlfunktion des Servers halten, informieren Sie bitte den Webmaster hierüber.
Error 404

Danke dir für den Link zu Ubuntuusers. Immerhin konnte ich mit deren Anleitung aus dem Verzeichnis /opt/lampp/htdocs heraus eine Verlinkung zur index.php in einem Ordner herstellen, der im Home-Verzeichnis liegt und somit meine normalen Userrechte hat.

Ich hätte nun erwartet, dass wenigstens die Joomla-Installationsroutine startet. Statt dessen erhalte ich die Meldung:

Zugriff verweigert!

Der Zugriff auf das angeforderte Objekt ist nicht möglich. Entweder kann es vom Server nicht gelesen werden oder es ist zugriffsgeschützt.

Sofern Sie dies für eine Fehlfunktion des Servers halten, informieren Sie bitte den Webmaster hierüber.
Error 403

localhost
Apache/2.4.56 (Unix) OpenSSL/1.1.1t PHP/8.2.4 mod_perl/2.0.12 Perl/v5.34.1 

Aufgrund dieser Fehlermeldung kam ich auf die Idee, dass ja im Browser zunächst die umleitende Datei aus dem htdocs-Ordner im Browser aufgerufen wird. Und die hatja noch root als User. Also habe ich den Besitzer dieser Datei auf mich als Besitzer geändert. Leider bleibt die Fehlermeldung gleich.

Konkret hatte ich für die Joomla-Website das Verzeichnis /home/clemens/WebDev/Joomla4a angelegt. Dann die Weiterleitung aus dem XAMPP-Verzeichnis heraus direkt auf die index.php gesetzt mit

sudo ln -s /home/clemens/WebDev/Joomla4a/index.php /opt/lampp/htdocs/Joomla4a

Und dann den User der weiter leitenden Datei geändert:

chown clemens Joomla4a

Der Nachteil bei den Ubuntu-Wikis ist, dass meist kein Aktualisierungsdatum angegeben ist und sich die Beschreibung oft auf alte Verhältnisse bezieht.

403 heißt doch, dass die Benutzer- / Zugriffsrechte fehlen.

Wenn ich die Datei, die den Link enthält, über lcalhost im Browser aufrufe, dann wird ja zunächst diese Datei angesprochen. Diese hat aber zunächst root als Besitzer. Deshalb diese Änderungen.

Ohh, ich meinte Joomla 4.3.0 Sorry!!!

Ich möchte Joomla auf meinem Manjaro-Linux Laptop lokal installieren und dazu XAMPP nutzen. Aus dem AUR-Paket ar XAMPP schnell installiert. Es liegt nun unter /opt/lampp/ und die Websites liegen dann unter /opt/lamp/htdocs/joomla

Dann habe ich über im Web verfügbare Informationen das Joomla-Paket dort entpackt und versucht, den Installationsvorgang von Joomla über localhost/joomla zu starten.

Ich erhielt die Fehlermeldung:

 Error
An error has occurred while processing your request.
0 Failed opening required '/opt/lampp/htdocs/Joomla4a/administrator/cache/autoload_psr4.php' (include_path='.:/opt/lampp/lib/php')

Ich kann mir das nur so erklären, dass hier ja Joomla in einem geschützten Ordner laufen soll mit dem Benutzer "root".

Wer hat Erfahrung mit der Installation von Joomla auf einem XAMPP, welches auf einem Linux-Rechner läuft und kann mir da weiter helfen?

Ich meinte Joomla 4.3.0

Die JCE-Mediabox kenne ich seit Langem und hatte sie auf all meinen Joomla-3 Sites verwendet. Im Laufe der Zeit hatte ich immer wieder Probleme damit – aber auch mit dem JCE-Editor. Beides verwende ich nun nicht mehr.

Im Januar gab es ein Update von YooTheme, nachdem jetzt die Probleme teilweise behoben sind. Ich nutze jetzt dort nur noch die LIghtbox für meine Zwecke und verzichte auf die von mir genannte Extension Mediabox-CK.

Wie verhält sich die Uikit-Lightbox jetzt?

Nach wie vor ignoriert sie die im Link mit gegebenen Parameter wie die dimensions oder den caption-text. Aber die Lightbox stellt nun Videos nie größer dar, als ihr Originalformat. Und wenn Screenwidth oder Screenheight kleiner als das Videoformat ist, wird unter Beibehaltung des aspect-ratio das Vido verkleinert bis es passt. Das führt automatisch z.B. auf TouchDevices dazu, dass das Video größtmöglich dargestellt wird. Prima so!

Benutzt man Iframes, um z.B. Joomla-Websites darzustellen, so wir automatisch die Iframe-Größe so gewählt, dass allseitig ein auch bei Touch-Geräten genügend großer Abstand zum Rand des Screens bleibt, um die Lightbox durch einen Touch in diese Region schließen zu können. Bei großen Screens wird das Iframe dann aber zu groß. Leider reagiert die Lightbox auch bei der Anzeige von Iframes nicht auf dimension-Angaben im Link. Man kann aber in der User.css einfügen:

.uk-lightbox iframe {max-width: 300px;}

und dann wird die Dimension (für alle Iframes) übernommen! Ist Screenwidth kleiner, greift wieder das beschriebene Auto-Margin.

Und für die von mir gewünschte Audio-Wiedergabe in einer Lightbox habe ich auch eine Lösung: In einem Video-Editor füge ich zur Mp3-Datei einfach ein Standbild hinzu und lasse das Ganze als Video rendern. Dann kann die Lightbox es laden, wohingegen ein Audio nicht geladen werden kann.

Mit der Uikit Modalbox kann ein Audio geladen werden. Startet es der Benutzer in der Modalbox und schließt die Box während des Abspielens, fehlt der Event-Handler, der das Audio stoppt, sodass der Benutzer mit Sicherheit verärgert wird!

Dass im Ui-Kit solche Fehler enthalten sind und zugleich die Dokumentation etwas anderes beschreibt, finde ich schon fatal! – Trotz allem komme ich nun aber mit dem Aufbau meiner Websites deutlich besser zu Recht, als ohne YooTheme. Und der entstehende Code ist sehr schlank und die Seiten laden sehr schnell, da automatisch alles komprimiert wird, auch Bilder incl. LazyLoading. Extensions wie JCH-Optimizer sollten nicht eingesetzt werden! Es wird sonst langsamer und evtl. auch instabil.

Trotz der hier beschriebenen Fehler kann ich YooTheme und das UiKit empfehlen!

So, jetzt habe ich eine Lösung gefunden. Da ich bei meinen Webrecherchen nix dazu gefunden habe, gehe ich mal davon aus, dass diese Lösung hier auf Interesse stoßen könnte.

Ich habe meine Lösung auf einem 2540 x 1440 und einem 1920 x 1080 Screen sowie auf meinem Android Galaxy S9+ getestet und sie funktionierte zuverlässig.

Zwei Dinge haben mir bei meinen vorigen Versuchen im Weg gestanden:

1.) Ich glaubte, ich sollte in einer Query mehrere Konditionen miteinander durch "and" verbinden. Das führte dazu, dass die ganze Query oftmals verworfen / nicht berücksichtigt wurde vom Browser. Kommas hinter den einzelnen Konditionen brachten den ersten Teil-Erfolg. – Komisch: Ich dachte, die Kommas stellen eine Oder-Funktion dar.

2.) Ich hatte zuerst die Query und danach die Klasse definiert mit ihren Eigenschaften. Nun habe ich es umgedreht und zunächst die Klasse benannt und die ihr zugewiesenen Eigenschaften von der Erfüllung der Query abhängig gemacht, die dann vor Beginn der Eigenschaften stehen muss.

Hier nun die drei Klassen mit ihren Queries:

/* Nur wenn Touchscreen und Portrait-Format (>4:3) vorliegt, wird für Landscape nicht angezeigt */
.touch-portr {
    @media screen and (pointer: fine), (orientation: landscape) {
        display: none;
    }
}
/* Nur wenn Touchscreen und Portrait-Format (>3:4) vorliegt, wird für Portrait nicht angezeigt */
.touch-landsc {
    @media screen and (pointer: fine), not (orientation: landscape) {
        display: none;
    }
}
/* Nur wenn Screen mit Maus- oder Stifteingabe vorliegt = Regel für Desktop */
.touch {
    @media screen and (pointer: coarse), not (pointer: fine) {
        display: none;
    }
}

Ich freue mich darüber, dass ich nun auch mal etwas zurück geben kann, nachdem mir hier im Forum schon so oft geholfen wurde!

Falls jemand eine Verbesserung zu meiner Lösung hat, bin ich sehr interessiert.

Nun habe ich auch alle möglichen Versuche mit aspect-ratio durch und NIX geht. Das sind meine jetzt letzten Versuche:

/* Nur wenn Touchscreen und Portrait-Format (>4:3) vorliegt, wird für Landscape nicht angezeigt */
@media screen and (pointer: coarse) and (min-aspect-ratio: 4/3) {
.touch-landsc {
display: none;
}
}
/* Nur wenn Touchscreen und Portrait-Format (>3:4) vorliegt, wird für Portrait nicht angezeigt */
@media screen and (pointer: coarse) and (min-aspect-ratio: 3/4) {
.touch-portr {
display: none;
}
}
/* Nur wenn Screen mit Maus- oder Stifteingabe vorliegt = Regel für Desktop */
@media screen and (pointer: coarse) {
.touch {
display: none;
}
}

Sinn der ganzen Queries ist es, nur eines von drei Elementen anzuzeigen, passen dazu, ob es sich um ein Mobilgerät im Quer- oder Hochformat handelt oder ob es sich um einen Desktop Screen handelt.

Nach all den Versuchen kann ich hier nur noch folgende Erkenntnisse mitteilen:

pointer: fine wird vom Desktop ausgewertet, sofern keine weitere Bedingung mit and verbunden wird.

pointer: fine wird nicht vom Android-Browser ausgewertet und die Query wird ungültig

hover: hover wird vom Desktop ausgewertet und lässt sich auch mit min-width und max-width kombinieren

hover: hover und hover: none wird nicht vom Android-Browser ausgewertet und die Query wird ungültig

Diese Ergebnisse widersprechen allem, was ich bnei Mozilla, bei w3school und vielen anderen im Web gefunden habe. Ich bin auch sicher, dass es in meiner Test-Website keinen Code gibt, der die o.g. Queries unwirksam machen könnte.

Was kann ich jetzt noch tun? Mit Javascript weiter machen? Da kenn ich mich nicht aus!