Antworten zum Thema „Mit Contao eigenes Design anpassen. Probleme!“

[onpoint]

Hallo

ich habe da ein Problem mit Contao..bin Neueinsteiger was CMS Systeme angeht, aber habe mich schon ausgiebig informiert..und auch schon ein Buch von Thomas Weitzel gelesen....in diesem Buch überspringt er nur leider ausschlaggebende Punkte

Was ich möchte: Mein Photoshop Design an das CMS Contao anpassen.

Meine Seitenstruktur sind momentan so aus:



Die Navigation steht, Fußzeile etc. steht auch.

Wie man das eigentliche Design anpasst überspringt der Herr Weitzel jedoch leider.
Somit hab ich mich informiert und fange an die fe_page.xhtml zu bearbeiten.

Vorher habe ich natürlich ein Theme angelegt..ein neues Template der fe_page in einem neu erstellten "meintemplate" ordner, auf den das Theme verweist.

in meinem neuen Template Ordner liegt nur die "fe_page.xhtml".

Dieser passe ich jetzt meine CSS Dateien an, die ich im Backend angelegt, und im Seitenlayout auch dem Layout zugewiesen habe,.

Nur leider kann ich in die CSS eintragen was ich will, es wirkt sich im Frontedmodus nicht auf die Seite aus! Als stimme die Verknüpfung nicht...

Kann mir jemand weiterhelfen? Bin mittlerweile echt ratlos...

lg

Nachtrag:

Dazu muss gesagt werden, nachdem ich eine CSS Datei im Backend erstelle, und im Seitenlayout via Hakensetzung auf sie zuweise, wird sie mir im Quellcode NICHT angezeigt!
Somit habe ich sie bei "zusätzliche befehle im head" selbst eingetippt..sollte eigentlich auch nicht sein..

 

[donnabyte]

AW: Mit Contao eigenes Design anpassen. Probleme!

Da schließe ich mich gleich an und bin auch Nneueinsteigerin in CMS und contao. Vor einigen Wochen hab ich auch schon versucht aus dem Template der "Music Academy" etwas Neues für meine www.dielichtformer.de herzustellen. Irgendwann war ich so gefrustet, dass ich an mehreren Plätzen meine eigenen Header und Footer unterzubringen, aber irgendwie ist die Music Academy ziemlich dominant und zeigt mir im Frontend nie das an, was ich sehen möchte. Dann hab ich irgendwo gelesen, man sollte contao mal ohne dieses Template installieren und wirklich bei Pontius und Pilatus anfangen. Allerdings habe ich das noch nicht begonnen, weil ich zwischendurch noch ein bischen Geld verdienen mußte...
Wer kann uns bei contao und besonders beim Grunddesign helfen?

 

[une_art]

AW: Mit Contao eigenes Design anpassen. Probleme!

@onpoint: Deine Seitenstruktur kann man unter dem Link leider nicht sehen, da dieser auf den Backendbereich deiner Cotnao-Seite verweist. Und da kommt man ohne Benutzernamen und Passwort natürlich nicht rein Mach am besten mal einen Screenshot und zeige den.

Zu deinem Problem: Ich kann nicht genau nachvollziehen, wo sich der Fehler eingeschlichen haben könnte. Darum beschreibe ich einfach mal grob das generelle Vorgehen.
Du erstellst erst ein "Theme". Dann gehst du bei dem Theme auf Seitenlayouts und erstellst ein neues Layout. Dieses weist du als Standardlayout zu.
Nun erstellst du unter Templates einen neuen Ordner mit dem Namen des Themes (sollte der noch nicht existieren). Darin erstellst du ein neues Template (Originaltemplate fe_page) das dann "fe_page.tpl" heißen sollte. Du kannst es auch noch umbenennen (z.B. fe_page_custom) indem du auf den Stift rechts daneben klickst.

Jetzt gehst du wieder in "Themes" und klickst neben deinem Theme auf CSS um dort ein neues Stylesheet zu erstellen.
Dann musst du dieses noch unter "Themes"->"Seitenlayouts"->"Dein Layout" aktivieren. Außerdem dort in den Experten-Einstellungen das neue Seitentemplate (z.B: fe_page_custom) auswählen.

Jetzt ist dein Theme mit dem CSS-Stylesheet und dem Template verknüpft.
In der Seitenstruktur musst du den Seiten jetzt noch das Theme zuweisen, aber das sollte bei dem Standardtheme eigentlich automatisch passieren.

In der Template-Datei "fe_page_custom.tpl" kannst du nun quasi an der Struktur des Codes rumbasteln. Ich würde aber eher empfehlen solche Sachen über Module einzubinden.
Mit den Stylesheets kannst du dann alles hübsch machen. Du kannst mehrere anlegen, musst diese dann im Seitenlayout aber immer aktivieren.

