Bootstrap 3 für Contao

[ways2web]

@webstar

sag mal.. das css auf http://contao-bootstrap.netzmacht.de ist sicher angepasst oder? die Original verursachen irgendwie fehler bei den dropdowns auf mobilen seiten.
(wenn der letzte menüpunkt dropdown-toggle verwendet, wird nicht die benötigte höhe generiert, so dass sie sub-levels nicht zu sehen sind)

Mit deiner Seite habe ich diese Probleme nicht auf mobilen Geräten.

Hast du da nen Tip?

[webstar]

@ways2web

Nein, die Templates sind nicht angepasst. Wie schon mehrfach in diesem Thread geschrieben, liegt der Trick darin in Dropdown Toggles als Ordner mit der Erweiterung "m17pageFolders" zu erstellen.

Ich werde aber - da damit wohl viele nicht klarkommen - in Zukunft alle Seiten mit Unterseiten zu Toggle machen.

[ways2web]

@ways2web

Nein, die Templates sind nicht angepasst. Wie schon mehrfach in diesem Thread geschrieben, liegt der Trick darin in Dropdown Toggles als Ordner mit der Erweiterung "m17pageFolders" zu erstellen.

Ich werde aber - da damit wohl viele nicht klarkommen - in Zukunft alle Seiten mit Unterseiten zu Toggle machen.

ok, das hab ich wohl überlesen.

Nachdem ich die Hauptseite der toggles als Ordner angelegt habe, geht das ganze nun wohl auch... zumimndest aufm Desktop.. dafür will mein handy die seite nun nicht mehr in mobiler form darstellen...sondern zoomt sie runter, bis man alles sieht... brr.. am Rechner läuft das aber alles..

Gibt es in der Anleitung irgendwo ein Bereich, der anzeigt, welche css und js eingebunden wurden bei der Demo seite?

[webstar]

ok, das hab ich wohl überlesen.

Nachdem ich die Hauptseite der toggles als Ordner angelegt habe, geht das ganze nun wohl auch... zumimndest aufm Desktop.. dafür will mein handy die seite nun nicht mehr in mobiler form darstellen...sondern zoomt sie runter, bis man alles sieht... brr.. am Rechner läuft das aber alles..

Gibt es in der Anleitung irgendwo ein Bereich, der anzeigt, welche css und js eingebunden wurden bei der Demo seite?

Klingt nach fehlender Viewport-Einstellung im Layout.

Im Prinzip arbeite ich mit den Default-Dateien von Bootstrap (bootstrap.min.css + bootstrap.min.js). Ein paar Anpassungen mache ich für den fixierten Header und das meiste für die Suche im modalen Fenster.

[ways2web]

Klingt nach fehlender Viewport-Einstellung im Layout.

Im Prinzip arbeite ich mit den Default-Dateien von Bootstrap (bootstrap.min.css + bootstrap.min.js). Ein paar Anpassungen mache ich für den fixierten Header und das meiste für die Suche im modalen Fenster.

das mit dem viewport ist eingestellt.. ist ja nicht meine erste contao-bootstrap installation und das Problem gibt es bei den anderen installationen nicht... jedoch meine erste Installation unter Contao 3.3.x (ich prüfe noch mal mögliche Cache fehler)

Layout-einstellungen viewport: b1.png

Mit dem fixierten Header... weil der Content sonst unter der Navigation verschwindet?

[webstar]

das mit dem viewport ist eingestellt.. ist ja nicht meine erste contao-bootstrap installation und das Problem gibt es bei den anderen installationen nicht... jedoch meine erste Installation unter Contao 3.3.x (ich prüfe noch mal mögliche Cache fehler)

Wird der auch im Quelltext gesetzt? Grad bei meiner Seite überprüft. Da wird der Viewport auch nicht gesetzt. Vermute mal, dass es ein Bug ist mit der neu konfigurierbaren Möglichkeit des Viewports unter Contao 3.3. Kannst du ein Ticket aufmachen?

