Protostar: ab 800px Viewport Wechsel von 1-spaltig auf 2/3 zu 1/3 zweispaltig - wie geht das?

Meine neue Website mit Joomla 3 soll auf Protostar aufbauen, weil ich davon ausgehe, dass ein derartig weit verbreitetes und viel genutztes Standard-Template auch in Joomla 4 funktionieren wird – ggfs. in aktualisierter Form. – oder irre ich mit dieser Annahme???

Die Website soll max. 1.200px breit werden (minimal 280px). Bei Viewportbreiten bis 800px sollen alle Beiträge einspaltig dargestellt werden, darüber soll die Hauptspalte 66% und die Nebenspalte rechts 33% breit sein.

Wie ich das meine, sieht man hier auf einer Demo-Site unter

https://www.w3schools.com/w3css/tryw3css_templates_blog.htm

In der Hauptspalte werden entweder Einzelbeiträge oder Beiträge im Blog-Layout gezeigt. In der Nebenspalte sollten eigentlich auch im Blog-Layout Beiträge angezeigt werden. Nur falls dies aber technisch schwierig wäre, wäre ich auch damit zufrieden, dort Module einzubauen.

Fragen:

Bietet Protostar von Hause aus bereits die unkomplizierte Möglichkeit, den Wechsel von ein- auf unsymmetrisch-zweispaltig abhängig von der Viewportbreite zu realisieren?

Wenn ja, wie gehe ich da vor?

Ist es möglich, sowohl in der Hauptspalte, als auch in der Nebenspalte im Blog-Layout die Beiträge aus zwei verschiedenen Kategorien darzustellen?

Wenn nein, wie könnte ich dann manuell ausgewählte Beiträge in der Nebenspalte im Blog-Layout anzeigen lassen (ähnlich wie es durch die Markierung "Hauptbeiträge" für die Homepage möglich ist)?

Falls alles NEIN, lässt sich die gewünschte Funktionalität mit einem anderen, einfach gehaltenen, möglichst kostenfreien Template verwirklichen? Vielleicht mit ProtostarPlus-Eighteen?

OK, vor wenigen Wochen hatte ich das Thema, welches Template ich aktuell unter Joopmla 3 wählen sollte, um es möglichst auch unter Joomla 4 verwenden zu können, hier diskutiert. Auch da erhielt ich die Empfehlung, Cassiopeia zu nehmen.

Allerdings läuft Cassiopeia nicht auf Joomla 3 und ich müsste daher die bald anlaufende Entwicklung meines Joomla bei einem Joomla-Dienstleister ändern auf Joomla 4. Joomla 4 ist aber immer noch nicht im "produktiv-stable-Zustand" verfügbar, sodass die Entwicklung auf Grundlage eines nicht ausgereiften Systems erfolgen müsste.

Das finde ich ebenfalls keine gute Idee. – Was tun????

chr-hl Betr. deiner Rückfrage: Ich hatte schon vor einem Jahr vorgehabt, eine neue Website auf Basis von Joomla 4 erstellen zu lassen, statt es selbst zu machen. Aber Joomla war da bei weitem noch nicht so weit. Jetzt bin ich in der Situation, möglichst bis Ende August eine neue Site zu haben, um angesichts von Corona besondere Werbemaßnahmen zu publizieren. Und wieder ist Joomla 4 noch nicht so weit. Deshalb bin ich kurz davor, einem Joomla-Dienstleister den Auftrag für die Teil-Erstellung einer Joomla-3 Site für mich zu erledigen.

Ich benutze so wenig zusätzliche Extensions, wie möglich und diejenigen, die ich nutze, llaufen auch unter Joomla 4.

Der Knackpunkt scheint ja jetzt doch wieder das Template zu sein! Ich kenne mich bei solchen Entscheidungen nicht aus, ob jetzt Bootstrap 2 oder meinethalben 5 oder ein 12-spaltiges CSS usw. Keine Ahnung!

Ich möchte einfach nur eine bestimmte Gestaltung verwirklicht haben. Und wenn das nur mit Bootstrap 4 auf einfache Weise möglich wäre und Joomla 3 das nicht bietet, habe ich ein ernsthaftes Entscheidungsproblem, nämlich entweder (für meine Verhältnisse) viel Geld in eine Site-Entwicklung zu investieren, bei der ich nicht das erhalten kann, was ich mir wünsche und später noch mal investieren, wenn der ganze Krempel auf Joomla 4 gedreht werden muss.