Ich hoffe, das hilft euch erst mal weiter. Bei Fragen, fragt einfach

P.S: Mit der Erweiterung "csseditor" bekommt man die Möglichkeit, CSS-Stylesheets und Templates direkt im Backend zu bearbeiten. Ist aber in neueren Contao-Versionen meines Wissens sogar vorinstalliert.

@donnabyte: Ich würde generell empfehlen, Contao ohne das Music Academy Theme zu installieren. Damit ist deine Contao Seite schon total vollgestopft mit Content, Modulen etc. und man blickt gar nicht mehr durch. Um sich alles mal anzuschauen und ein bisschen rum zu probieren ist es gut, zum Erstellen einer eigenen Seite aber meiner Meinung nach höchst unvorteilhaft.

 

[onpoint]

AW: Mit Contao eigenes Design anpassen. Probleme!

@une_art:

Danke für die genauen Anweisungen! Besser hätte man es nicht schreiben können!

So, nun habe ich von mir alle themes und bearbeiteten templates gelöscht und nach deiner Anleitung alles erneut begonnen.

Theme ist erstellt, Seitenlayout angepasst, neuer Templateordner + Template erstellt, jedoch:

- habe ich keine tpl dateien..bei mir sind es xhtml und xhtml5 dateien.
- kann ich im Seitenlayout nicht meine benannte "fe_page_custom" auswählen, sondern mir wird nur die ursprüngliche "fe_page" angezeigt...

die CSS Verknüpfungen stehen nach wie vor nicht drin..

 

[LaFaSiLuc]

AW: Mit Contao eigenes Design anpassen. Probleme!

holt euch das galileo Buch, bzw. sucht euch die online anleitung raus, dann ist es plausibel. man muss einmal den zusammenhang von Seitenstruktur und dem ganzen kram begreifen. normalerweise kann man tatsächlich fast alle designs mit den vorhandenen Seitenlayouts erstellen. an die fe_page braucht man nicht ran. du kannst ja eigenen html code erstellen, zusätzliche module reinfummeln usw.
das contao-forum ist da sehr hilfreich und nett


@donnabyte
euer layout wäre doch auch schnell zu machen. man muss nur bedenken, dass die Artikel die Grundlage von Contao sind. Auch Bilder sind Artikel,, etc...

 

[une_art]

AW: Mit Contao eigenes Design anpassen. Probleme!

Oh entschuldige. Ich habe noch eine ältere Version von Contao auf meiner Seite. Da ich in letzter Zeit viel anderes zu tun habe, war ich nicht auf dem neusten Stand.
Ab Contao 2.10 heißen die Template-Dateien statt .tpl nun .xhtml. Das macht aber so wie ich das sehe keinen Unterschied.

Hast du die neue Template-Datei auch ganz sicher in einem Ordner, der den gleichen Namen trägt, wie dein Theme?

Wie mein Vorredner bereits richtig bemerkte, brauchst du die Template aber eigentlich kaum. Du kannst fast alles nur mit Stylesheets und Modulen erledigen. Die Templates braucht man dann für fortschrittlichere Anpassungen.

 

[onpoint]

AW: Mit Contao eigenes Design anpassen. Probleme!

Kein Problem!

Ja habe ich. Habe DIESES Problem aber gerade gelöst. Beim Theme habe ich vergessen das Template Verzeichnis auszuwählen. Jetzt ist fe_page_custom auch im Seitenlayout ausgewählt.

Eine Css wurde auch erstellt..jedoch zeigt er mir diese immer noch nicht an!

Oder schaue ich einfach an der falschen Stelle? Ich suche diese im Quelltext des Fronted Modus.
Er zeigt mir lediglich eine contao.css und 2 css dateien mit jeglichen Zahlen.

Ps: Hier der richtige Pfad:

Lg

 

[une_art]

AW: Mit Contao eigenes Design anpassen. Probleme!

Hast du in den Einstellungen des Seitenlayouts "Stylesheets zusammenfassen" deaktiviert?

 

[onpoint]

AW: Mit Contao eigenes Design anpassen. Probleme!

Die Einstellung gibt es bei mir nicht.

Ich kann lediglich die tl_files/tinymce.css ignorieren...

 

[une_art]

AW: Mit Contao eigenes Design anpassen. Probleme!

Wo genau hast du das CSS-Stylesheet denn angelegt? Beschreib mal was du geklickt hast.

 

[onpoint]

AW: Mit Contao eigenes Design anpassen. Probleme!

Wie folgt:

Themes -> Standardtheme -> Dort das Symbol für "Stylesheets bearbeiten" -> Neues Stylesheet -> Namen eingetragen und Medientyp "screen" -> Speichern und schließen

 

[une_art]

AW: Mit Contao eigenes Design anpassen. Probleme!

Das ist alles richtig soweit.
Kannst du das Css-Stylesheet denn im Seitenlayout sehen und aktivieren?

 

[onpoint]

AW: Mit Contao eigenes Design anpassen. Probleme!

Ja, wie man hier sieht:

 

[une_art]

AW: Mit Contao eigenes Design anpassen. Probleme!

Okay daran kann es also auch nicht liegen. Hast du denn unter "Seitenstruktur" in den Einstellungen der Seite untern "Layout-Einstellungen" ein Häkchen bei "Ein Layout zuweisen" gemacht und dort das Standard Seitenlayout ausgewählt?

Falls nicht, musst du das machen, am besten für die Seite die den Typ "Startpunkt einer Webseite" hat. Dann wird es gleich auf alle Unterseiten angewendet.

Vielleicht noch kurz zur Erklärung: Contao kennt zwar dein Theme und weiß welches Seitenlayout da Standard ist. Aber es weiß noch nicht, dass deine Seiten auch dieses Theme, bzw. Seitenlayout benutzen sollen.

 

[onpoint]

AW: Mit Contao eigenes Design anpassen. Probleme!

Ja, das erstellte Standardlayout ist auf der Hauptseite ausgewählt, also auf der mit dem Typ "Startpunkt einer Webseite". Deshalb sollte es alle Unterseiten mit einschließen.....

 

[une_art]

AW: Mit Contao eigenes Design anpassen. Probleme!

Mhh, da kann der Fehler also auch nicht sein. Hast du mal versucht, in das Stylesheet ein paar CSS-Angaben zu schreiben und zu gucken, ob diese angenommen werden?

 

[onpoint]

AW: Mit Contao eigenes Design anpassen. Probleme!

Ja, habe ich.

undzwar hab ich versucht mit folgenden angaben:

.body {
background-color:#ccc;
}

einen roten Hintergrund zu zaubern. Jedoch tat sich leider nichts.

Wo müssten auf dem Server die css dateien denn liegen?

-Edit-

Achwas, er tut was! Nun hört er auf einmal auf css befehle! jedoch zeigt er mir komicherweise trotzdem keine verknüpfung an

 

[une_art]

AW: Mit Contao eigenes Design anpassen. Probleme!

Da wird nicht viel passieren. ".body" ist eine Klasse. Du musst den body-Tag mit "body" ansprechen. Außerdem ist #ccc ist grau

Okay also funktioniert es. Ich tippe auf folgendes: In früheren Contao-Versionen gab es die Funktion "Stylesheets zusammenfassen". Damit hat Cotnao dann aus allen Stylesheets einfach eine Datei gemacht, die dann einen Namen, wie "ch23478243.css" hatte. Der Zweck ist, durch das Laden von nur einer CSS-Datei weniger Serveranfragen zu haben.
Anscheinend ist diese Funktion in der neuen Contao-Version nun nicht mehr optional, sondern standardmäßig aktiviert.
Darum stehen deine CSS-Angaben aus dem Backend in der Datei 83a0bcdf774c.css.

 

[onpoint]

AW: Mit Contao eigenes Design anpassen. Probleme!

haha, sorry, vertan!

der punkt war ein tippfehler im forum, den hab ich natürlich nicht eingetragen

Soo, wies aussieht kann ich jetzt endlich visuell was machen.

Nur ne Frage. Wie ist der restliche Ablauf?

Im Zusammenbauen via Html und Css von gesliceten Seiten habe ich etwas Erfahrung, nur wie ist die prozedur im cms System?

Baue ich mir mit einzelnen Bildern, die ich aus meinem Design slice, das Ding herkömmlich zusammen? Oder muss ich da auf andere methoden ausweichen?

 

[une_art]

AW: Mit Contao eigenes Design anpassen. Probleme!

Also im Prinzip kannst du CSS-Elemente genauso stylen, wie sonst auch, mit background-image etc.
Contao generiert die HTML-Seiten aus den Templates, packt dann dort noch die Module rein und klatscht das Theme mit Seitenlayout und CSS drüber.
Wenn du also Elemente hast, die auf mehreren Seiten vorkommen (z.B. die Navigation), dann würde ich das über Module machen. Diese kannst du dann im Seitenlayout einbinden und auswählen an welcher Stelle die sein sollen.
Stylen kannst du die Module über die CSS-Stylesheets. Beim Erstellen eines Moduls kannst du dann auch noch CSS-Klassen vergeben etc.