Beiträge von Clemens-XS

Da auch ich gerade ein Lightbox-Problem lösen möchte und ich hier noch keine Rückmeldung zu einer Lösung gelesen habe, möchte ich meinen Senf beitragen:

Die über das UI-Kit angebotene Lightbox lädt Videos, ohne dass die mit angegebenen Dimensionen berücksichtigt werden. Ein Video wird also immer auf 100% der eingestellten maximalen Seitenbreite gedehnt. Was bei Mobilgeräten wenig auffällt, führt auf dem Desktop zu eklig verwaschener Videodarbietung, wenn man z.B. nur 720p-Material hat.

Als Alternative biete sich die Modalbox aus dem UI-Kit an. Bei der werden die Dimensionsangaben berücksichtigt. Und wenn der Screen kleiner ist, skaliert es automatisch auf die maximal mögliche Breite. Allerdings hat es den Fehler, nicht auch die verfügbare Höhe bei der Anpassung zu berücksichtigen, sodass z.B. ein 720p-Video auf dem Smartphone im Portrait-Modus korrekt wieder gegeben wird, aber im Landscape-Modus so hoch ist, dass es nicht mehr fest stehenden gezeigt wird, sondern sich scrollend auf und ab bewegen lässt und zudem immer ein Teil des Videos von oben oder unten her abgeschnitten wird.

Das sind meiner bisherigen Erfahrung nach die üblichen Tücken bei Lightboxen!

Falls trunky noch keine Lösung gefunden hat:

Aktuell probiere ich, mit dem Tobii-Script weiter zu kommen. Es ist schön schlank, die CSS ist übersichtlich und mir wird kein neuer, heutzutage unnötiger Mediaplayer verkauft. Die Demoseite von Tobii https://www.cssscript.com/content-lightbox-tobii/ läuft auch auf Mobilgeräten so, wie ich das gerne hätte. An der Gestaltung der Lightbox selbst möchte ich aber noch Hand anlegen.

Tassos Arbeiten finde ich insgesamt prima. Aber die Funktionalität der Lightbox hat mich besonders betr. der Darstellung auf Mobilgeräten nicht überzeugt, so weit ich das über dessen Demo-Website sehen konnte.

Die Frage mit dem Script konnte ich inzwischen klären. Man muss es einfach nur in eine Datei packen als eigenes Script und dann in Joomla einbinden.

Betr. meiner Aussage zum Lightbox-Problem bei Yootheme möchte ich noch präzisieren: Die über das UI-Kit angebotene Lightbox lädt Videos, ohne dass die mit angegebenen Dimensionen berücksichtigt werden. Ein Video wird also immer auf 100% der eingestellten maximalen Seitenbreite gedehnt. Was bei Mobilgeräten wenig auffällt, führt auf dem Desktop zu eklig verwaschener Videodarbietung, wenn man z.B. nur 720p-Material hat.

Als Alternative biete sich die Modalbox aus dem UI-Kit an. Bei der werden die Diemnsionsangaben berücksichtigt. Und wenn der Screen kleiner ist, skaliert es automatisch auf die maximal mögliche Breite. Allerdings hat es den Fehler, nicht auch die verfügbare Höhe bei der Anpassung zu berücksichtigen, sodass z.B. ein 720p-Video auf dem Smartphone im Portrait-Modus korrekt wieder gegeben wird, aber im Landscape-Modus so hoch ist, dass es nicht mehr fest stehenden gezeigt wird, sondern sich scrollend auf und ab bewegen lässt und zudem immer ein Teil des Videos von oben oder unten her abgeschnitten wird.

Das sind die üblichen Tücken bei Lightboxen! Zum Beispiel hat Mediabox-CK erst auf mehrfache Nachfrage meinerseits den Fehler beseitigt, dass bei Mobildarstellung nicht nur die unter der Lightbox liegende Webseite sich auf und ab bewegen ließ, sondern auch die Lightbox zusätzlich. Dafür ist aber nun die Darstellung von Videos auf Mobilgeräten auch im Querformat schlechter geworden, da einfach die Berechnung des verfügbaren Platzes falsch läuft und zudem CSS-Anweisungen für den Mobilbetrieb anscheinend wirkungslos sind.