Gar nichts machen geht auch nicht. Und die beabsichtigte Werbung auf meiner bisherigen Website zu verwirklichen, ist mit dem derzeitigen Layout kaum vernünftig zu machen, weil die neuen Inhalte auf Videoclips beruhen, die entsprechend eingebettet werden müssen, damit sie auf möglichst allen Geräteklassen und Browsern problemlos abspielbar sind.

Frage: Welche – möglichst kostenfreie – Joomla-Templates gibt es denn, die mit Bootstrap 4 laufen und zugleich noch unter Joomla 3 funktionieren? (Bei Joomla-Extensions habe ich keine Suchfunktion, um speziell solche Bootstrap-Templates heraus zu picken.)

Hab ich vor einer Stunde auch grad gemacht. Echt verwirrend viel, was da kommt. Vor allem werden dort immer irgend welche Template-Entwicklungsframeworks angeboten, teils für richtig viel Geld. Vermutlich ist das was für Entwickler von Templates und Joomla-Dienstleister, aber nicht für mich.

Joomlashine hat z.B. was, wo man per drag'n-drop sein Template zusammen stellen kann. Hab aber nicht begriffen, inwiefern man noch ein Basistemplate kaufen muss, um dann solch ein Drag'n drop einsetzen zu können.

Die Beschäftigung mit diesen Themen ufert vom Zeitbedarf dermaßen aus, dass mir zumindest null Freizeit mehr bleibt, denn die Steuer drängt ebenfalls...

Zudem fehlt mir komplett das nötige Wissen, um mich mit dem komplexen Krempel zurecht zu finden.

Eigentlich will ich doch "nuuuuur" eine einfache Website mit diesen Spalten-Layout erstellen und suche ein Template, das ich irgendwo runter lade, installiere und los geht's. Und das kann ich so bisher nicht finden.

WOW! Danke dir! Ja, was die schreiben, ist wenigstens für mich verständlich und nachvollziehbar.

Und sie schreiben auch, wie sie Konflikte mit dem in Joomla-3 vorhandenen Bootstrap 3 verhindern und dass es auch mit jQuery keine Konflikte gibt.

Soeben habe ich auch eine Anfrage an Rocket Themes geschickt. Die haben ein fast unüberschaubar großes Angebot an Themes (kostenpflichtig). Von denen nutze ich zurzeit das Modal-Plugin RokBox. Nach einigen Anpassungen läuft die inzwischen schon besser, als die JCE-Mediabox, besonders bei verschiedenen Geräteklassen.

Ein Bootstrap-4 Theme habe ich dort nicht gefunden, deshalb fragte ich ja bei denen an.

Aber mit dem von dir verlinkten Theme werde ich mich jetzt mal näher befassen. Fragt sich nur, wie groß der Aufwand wird, wenn ich das auf Joomla-4 nutzen möchte.

Inzwischen fand ich noch dies hier:

https://mobirise.com/bootstrap-4-theme/

Und für alle an bootstrap und Less Interesierte (wie mich zum Beispiel) fand ich dies hier:

https://medium.com/web-design-…-in-joomla-3-669a6a40614a

Erst jetzt hab ich eine Ahnung, was "Bootstrap" für meine künftige Website bedeutet.

Den LInk zu Mobirise nehme ich zurück: Hier geht es um ein cleveres Verkaufsmodell. Man lädt den Pagebuilder (nur Windows oder Mac) runter und installiert ihn als Programm. Nach dessen Start will es sofort mit dem Server von Mobirise verbunden werden. Danach öffnet sich der Webbrowser und man erhält haufenweise kostenpflichtige Templates und AddOns, damit man die eigene Site leichter aufbauen kann.

Wählt man nichts davon, hat man es schwer, eine akzeptabel erscheinende Seite aufzubauen.

Hab aber gerade was anderes gefunden:

https://startbootstrap.com/themes/

Mir aber nicht klar, wie ein solches Template in Joomla 3 integriert werden kann. (wie bei Mobirise auch).

Nachdem ich dies hier gelesen habe, bin ich nicht mehr sicher, ob wir hier in der Diskussion die "bootstrap-4-Technik" in Joomla 4 nicht stark überbewerten.

https://www.joomlashack.com/blog/joomla-news/css-grid/

Demnach verwendet Joomla 4 bootstrap 4 nur im Backend und im Frontend standardmäßig ein CSS-grid. Man kann aber anscheinend auch im Frontend „auf Bootstrap-4 umschalten“.

