[TYPO3-german] REZEPT für RESPONSIVE WEB DESIGN gesucht / Zubereitungszeit: kurz / Schwierigkeitsgrad: leicht

[d.ros]

Am 27.05.2013 22:29, schrieb Manuel Fortunella:
> Ich bin ein Typo3-Neuling und habe mich daran gemacht, eine Webseite zu
> erstellen.

Sehr schön !

>
> Das Ziel ist es mit überschaubarem Aufwand unter Verwendung von erprobten
> Techniken eine Seite mit Responsive Web Design zu erstellen.

Das ist relativ. Da das System eine gehörige Lernkurve mitbringt und man 
viele Dinge auf verschiedenste Art und weise lösen kann.

>
> MEINE ÜBERLEGUNGEN WAREN FOLGENDE:
> Damit die Seiten auch auf mobilen Geräten vernünftig dargestellt werden,
> habe ich eine auf Bootstrap basierende HTML-Vorlage genommen (jetstrap.com).
> Dieses Template habe ich dann in Typo3 integriert und das Menü mit
> Typoscript umgesetzt. Dann wollte ich die Content Elemente integrieren und
> habe um zusätzlichen Aufwand zu vermeiden, versucht diesen durch die
> Erweiterung „CSS styled content“ rendern zu lassen.


CSS styled content ist im Prinzip eine eigene Art Inhalte aufzubereiten 
und auszugeben. Daher auch Deine unten stehende Feststellung.


>
> NUN STELLE ICH FEST, DASS
> a) Bilder im Content Element „Text“ oder „Text & Images“ gar nicht
> ausgegeben werden,
> b) Texte gegenüber dem Header eingerückt werden und
> c) die erstellte Seite voller div-Container ist, so dass ich das Wenige an
> Übersicht über den erzeugten HTML-Code, das ich hatte, noch  ganz zu
> verlieren drohe.


Ja und nein. Entweder freundest Du dich mit CSC an oder Du geht einen 
anderen weg.


>
> Ich frage mich nun, ob der gewählte Weg der beste ist. Darum hier nun meine
> Fragen:
>
> FRAGE 1
> Woran liegt es, dass die Ausgabe nicht korrekt funktioniert? Gibt es hier
> ein Problem im Zusammenspiel von Bootstrap und CSS styled content?


Jain. Du musst CSC kennen bzw. Dir aneignen, um entsprechend Dinge 
anders zu formatieren.


>
> FRAGE 2
> Drängt sich für die Lösung meines Problems ein anderer Ansatz auf, als der
> gewählte? Die Umsetzung sollte relativ einfach sein.



Einfach ist wieder relativ. Flexibel ist die bessere Umschreibung. Z.B. 
gibt es ein Fluid ( Templating Engine ) / Extbase ( Programmierframework 
MVC basiert ) basiertes Erweiterungsuniversum, welches einem das Leben 
sehr erleichtert. http://www.fedext.net

Übersicht des Zusammenspiels einzelner Erweiterungen ( 
http://fedext.net/overview/extensions.html )

Gerade als Neuling ist die Lernkurve hier sehr steil, wird Dich aber am 
Ende sehr überzeugen, da das System ( Fluid ) der Flexibilität keine 
Grenzen setzt.

Also sollten für Dich diese EXT: fluidcontent_bootstrap und EXT: 
fluidpages_bootstrap aus 
http://fedext.net/overview/extensions/template-libraries.html der 
richtige Weg sein.

Beschaffen kannst Du diese über das TER ( TYPO3 Extension Repository )
-> 
http://typo3.org/extensions/repository/?q=Claus%20Due&tx_solr%5Bsort%5D=lastUpdate%20desc

Wenn dann erstmal die ersten Schritte gemacht sind, wirds interessant. 
Dann gehts hier lang -> http://fedext.net/viewhelpers/fed.html

Du wirst sicherlich hier mindestens 40 Std. verbrauchen, um das 
Zusammenspiel und die Wirkungsweisen zu verstehen.

Hier noch die allgemeinen Hilfestellungen zu Fluid ohne die Fedext 
Erweiterungen:

http://docs.typo3.org/flow/TYPO3FlowDocumentation/TheDefinitiveGuide/PartIII/Templating.html

FAZIT: Zubereitungszeit habe ich Dir genannt. Da wirst Du nicht drum 
herum kommen, wenn Du flexibel arbeiten willst. Der Schwierigkeitsgrad 
ist relativ. Der eine nimmts mal eben so mit, der andere braucht halt 
länger.

Alternative: TYPOSCRIPT satt: Nimm Dir die 
~/typo3_src/typo3/sysext/css_styled_content/static/setup.txt als 
Vorlage, lerne sie zu verstehen, mach Deine eigene Rendering Engine 
daraus. Zeitansatz ? Wahrscheinlich 20 Std. weniger. aber am Ende ist 
das nur Rüstzeug.

Flexibel wird es mit Fluid. Insbesondere vor dem Hintergrund, dass mehr 
und mehr Erweiterungen darauf aufbauen und diese nach dem Fluid Prinzip 
angepasst werden können.

Grüße

David


PS1: Du kannst Fluid mit Typoscript weiterhin verweben. Kein Problem.

PS2: Achte darauf, dass Du nach Möglichkeit um _pi_base Extensions einen 
Bogen machst und so weit es geht, Dich an Extbase Erweiterungen hälst.

PS3: Das Buch ist zum Einstieg ganz hilfreich. -> 
http://www.amazon.de/b%C3%BCcher/dp/3897219654


Für Die Suchmaschine:

TYPO3 - Was sollte ein Anfänger tun ?

TYPO3 Einstieg Fluid.

TYPO3 Einstieg FEDEXT.

TYPO3 Responsive Einstieg

>
> Ich würde mich freuen, wenn jemand von den alten Typo3-Hasen mir
> weiterhelfen könnte.

Ist geschehen. Frohes Lernen & gib nicht auf.  Fragen können immer hier 
in der Mailingliste ( Woraus sich http://forum.typo3.org speist ) 
gefragt werden und auch der IRC Kanal ( 
http://typo3.org/support/irc-chat/ ) ist eine richtige Anlaufstelle.

Wichtig ist nur, so wie Du das schon sehr richtig gemacht hast, eine 
qualifizierte Frage zu stellen.

1. Istzustand benennen.
2. Eigene Ideen formulieren und ggf. validieren lassen.
3. Lösungsweg erfragen.

Und das Ganze natürlich detailliert beschreiben !


>
> Gruss
>
> Manuel
>