Aktuell probiere ich, mit dem Tobii-Script weiter zu kommen. Es ist schön schlank, die CSS ist übersichtlich und mir wird kein neuer, heutzutage unnötiger Mediaplayer verkauft. Die Demoseite von Tobii https://www.cssscript.com/content-lightbox-tobii/ läuft auch auf Mobilgeräten so, wie ich das gerne hätte. An der Gestaltung der Lightbox selbst möchte ich aber noch Hand anlegen.

Das Tobii-Script funktioniert bei mir noch nicht, weil es mir bisher noch nicht gelungen ist, die Initialisierung erst dann vorzunehmen, wenn das Hauptscript zuverlässig komplett geladen ist. Auf die Ladereihenfolge oder Verzögerungen habe ich aber bei Nutzung von YoothemePagebuilder wenig Einfluss. Vielleicht lässt sich im Initialisierungsscript eine Zeitschleife zur Verzögerung einbauen?

Seit über 3 Wochen versuche ich, Mediabox-CK so angepasst zu bekommen, dass sie auch auf Mobilgeräten sauber funktioniert. Nachdem ich aus Frankreich nichts mehr höre, hatte ich versucht, im CSS der Mediabox-CK zu modifizieren und stieß auf Unstimmigkeiten und große Unübersichtlichkeit.

Ich bin es satt, noch mehr Zeit dafür zu verlieren und bin neu auf der Suche, nach einer Lightbox. Einige kostenfreie Extensions habe ich bereits getestet, aber sie konnten mich nicht überzeugen. Andere käufliche fielen bei mir schon mit der Demo durch!

Auf einer Joomla-3 Website hatte ich mal eine Lightbox programmieren lassen, die all das konnte, was ich mir vorstelle. Sie beruhte auf Lightbox.js in Verbindung mit dem Plyr-Player. Ich bhabe versucht, sie in Joomla 4 einzusetzen und scheiterte damit. Schlechte Erfahrungen mit der JCE-Mediabox schon unter Joomla 3 möchte ich nicht wiederholen.

Mir ist z.B. wichtig, dass auf Mobilgeräten trotz kleinem Bildschirm immer in einem Teilbereich sichtbar ist, dass der Besucher die Lightbox als solche erkennt und sieht, dass er sie durch den Close-Button oder einen Klick in das graue Overlay schließen kann. Besonders bei der Darstellung von HTML (Joomla-Beiträgen) in Iframes ist das wichtig.

Ich habe auch die Diskussion hier "Lightbox" in J4? verfolgt. Da ging es aber nicht um Videos und Iframes / HTML.

Meine neuen Websites gestalte ich mit Yootheme. Leider wird dort keine brauchbare Lightbox / Modalbox angeboten, auch nicht über das UiKit!

Frage 1: Welche Lightbox ist für meine Aufgabe voraussichtlich empfehlenswert?

Frage 2: Ich habe diese Lightbox hier gefunden: https://www.cssscript.com/content-lightbox-tobii/

Der Vorabtest der Demo lief vielversprechend. Leider schreibt der Programmierer, dass man auf der jeweiligen Webseite sein Javascript initialisieren muss durch den Ausdruck:

const tobii = new Tobii()

Ich habe das so verstanden, dass ich in den Text einer Webseite also an irgend einer Stelle einfügen muss:

<script>const tobii = new Tobii()</script>

Aber damit hätte ich ja einen Inline-Script genutzt, der bei modernen Browsern aus Sicherheitsgründen nicht mehr funktioniert. Jedenfalls funktioniert Tobii-Lightbox so nicht bei mir. Wie müsste ich denn die Initialisierung korrekt vornehmen?

Auf den Vergleich bin ich ebenfalls reingefallen, als ich Webgo damals gewählt hatte. Das Preis-Leistungsverhältnis ist aber nach wie vor günstig.... zu Lasten solcher Ereignisse wie oben beschrieben und zu Lasten der Erreichbarkeit: Jeden Monat gibt es zwischen 20 und 60 Minuten Ausfallzeit!