Mit dem fixierten Header... weil der Content sonst unter der Navigation verschwindet?

Ja, genau.

[ways2web]

Wird der auch im Quelltext gesetzt? Grad bei meiner Seite überprüft. Da wird der Viewport auch nicht gesetzt. Vermute mal, dass es ein Bug ist mit der neu konfigurierbaren Möglichkeit des Viewports unter Contao 3.3. Kannst du ein Ticket aufmachen?



Ja, genau.

Mit dem Quelltext habe ich angefangen.. und siehe da.. kann es bestätigen. Der Viewport teil wird gar nicht generiert im quelltext. Ein Ticket werde ich gleich auf github setzen.. kein Ding.

mit dem fixed Header. gibt es da eine bewährte css-zeile für das Problem? Ich hab das in meiner anderen Installation auf die 4 verschiedenen Auflösungen jeweils gesetzt... aber vielleicht gibt es da ja was anständiges, als meine quick&dirty Lösung?

[webstar]

Mit dem Quelltext habe ich angefangen.. und siehe da.. kann es bestätigen. Der Viewport teil wird gar nicht generiert im quelltext. Ein Ticket werde ich gleich auf github setzen.. kein Ding.

mit dem fixed Header. gibt es da eine bewährte css-zeile für das Problem? Ich hab das in meiner anderen Installation auf die 4 verschiedenen Auflösungen jeweils gesetzt... aber vielleicht gibt es da ja was anständiges, als meine quick&dirty Lösung?

Meinte eigentlich ein Ticket bei meinem Bootstrap Projekt. Das Problem trat durch das Custom Select Menü aus, was mit dem Apache 2.4 nicht klarkommt. Da es nur als kleine Hilfestellung gedacht war, habe ich es entfernt. Im master Branch ist es hoben. Werde spätestens anfang nächster Woche eine neue Version taggen.

Eine allgemeine Lösung kenne ich nicht. Hängt ja auch immer davon ab, ob man den Header fixiert, welche Größe man vorsieht usw.

[ways2web]

ich möchte webstar ja hier kein Bootstrap Kurs abkauen...

aber weiß jemand, wie das footer menü auf der Demo-Seite so responsive gemacht wird/wurde?

es liegt kein template mit dem dropup vor oder?

[tpk]

Ich verwende Bootstrap mit Contao ohne Deine Erweiterung, und habe das Problem, dass die Navigation (Dropdowns) mit Mootools in Schwulitäten kommt. Tritt das bei Deiner Erweiterug nicht auf?

[ways2web]

Ich verwende Bootstrap mit Contao ohne Deine Erweiterung, und habe das Problem, dass die Navigation (Dropdowns) mit Mootools in Schwulitäten??? kommt. Tritt das bei Deiner Erweiterug nicht auf?

ist mootools für dich unverzichtbar, beim einsatz von bootstrap?

[tpk]

Nuja, ich brauch's gerade nur für calendarfield (für Eingaben von Datum in Textfeld), wenn's dafür ne Alternative gibt, schalte ich Mootools gerne aus :-)

[webstar]

Ich verwende Bootstrap mit Contao ohne Deine Erweiterung, und habe das Problem, dass die Navigation (Dropdowns) mit Mootools in Schwulitäten kommt. Tritt das bei Deiner Erweiterug nicht auf?

Wenn es da Probleme gibt, wird das mit meiner Erweiterung auch auftreten. Ich verlinke ja auch nur die offiziellen Dateien von Bootstrap.

Grundsätzlich setze ich nur noch jQuery ein, wenn ich nicht gerade etwas im Backend von Contao mache.

[webstar]

ich möchte webstar ja hier kein Bootstrap Kurs abkauen...

aber weiß jemand, wie das footer menü auf der Demo-Seite so responsive gemacht wird/wurde?