Zudem scheint Bootstrap 4 im Gegensatz zur CSS-Grid-Technik einen enormen Code-Overhead hat - auch an JS.... – sagt jedenfalls der o.g. Beitrag von Joomlashack.

Interessant ist, dass mein uraltes und bis jetzt aktiv genutztes JYAML-Template diese CSS-Grid-Technik bereits einsetzt. Damit bin ich eigentlich bisher immer gut gefahren. Ich empfinde es als leicht verständlich bei der Site-Erstellung und sehr stabil im Betrieb. JYAML darf mit Backlink kostenfrei genutzt werden, wird aber seit einigen Jahren nicht mehr gepflegt.

Ich danke dir für den Hinweis. Gestern Abend hatte ich mich auf eine Empfehlung hin noch mal mit Rocket Theme beschäftigt. Dort wird zunächst ein Framework installiert, genannt Gantry-5.

http://docs.gantry.org/

Und darauf aufbauend können dann die zu Gantry-5 passenden Templates installiert werden. Zwei davon sind kostenfrei und für erste Versuche gedacht.

Nach Installation auf einem neu angelegten Joomla konnte ich zwar das Gantry-Backend sehen, aber nichts davon funktionierte, wie in der eigentlich sehr guten Beschreibung dargestellt!

Wenn das aber funktionieren würde, dann wäre die Entwicklung meiner neuen Website wirklich einfach und grösstenteils mittels simpler drag'n drop-Technik im Backend realisierbar.

Zudem beinhaltet das Paket aus Gantry und einem passenden (kostenpflichtigen) Template, wie z.B. https://rockettheme.com/joomla/templates/callisto

bereits zahlreiche Features, die ich sonst durch separate Extensions verwirklichen müsste wie z.B. ein MobileMenü, einen Packer für JS und CSS sowie images und die von mir inzwischen genutzte Modalbox namens RokBox. Weitere Features kann ich für spätere Ergänzungen der Website nutzen., wie z.B. die integrierte Extension RokSprocket.

Einen auch nur annähernd großen Funktionsumfang liefert mit YooTheme nicht und kostet sogar mehr.

Aktuell habe ich aber in den nächsten 14 Tagen keine Zeit mehr, meine Absichten betr. neuer Joomla-Site weiter zu verfolgen, da anderes (mal wieder) viel wichtiger geworden ist.

Nun habe ich doch noch einige Fragen:

• Welche Erfahrungen habt Ihr mit den sogenannten Joomla-Sitebuilder oder Pagebuilder oder Templatebuilder?
• Wäre es voraussichtlich damit möglich, mein im ersten Beitrag beschriebenes Vorhaben evtl. auch ohne Joomla-Dienstleister umzusetzen? – oder würde ein Joomla-Dienstleister mir die Entwicklung günstiger anbieten können, wenn ein solcher "Builder" zum Einsatz käme?
• Neigen diese "Builder" dazu, den Code der resultierenden Website aufzublähen (lange Ladezeiten)?

Aktuell sind mir folgende "Builder" bekannt:

• das schon genannte Gantry-5 Framework von RocketTheme
• von Joomshaper der PageBuilder
• der Kiolezo von digireg.com

Gibt es Empfehlungen für einen bestimmten Builder? Dann sollten alle mir wichtigen Extensions bereits darin enthalten sein, nämlich:

• MobileMenue
• Modalbox / Lightbox (incl. Audio-Video-Abspielfunktion in der Box auf mögl. allen Geräteklassen)
• Accordion
• CSS-/JS-Kompression und SlowLoading von Bildern

Habe doch noch etwas herum probiert: Pagebuilder usw. möchte ich nun nicht mehr einsetzen. U.a. denke ich, je komplexer ein System wird, desto störanfälliger.

Mittlerweile habe ich eine dreiseitige Projektbeschreibung erstellt mit Links zu meinen Musterseiten, sodass Vieles, was nicht so einfach per Text definiert werden kann, nun auch anschaulich und zum Teil auch bereits funktional nachvollzogen werden kann. Fünf Joomla-Dienstleister habe ich damit angefragt. Fast alle haben so reagiert, wie ich es z.B. noch nie in Zeiten meiner Elektronikfirma erlebt habe: Sie haben mir Dinge angeboten, die ich nicht angefragt hatte, versuchten, mir meine Layoutvorstellungen auszureden und durch ihre eigenen zu ersetzen (Mehraufwand natürlich zu meinen Lasten) usw. usw.