Gescannt wird das von http://www.webhosterwissen.de, also dem Anbieter des dubiosen Hosting-Vergleichs. Folglich müsste er ja genau wissen, wie „gut” die von ihm getesteten Hoster wirklich sind und die Testergebnisse anpassen… –tut er aber nicht! Und das ist unseriös!

Eigentlich funktioniert meine htaccess bisher ganz gut – so glaubte ich jedenfalls. Zumindest macht sie bei den alten J3 Websites keine Probleme. Nun bin ich dabei, die beiden Produktivseiten auf J4 umzustellen und zugleich eine attraktivere Gestaltung zu verwirklichen. Dazu setze ich YOOtheme Pagebuilder ein und vermeide damit, dass ich mich in die neuesten CSS-Geheimnisse einarbeiten muss.

Im Frontend sieht die in Entwicklung befindliche Seite gut aus, trotz einiger Fehlermeldungen im Firefox Inspector. Alles funktioniert dennoch.

Im Backend ebenfalls, solange ich den Pagebuilder nicht benutze! Benutze ich ihn, so werden alle Gestaltungselemente ohne deren zugehörige Bedienungs-Icons angezeigt, sodass die Arbeit damit zumindest erheblich erschwert wird – besonders für mich als Einsteiger. Die Icons werden normaler Weise auf den Elementen sichtbar, sobald man mit der Maus drüber fährt.

Ursächlich ist nach meinen bisherigen Versuchen die Zeile mit der Content-Security-Policy, die ich in meiner htaccess habe:

Header set Content-Security-Policy: "default-src 'self' 'unsafe-inline' https://meine-website.org https://mein-matomo-andere-domain.de"

Setze ich nur:

Header set Content-Security-Policy: "default-src 'self' https://mein-matomo-andere-domain.de"

dann funktioniert der Pagebuilder. Evtl. ist 'unsafe-inline' die Ursache. Allerdings nutze ich durchaus auch Inline-code, auch in einer bezahlten Extension ist Inline-code enthalten.

Wenn ich den Pagebuilder nutze, während der Fehler auftritt, gibt es keine zusätzlichen Fehlermeldungen im Firefox-Inspector. Daher habe ich keinen Hinweis darauf, was falsch ist an meiner CSP-Regel. Auch die mir bekannten Online-Testwebsites, mit denen http-Header geprüft werden können, brachten mich nicht weiter und auch nicht der gute Beitrag von Astrid Günter.

Was soll mir die CSP-Regel bringen?

Es soll nur Content von meiner eigenen Domain geladen werden einschließlich Inline-Code und es soll zugelassen werden, dass Script und iFrame von der meiner Matomo-Domain geladen wird. Wenn ich in Beiträgen zu externen Quellen verlinke, dann sollen diese in einem neuen Browserfenster geöffnet werden.

Wie muss dann meine CSP-Regel formuliert werden?

Bin bei WebGo in Hamburg. Der Support ist bisher prima, kompetent und blitzschnell. Aber die Entscheidungen der Führung wirken zuweilen echt irre auf mich:

Zum vorigen Jahreswechsel haben sie alle Kunden damit verrückt gemacht, dass sie nur noch MySQL-Datenbanken akzeptieren. Wenn man auf MariaDB was laufen hatte, musste man auf die MySQL wechseln. MySQL sei technisch überlegen und besser gepflegt. Das habe ich bei zwei Domains dann zähneknirschend getan.

Vor einem Monat dann eine Mail: Sie würden ab sofort nur noch MariaDB nutzen wollen. Bis auf weiteres könnte man auch noch MySQL nutzen, aber das würde enden! MariaDB sei technisch überlegen und besser gepflegt.

Zugleich mit der o.g. Mail wurde der Wechsel auf PHP8 in einer Formulierung mitgeteilt, als ob man bis Anfang November alles umgestellt haben müsste. Auf eine Rückfrage dazu wurde erst mit knapp einer Woche Frist geantwortet. In der Antwort wurde dann klar gestellt, dass man auch weiterhin noch PHP7.x nutzen könne und nichts "zwangsweise" umgestellt werden würde.