es liegt kein template mit dem dropup vor oder?

Das ist doch das gute an einer Website, dass man das meiste im Quelltext findet. Tipp: Schau mal in der Javascript-Dateien nach.

[tpk]

Nach ner guten Mütze Schlaf habe ich den Datepicker von jqueryUI reingebastelt.

[ways2web]

Das ist doch das gute an einer Website, dass man das meiste im Quelltext findet. Tipp: Schau mal in der Javascript-Dateien nach.

hab ich natürlich getan, vielen Dank dafür.
Wenn ich jetzt noch jumbotron angwendet bekomme, dann ist meine Bootstrap Spielwiese Einsatzbereit und ich kann mich mehr mit all den Möglichkeiten von bootstrap befassen.
Und die sind ja vielfältig.

contao-bootstrap ist für mich eine der besten Extensions unter Contao. werde auch bald mal nen Artikel auf Contao-Tutorials.de dazu verfassen.

[webstar]

hab ich natürlich getan, vielen Dank dafür.
Wenn ich jetzt noch jumbotron angwendet bekomme, dann ist meine Bootstrap Spielwiese Einsatzbereit und ich kann mich mehr mit all den Möglichkeiten von bootstrap befassen.
Und die sind ja vielfältig.

contao-bootstrap ist für mich eine der besten Extensions unter Contao. werde auch bald mal nen Artikel auf Contao-Tutorials.de dazu verfassen.

Danke, freut mich, wenn die Erweiterung weiterhilft!

Mit den Jumbotron ist es recht einfach: Im Layout einen individuellen Layoutbereich erstellen mit dem Namen jumbotron. Dann kann man einen Artikel anlegen und bei Anzeigen In jumbotron auswählen.

[ways2web]

Danke, freut mich, wenn die Erweiterung weiterhilft!

Mit den Jumbotron ist es recht einfach: Im Layout einen individuellen Layoutbereich erstellen mit dem Namen jumbotron. Dann kann man einen Artikel anlegen und bei Anzeigen In jumbotron auswählen.

uh. Es war tatsächlich genau so einfach. Manchmal sieht man den Wald vor lauter bäumen nicht.

Und wieder einmal. Danke webstar!

[ways2web]

Tabs (Reiter)
funktioniert bei euch das Tabs (Reiter) unter contao 3.3.3 problemlos ?
ich kann es nutzen, bzw anlegen und auch verwenden, aber wenn ich zuviele Tabs auf einmal anlege kommt ab und zu ne Fehlermeldung.

Und das löschen der einzelnen Tabs muss immer über das Startelement erfolgen, löscht man nur die Inhaltselemente -> Reiter-Elemente (Reiter Trennelement) so bleiben die weiter im Frontend erhalten.


Modale Fenster
http://contao-bootstrap.netzmacht.de...ialoge/modals/

bei mir will die Demo von webstar nicht funktionieren, bei euch?

[Mr. Acylase]

Hallo und guten Morgen zusammen,

habe plötzlich das Problem, das dass Mobile Menü nicht mehr funktioniert . Das Menü wird zwar angezeigt, aber reagiert beim klicken nicht. Hat das von euch schon mal einer gehabt, bzw. hat einer eine Ahnung woran das liegen kann?

Vielen Dank und Grüße
Stefan

Edit:
Problem ist gelöst. Ursache war ein Fehler in der CSS. Nach neuem Laden der CSS Datei bootstrap.min.css funktioniert es wieder.

[webstar]

Tabs (Reiter)
funktioniert bei euch das Tabs (Reiter) unter contao 3.3.3 problemlos ?
ich kann es nutzen, bzw anlegen und auch verwenden, aber wenn ich zuviele Tabs auf einmal anlege kommt ab und zu ne Fehlermeldung.

Und das löschen der einzelnen Tabs muss immer über das Startelement erfolgen, löscht man nur die Inhaltselemente -> Reiter-Elemente (Reiter Trennelement) so bleiben die weiter im Frontend erhalten.


