Hallo,
ich möchte TL als CMS verwenden und versuche mich an meinem ersten TL Projekt.
Hier ist der Link zu dem Prototypen, den ich nun gerne in TL umsetzen möchte:
http://www.roock-design.de/webdesign/parkway/index.html
Was ich gemacht habe:
1. auf Grundlage meines HTML ein Template erstellt:
http://www.roock-design.de/webdesign...arkway_new.tpl
2. meines CSS importiert, sie liegen tl_files Verzeichnis
http://www.roock-design.de/webdesign...t_n_colors.css
http://www.roock-design.de/webdesign...nues_class.css
http://www.roock-design.de/webdesign...readcrumbs.css
http://www.roock-design.de/webdesign...col_liquid.css
3. die images in das tl_files Verzeichnis kopiert und in den importierten CSS den Pfad geändert.
4. Module angelegt und die Klassen bzw. ID meiner CSS Definitionen vergeben z.Bs. "multi_drop_menues" für die Hauptnavigation
Breadcrumbs
Footer
Hauptnavigation
Header
Subnavigation
5. Seitenlayout angelegt und die Stylesheets ausgewählt
Ich habe das zweispaltige Layout gewählt.
Header -> main
Hauptnavigation -->
Breadcrumbs --> main
Artikel --> main
Subnavigation --> right
Footer --> footer
6. Seitenstruktur (zwei Seiten)
7. Artikel für die Startseite
Das Ergebnis sieht jetzt so aus und ist noch nicht ganz was ich erwarte:
Leider nur ein Bild, weil ich noch lokal arbeite
Das Auffälligste ist, dass die Subnavigation nicht rechts steht.
Ich benötige mal prinzipielle Hilfe, wie ich da vorgehen soll. Ich habe ja bereits ein fertiges Spaltenlayout diese CSS Datei benötige ich ja nun wahrscheinlich nicht mehr, wenn ich das TL 2-Spaltige Layout nehme.
Wie sieht es mit den anderen CSS aus. Kann ich die einfach dem jeweiligen Modul zuweisen? was gibt es zu beachten?
Die Hauptnavigation hat zwar meine Styles, aber es steht auch "skip link" drin, was über den Navigationsitems einen grauen hoverbaren Streifen verursacht. Wie gehe ich da vor?
Dann verwende ich in meinem ürsprünglichen CSS Definitionen wie diese:
#content p {} diese werden von TL nicht angezogen, weil es ja kein #content gibt. Aber auch auf #main lies es sich nicht anwenden.
Darum die Definitionen in das übergeifende p {} geschrieben, mit dem Effekt, dass es auch im Footer angezogen wird und die Footer Definition #footer p {} wird nicht angezogen ...
Was gibt es hier zu beachten?
Ich hoffe, dass war jetzt einigermaßen verständlich erklärt was ich machen möchte.
Ich freue mich sehr über einen Hinweis.
Ich arbeite gerne mit meinen eigenen CSS, da ich es erstens schon ausgetüftelt habe und zweitens es bei bestehenden Websites schon läuft.
Eventuell ist aber dieser Ansatz verkehrt und ich sollte eher die TL Styles anpassen...
Für einen Tip zur prinzipiellen Vorgehensweise wäre ich sehr dankbar.
Ich habe auch das Typolight Handbuch, aber nichts gefunden. Eventuell habe ich es aber auch überlesen, weil ich nicht wusste wie ich die Informationen einordnen soll...
Vielen Dank
Kristina
Lesezeichen