Diese Art der Kommunikation geht echt an die Nerven. Zudem habe ich wirklich was anderes zu tun in meinem Hauptberuf!

Habe gerade vom YOOtheme-Support die Antwort erhalten. Wenn man YOOtheme PageBuilder nutzt, muss die gewünschte Erweiterung der URL heißen

?tmpl=template

Im Template-Verzeichnis gibt es durchaus eine component.php. Diese gibt aber wohl die von mir gewünschte Funktion nicht her.

In Joomla 3.x gab es den Trick, einen Artikel in einer Lightbox zu öffnen ohne den Rest der Webseite, indem man an die URL dranhängte:

?tmpl=component

Nun funktioniert das in J4 anscheinend jetzt nicht mehr, oder? – Es kann aber auch sein, dass auf meiner J4 Versuchs-Website, die ich gerade mittels YOOtheme aufbauen möchte, dieser Trick in der in YOOtheme integrierten Lightbox-Funktion aus irgend welchen Gründen nicht funktioniert. Jedenfalls lädt es mir immer die komplette Webseite, statt nur den Artikel.

Zitat von Stef

Trotzdem ist es wichtig das man sich schon die Gestaltung vorher überlegt und plant bevor man beginnt.

Tja, es hat was gedauert bis ich begriffen habe, dass das damalige Hintergrundbild nicht nur die Gestaltungsmöglichkeiten arg einschränkt, sondern auch ein zeitgemäßes Layout nicht mehr zulässt. ....Erkenntnisprozesse eben

Joes Liste ist mir bekannt. Meine Frage zielte darauf ab, ein möglichst wenig aufwendiges Template zu finden, das mir aber eine Gestaltung gestattet, wie ich verlinkt hatte.

Noch wichtiger ist mi aber die Frage, ob diese Gestaltung nicht bereits mit dem Cassiopeia-Template realisierbar ist.

Ich habe dazu gerade einen Artikel mit folgendem Code verändert:

<div style="background: transparent url('/images/headers/Arek-Socha_free_hd-wallpaper-3698073.jpg') repeat scroll 0% 0% / 100% 300px; text-shadow: black 0px 4px 4px; border: 2px solid black;">
<div class="display-6" style="height: 250px; text-align: center; vertical-align: middle; color: #ffff99;">
<p>templates control the look and feel of your website.</p>
<p>This blog is installed with the Cassiopeia template.</p>
<p>You can edit the options by selecting the "Pümpel" on Your Site,</p>
</div>
</div>

Auf meiner Entwicklungssite findet sich das Ergebnis, wenn man die Homepage etwas herunter scrollt, der erste Artikel unterhalb von "Home".

Einziger Schönheitsfehler jetzt: Der Button "Weiterlesen" steht außerhalb bzw. unterhalb des Hintergrund-Bilds. Ersatzweise füge ich im Textbereich einen Extra-Link zur Artikel-URL ein, mit dem Nachteil, dass andere Artikel einen Button haben.

OK, auch das ist geschafft:

<p><a href="index.php?option=com_content&amp;view=article&amp;id=6:your-template&amp;catid=8:blog&amp;Itemid=102" title="Alles über T2LT-Antennen" target="_self"><span style="color: #ffff99;"><strong>Erfahren Sie mehr dazu…</strong></span></a></p>
</div>
<div style="display: none;"><hr id="system-readmore" /></div>
<h2>L2TL-Antennen</h2>
<p>Eine extrem kostengünstige.....

So geht es im Code weiter nach dem </div> aus Zeile 7 im vorigen Beitrag. Das Readmore behält seine trennende Funktion, wird aber nicht mehr als Button dargestellt.

Stef Ich mache ja schon, was mir mit meinen begrenzten Fähigkeiten möglich ist. Und wenn ich eine Lösung finde, wie jetzt gerade, teile ich sie ja hier auch gerne mit. Könnte ja sein, dass es gebraucht wird.