Modale Fenster
http://contao-bootstrap.netzmacht.de...ialoge/modals/

bei mir will die Demo von webstar nicht funktionieren, bei euch?

Zu den Tabs: Die Fehlermeldung ist ein Bug, in Master Branch bereits behoben. Das das Löschen der Tabs nicht funktioniert, ist bisher von der Architektur so bedingt, da ich die Überschriften im Anfangs-Element speichere. Eigentlich würde ich die Buttons der Elemente ausblenden, nur ist das mit Contao nur eingeschränkt möglich. Mache doch ein Feature Request (im Contao-Bootstrap Issue Tracker ), dass ich beim Löschen der Elemente die entsprechende Überschrift mit entferne.

Zu den Modalen Fenstern: Danke, ein Update hatte mir die Konfiguration zerschossen. Muss ich mal fixen.

[Mr. Acylase]

Hallo zusammen,

kann mir einer helfen und mir vieleicht sagen wie ich mit Bootstrap einen Sticky Footer (ohne Navbar-fixed-bottom) hin bekomme? Stehe irgendwie auf dem Schlauch

Vielen Dank und Grüße
Stefan

[ways2web]

wenn ich richtig liege ist es ohne bootstrap natürlich rein eigenes css, dass du überall im netz findest.

[Mr. Acylase]

Hallo und guten Morgen,

Danke ways2web, hat jetzt funktioniert. Hatte einen Fehler in meiner CSS. Aus diesem Grund wollte der Footer nicht so wirklich nach unten wandern.

Grüße

Stefan

[matthias123]

Hallo zusammen,

Gibt es eine Möglichkeit Bootstrap Tabellen zu verwenden? Wie kann ich einer Tabelle, also mit dem Standard Contao Inhaltselement, Klassen zuweisen?

[Mr. Acylase]

Hallo matthias123,

das kannst Du im Texteditor erledigen. Musst nur mit dem dafür vorgesehenen Button in die Quellcodeansicht wechseln.

Grüße

Stefan

[Mr. Acylase]

Hallo zusammen,

benötige wieder ein wenig Hilfe. Meine erste, mit der Bootstrap Erweiterung erstelle Webseite steht kurz vor dem Start. Leider habe ich mit dem Akkordeon schwierigkeiten. Bei der Mobilen Ansicht werden mir die Akkordeon Elemente Angezeigt, jedoch kann ich diese weder öffnen noch schließen. Am PC hingegen funktioniert es einwandfrei. Woran könnte das liegen?

Vielen Dank und Grüße
Stefan

[tpk]

Könnte es sein, dass Du bei der mobilen Version MooTools aktiv hast, Desktop nicht?
Oder eine js-Datei von Bootstrap nicht inkludiert? Klingt jedenfalls nach einem js-Fehler.

[webstar]

Hallo zusammen,

Gibt es eine Möglichkeit Bootstrap Tabellen zu verwenden? Wie kann ich einer Tabelle, also mit dem Standard Contao Inhaltselement, Klassen zuweisen?

Dazu muss man zur Zeit das Template anpassen, da Contao die Klasse nur in das Ce-Element setzt. Ich werde allerdings eine Rewrite-Regel hinzufügen, die wenn man im CSS-Klassenfeld eine der Table-Klassen von Bootstap einfügt, diese ins Table-Element übernommen werden. Dies wird übrigens auch so beim Image-Element gemacht.

[ways2web]

kurze Frage zu den css files.

wenn ich die bootstra.min.css im theme+ über assets files auswähle... passt alles wie gewünscht mit dem bootstrap css.
Wenn ich jedoch den code dieser datei als codeschnipsel einfüge, fehlt ziemlich viel funktionalität.

kann es sein, dass der ace-editor mit dem code probleme hat.. ?

[Mr. Acylase]