Es reicht mir jetzt! Ich werde meine Site doch lieber selbst verwirklichen.

Daher frage ich hier jetzt, ob die Haupt-Aufgabe betreffend Template, nämlich den screenwidth-abhängigen Wechsel der Darstellung von einem einspaltigen zu einem zweispaltigen Layout (1/3 zu 2/3-Teilung) rein per CSS erledigt werden kann oder ob z.B. ein Eingriff in die index.php des jeweiligen Template erforderlich ist.

Oder entsteht die verringerte Breite des Hauptbeitrags bereits automatisch dadurch, dass ich die in der rechten 1/3-Spalte platzierten Module per CSS auf width = 30% screenwidth begrenze?

Ihr merkt sicher, dass ich bisher keine Ahnung von CSS-Grid-Systemen usw. habe, obwohl das bisher schon jahrelang von mir verwendete JYAML-Template durchaus mit einem CSS-Grid gearbeitet hat.

Zitat

Ich verlege meine Kabel auch lieber selber, weil die Elektrofirmen glauben es besser zu können.

Alle Dienstleistungen, deren Zukauf ich mir nicht leisten kann oder auch nicht leisten möchte, versuche ich, durch eigene Leistungen zu ersetzen – ganz besonders, wenn mir das auch noch Freude bereitet. Deshalb gibt es ja Heimwerker, die qualifizierte Arbeiten als Tischler, Schweißer, Glaser, Elektriker, Maurer usw. durchführen. Was soll daran verwerflich sein?

Zudem geht es mir hier darum, nicht Geld zu sparen, sondern meine Zeit zu sparen. Mir wären die Joomla-Arbeiten maximal 2.000 Euro wert gewesen. Aber die Anbieter wollten ja nicht meine Wünsche erfüllen, sondern ihr eigenes Ding durchziehen! Ich aber lasse es nicht zu, dass der Schwanz mit dem Hund wedelt.

Nun wieder zum Thema:

Bisher hatte ich immer die breit dargestellten Blog-Beiträge (main id="content") und wenn ich über Module einen Content anzeigen lassen wollte wie z.B. eine Menüleiste oder Kurzinformationen, so liegen die rechts davon am Rand (z.B. mit div id="aside"). Unterhalb einer bestimmten screenwidth habe ich diese entweder ausgeblendet oder aber unterhalb der Blog-Beiträge, also oberhalb des Footer angezeigt.

Dies funktionierte prima bei "Eigenes Modul", wo ich die Anzeige des Inhalts einfach durch eine @media-Regel bestimmt hatte. War die nicht erfüllt, erschien der Inhalt des Moduls nicht, die Spalte blieb also frei von Content und somit nahm der Hauptbeitrag dann die ganze Breite ein.

Aber wie kann ich dies bei den Modulen "Newsflash", "Beliebte" und "Neueste" erreichen?

Frage im Detail: Was muss ich tun, damit das Modul Newsflash bei Unterschreiten einer screenwidth seine Position wechselt von "rechter Rand" zu "oberhalb Footer"?

Und falls ein Positionswechsel per CSS-Anweisung nicht möglich ist, muss ich das Newsflash-Modul eben zwei mal anlegen, je Position ein Mal.

Aber wo und wie definiere ich die @media screenwidth-Regel? Kann ich dies evtl. unter Modul/Erweitert/Modulklassensuffix eintragen?

Zusatzfrage: Aktuell experimentiere ich wieder mit dem Protostar Standard-Profile. Es hat ein Grid mit 12 Spalten. Die Spaltenbreiten sind per CSS definiert. Die rechte Spalte ist mit lediglich 23% Breite definiert (span3). Ich benötige "span4" mit knapp 32%.

In der index.php des Template werden die Breiten-Angaben den beiden Randspalten zugewiesen. Aber offensichtlich nicht nur dort. Denn wenn ich dort "span3" einfach gegen "span4" austausche, bleibt die Randspalte leer und auch dort platzierte Module werden nicht angezeigt.

Da auch andere CSS-grid-basierte Templates ähnlich arbeiten, müsste es möglich sein, dass ich hier Tipps für Anpassungen erhalte.

Oder bin ich etwa mit dem Angang meines vorigen Postings schon im Forum „in Ungnade gefallen“???