Nach Beratung mit einer Designerin habe ich mich dazu entschlossen, den Hintergrund sowie den Frostglas-Effekt wieder raus zu nehmen. Viel wichtiger ist mir, dass in der Blog-Übersicht, in der z.B. 5 oder 10 Blog-Artikel mit Bild und Einleitungstext gezeigt werden, mehr Variation möglich ist, so wie z.B. auf der Website meiner Kollegin Dami Charf: https://traumaheilung.de/

Mir gefällt, dass zu jeder Artikelvorschau abwechselnd links oder rechts Bilder und daneben in relativ großem Weißraum etwas Text steht. Aber wenn man weiter scrollt, so sind dort auch Abschnitte zu sehen, die ich mit einer Artikelvorschau in Joomla nicht hinbekomme, wie z.B. ein über die ganze Breite laufendes Hintergrundbild, über dem dann etwas Text liegt, ähnlich wie bei dem Banner in Cassiopeia. Zwischendrin in der Artikelvorschau gibt es wieder bis zu drei Spalten mit Artikeln oder eben Angeboten.

Wie kann ich so etwas mit Cassiopeia verwirklichen? Und wenn das nicht möglich wäre, welches Template würdet Ihr mir dazu empfehlen? Oder ist sogar ein Pagebuilder erforderlich (bloß um dieses Detail verwirklichen zu können)?

Hamburger Position und Größe hab ich jetzt anpassen können, sodass beides von Screenwidth abhängig ist.

Es fängt an mir zu gefallen.

Herzlichen Dank für die Tipps!

Das hat mich stark weiter gebracht, liebe Christine. Herzlichen Dank!

Ich musste den Frostglas-Effekt noch zusätzlich definieren für die Klassen:

.no-card .newsflash-horiz li
.com-content-article
.container-banner

...wobei in "Banner" meine Breadcrumbs liegen.

Kann sein, dass ich noch weitere Klassen mit dem Frostglas-Effekt hinzu fügen muss.

Nun muss ich noch die Artikel-Layout-Anpassung vornehmen.

Naja, ich habe halt den Frostglas-Effekt einfach mal ausprobieren wollen. So habe ich den Effekt einfach mal auf die Klasse .site-grid angewendet. Daher ist der Effekt zurzeit kaum sichtbar, weil er sich über die gesamte Fläche erstreckt statt nur auf den Darstellungsbereich eines Artikels.

Und ja, es ist sehr viel unstimmig im aktuellen Zustand der Webseite. Erst gestern Abend bemerkte ich, dass das Hintergrundbild auf Mobilgeräten nicht angezeigt wird. Und schon zuvor bemerkte ich, dass die Artikel in dieser Ansicht nicht vom Hintergrundbild unterlegt sind – im Gegensatz zur Homepage.

Ich möchte bei größerer screenwidth meine Artikel in der Übersicht des Blogstils so darstellen, dass abwechselnd mal links, mal rechts ein Bild steht und im Raum neben dem Bild der Einleitungstext zentriert angezeigt wird, umgeben von einem großzügigen Weißraum.

Bei schmalerer Screenwidth sollen die Artikel alle untereinander gereiht sein, wobei die Bilder natürlich am Kopf des Artikels stehen und der Einleitungstext darunter (wie beim Standard-Layout von Cassiopeia).

Wenn man den Weiterlesen-Button klickt, soll der Artikel in voller Breite der Screenwidth erscheinen und der Text soll abhängig von der jeweiligen Screenwidth auf gut lesbare Spaltenbreite aufgeteilt werden, wobei die Spaltenanzahl sich ebenfalls anpasst.

Für den Spaltensatz hatte ich bereits eine CSS-Lösung entdeckt, die aber natürlich nicht alles abdeckt, was ich mir hier wünsche: https://www.mediaevent.de/css/text-columns.html

Generell sollen alle auf dem feststehenden Hintergrundbild erscheinenden Artikel, Module usw. – nicht aber das Signet, der Hamburger-Button – einen "Frostglas-Effekt" mit leichtem Schattenwurf als Hintergrund bekommen. Die CSS-Lösung für den Effekt habe ich, aber ich habe noch nicht entdeckt, wie ich dafür sorgen kann, dass er einzeln auf jeden Artikel und jedes platzierte Modul angewendet wird.