Hallo und guten Morgen,

@tpk
Erstmal vielen Dank für Deine Antwort.

Könnte es sein, dass Du bei der mobilen Version MooTools aktiv hast, Desktop nicht?

Da ich bei dem Layout Responsive arbeite habe ich ein nur ein Template im Einsatz. Habe hier statt MooTools für das Akkordeon jQuery im Einsatz.

Oder eine js-Datei von Bootstrap nicht inkludiert? Klingt jedenfalls nach einem js-Fehle

Hier habe ich die "bootstrap.min.js" eingebunden (Versuchweise auch mal vom bootstrap Server). Leider auch ohne Erfolg.

Grüße

Stefan

[tpk]

@ Mr. Acylase

Eigenartiger Fehler. Was passiert, wenn Du im Browser auf Smartphone-Breite testest? Geht es da? Was für ein Betriebssystem hat Dein Smartphone? WinPhone bockt bei Bootstrap.

Welches Akkordeon hat eigentlich Ausfallerscheinungen. Das von Contao oder das von Bootstrap?

[webstar]

Hallo zusammen,

benötige wieder ein wenig Hilfe. Meine erste, mit der Bootstrap Erweiterung erstelle Webseite steht kurz vor dem Start. Leider habe ich mit dem Akkordeon schwierigkeiten. Bei der Mobilen Ansicht werden mir die Akkordeon Elemente Angezeigt, jedoch kann ich diese weder öffnen noch schließen. Am PC hingegen funktioniert es einwandfrei. Woran könnte das liegen?

Vielen Dank und Grüße
Stefan

Sind die Elemente auch als Collapse markiert? Ist ein Element standardmäßig augeklappt? http://files.netzmacht.de/files/imag...pper/panel.png

[Mr. Acylase]

@tpk

Was passiert, wenn Du im Browser auf Smartphone-Breite testest?

Funktioniert einwandfrei

Was für ein Betriebssystem hat Dein Smartphone

Habe ein Eierphone mit IOS drauf.

Welches Akkordeon hat eigentlich Ausfallerscheinungen. Das von Contao oder das von Bootstrap?

Ich habe das Akkorderon von Bootstrap (Gruppe Anfang + Ende inkl. Einzelelemente) verwendet, da das Akkordeon von Contao alle Reiter beim Starten der Seite komplett aufmacht.

@webstar

Sind die Elemente auch als Collapse markiert? Ist ein Element standardmäßig augeklappt?

Alle Elemente bis auf das erste Element sind mit Collapse Markiert. Das Erste ist standartmäßig ausgeklappt mit Collapse in.

Grüße
Stefan

[tpk]

Hilft das?

http://stackoverflow.com/questions/1...work-on-iphone

[Mr. Acylase]

Das würde bedeuten das ich für das Eierphone das Akkordeon Template anpassen und um <a>l........</a> und dem entsprechenden Link erweitern müsste, oder?

Grüße
Stefan

[tpk]

Ich hab nur mal gegoogelt und bin kurz drübergeflogen. Hab das Problem ja selber nicht, weil ich kein IPhone habe ;-)

[Mr. Acylase]

Ok, Du hast mich auf eine Idee gebracht.......

.......hab ein Iphone zu verkaufen

[ways2web]

hat schon mal jemand das bootstrap.min.css erfolgreich in Contao importieren können (damit man es bearbeiten kann) statt es nur einzubinden?

ich hab noch nicht geprüft was das Problem ist, aber wenn ich es importiere, dann geht das layout zu grunde ^^

gruss
ways

[Mr. Acylase]

Guten Morgen,
Ich habe die Bootstrap.min.css per ftp in meinen Files Ordner kopiert und dann importiert damit ich diese bearbeiten kann. Bis jetzt sind mir am Layout noch keine Probleme aufgefallen. Inwiefern wird dein Layout zerschossen?
Grüße Stefan