CSS für den Blur-Frostglas-Effekt:

    -webkit-backdrop-filter: blur(5px);  /* Safari 9+ */
    backdrop-filter: blur(5px); /* Chrome and Opera */
    box-shadow: 0px 10px 15px 10px rgb(0 0 0 / 15%);
    background-color: rgb(228 228 228 / 15%); 

Meine bisherigen Versuche, mit Hilfe des Firefox Inspektors die nötigen Klassen zu finden und dann entsprechende Einträge in der user.css vorzunehmen, brachten nicht die gewünschten Ergebnisse.

Komme jetzt erst wieder dazu....

Das Einfügen in die user.css von

.navbar-toggler {
  width: 65px;
  height: 45px;
  background-color: #b94800;
}

hat keine Wirkung. Durch Ausprobieren fand ich, dass die Klassen-Verknüpfung hier einen Streich spielt und es heißen muss:

.container-header .navbar-toggler {
  width: 65px;
  height: 45px;
  background-color: #b94800; 
}

So finde ich den Button jetzt OK bei größerer Screenwidth. Ab ca. 600px screenwidth beginnt der Hamburger das Signet zu überlappen und er wirkt dann auch übermächtig, sodass ich nun zusätzlich mindestens eine media-condition einfügen werde.

Herzlichen Dank für die guten Tipps hier!

Habs versucht, leider keine Wirkung. Habs auch versucht, auf .navbar zu begrenzen:

.navbar img, svg {
height: 35;
width: 30;
}

geht auch nicht.

Aber danke für den Tipp und dein Engagement.

Übrigens werde ich jetzt die bisher nebeneinander angeordneten NewsFlash-Artikel untereinander anordnen, jeweils Bild / Text im Wechsel links rechts, wenn die Screenwidth kleiner und die Spalten zu lang werden.

Für den Text in gleich langen Spalten und sogar mit Silbentrennung fand ich hier eine Lösung:

CSS columns: Spaltensatz

CSS columns – Spaltensatz mit CSS – lässt Text automatisch von einer Spalte in die nächste laufen und gleicht die Höhe der Spalten aneinander an.

www.mediaevent.de

Das muss ich aber noch in Ruhe ausprobieren.

Abgesehen davon hat die jetzige Site zu viel maximale Breite. 1200px müsste auch noch heutzutage ausreichen. Muss mal schauen, wo ich das begrenzen kann. Habe statisches Layout gewählt.

Herzlichen Dank! Wieder ein Stückchen weiter bin ich nun gekommen.

Aber schon geht es weiter mit den nächsten Schwierigkeiten. Und ich kann ja wohl schlecht erwarten, dass ich mir hier durch das freundliche Engagement der Forenteilnehmer letztlich meine Website kostenlos gestalten lasse. Da hab ich kein gutes Gefühl mit!

Beispiele für aktuelle Unklarheiten und auch konzeptionelle Fragen:

• Der Hamburger-Button ist innen schwarz. Er sollte auch etwas größer.
• Die Artikel in Newsflash-Darstellung werden zu schmal bei schmalem Screen und die Intro-Texte dort zu lang. Mit extrem kurzem Text kann ich aber nicht das nötige Interesse wecken, den Artikel zu lesen.
  Immerhin: Für große Screens ist das Layout ja OK.
• Bei 4 Artikeln kommt es zu einer großen Lücke, wenn bei entsprechender Screenbreite in der oberen Reihe drei und darunter nur ein Artikel gezeigt werden.
• Öffne ich einen Artikel (weiterlesen), so hat der bei großem Screen extreme Text-Zeilenlängen. Hier brauche ich mehrere Textspalten, wie bei einer Zeitung, damit es noch lesefreundlich bleibt. Und der Text müsste sich automatisch auf halbwegs gleich lange Spalten verteilen und die Anzahl der Textspalten müsste abhängig von der Screenwidth sein.
• Ich möchte den Frostglas-Effekt auf die einzelnen Artikel begrenzen, sodass alle Artikel voneinander durch "ungefrostete" Abstände voneinander getrennt sind.

Für solche Dinge würde ich gerne jemanden beauftragen, den Rest der Site aber selbst machen, damit es finanziell passt. Für solche Teilaufgaben findet sich aber bisher niemand. Erstaunlich viele Webprogrammierer lehnen auch Joomla ab und wollen nur WordPress anfassen und auch das nur als Komplett-Aufrag für alles.

Liebe firstlady – Abgesehen von meinem Spleen betr. des MobileMenü gehe ich ja schon in die Richtung, den Rest des Templates nur hinsichtlich Fonts und Farben anzupassen. Leider gelingt mir nicht mal dies, obwohl ich die zahlreichen sehr guten Anregungen von Astrid Günther versuche zu befolgen.

Wenn ich Änderungen gemäß Astrid vornehme wie z.B. das Hintergrundbild mit

.body.site {
    background: transparent;
    background-image: url(../../../../../images/bg/bg-pastell-kachel.jpg)
    background-repeat: repeat; 
    background-attachment:fixed;
}

dann ändert sich schlichtweg nix. Dann suchte ich in der template.css nach diesen Klassen und finde sie nicht. Also ist die Empfehlung von Astrid hier möglicher Weise nicht zutreffend.

Ich möchte Fonts definieren, finde aber keine passenden Klassen. In der template.css werden die Fonts durch Ausdrücke wie

var(--cassiopeia-font-weight-normal, 400);

definiert und nicht, wie ich es bisher kenne. Und mit den Farben ist es ähnlich. Deshalb funktioniert das Überschreiben mit user.css wohl nur zufällig.

Auch Firefox mit seinem Inspektor ist bei diesen Verhältnissen nur eine beschränkte Hilfe für mich.

Für meine Verhältnisse ist es ja schon ein kleines Wunder, wenn ich das mit dem Menü wenigstens so weit hinbekommen habe, wie es jetzt ist (HamburgerButton rechts mit Abstand vom rechten Rand in Abhängigkeit von Screenwidth und einem FlyOut-Menü, das von rechts nach links öffnet und das nur so breit ist, wie für den Text der Menüpunkte benötigt wird und zudem einen neutralgrauen teiltransparenten Hintergrund hat. Das allein hat mich ca. 2 Tage gekostet.

Ich schaff es wohl doch nicht alleine. Ich habe mehrere Monate Entwicklung in ein Joomla 3.x gesteckt, das zu einem nach meinem Empfinden relativ guten Ergebnis geführt hatte: https://idcreativ.de/index.php

Diese Arbeit beruhte auf dem mittlerweile steinalten JYAML-Template und als Menü habe ich "TheGrueMenu" verwendet, welches aber noch angepasst wurde, speziell was die Positionierung des Sandwich-Buttons betrifft.

Im Herbst 2020 war die Arbeit beendet, aber ich hatte dann nicht mehr die Zeit, die Inhalte und Videos dafür zu erstellen. Und dann kam Corona, ich verliebte mich und zog um. Inzwischen ist Joomla 4,x so erwachsen, dass es Verschwendung wäre, in die alte Site noch Arbeit zu investieren.

Ich habe sie halt noch behalten, um mit wenig Aufwand beschreiben zu können, wie ich mir die neue Joomla-4 Site vorstelle.

Inzwischen hat sich in der Weiterentwicklung von CSS so viel getan, dass ich den Anschluss verloren habe. Und ich habe wieder nicht die Zeit, mich dort einzuarbeiten, denn mein eigentlicher Beruf ist ja ein völlig anderer!

Und nach den Umsatzeinbrüchen und den Umzugkosten ist kaum Budget vorhanden, das Ganze komplett in Auftrag zu geben.

Ich hatte schon im Frühjahr versucht, die nur wichtigsten Dinge, die mir hier jetzt Probleme machen, in Auftrag zu geben. Aber solch einen Auftrag nimmt anscheinend niemand an.

Was tun?