CSS Frage - Einbindung von Stylesheets

Hier können Probleme und alles andere in Deutscher Sprache gelöst werden.
Post Reply
deacon
Regular
Posts: 75
Joined: Wed Sep 26, 2007 11:31 pm
Location: bei Hamburg
Contact:

CSS Frage - Einbindung von Stylesheets

Post by deacon »

Moin Moin,

ich bin mal grade wieder am basteln. Habe meinen Blog heute komplett neu aufgesetzt und ich nutze das Yaml Framework dazu. Ich bin nun grade am anpassen der CSS Styles.

Die Yaml CSS Dateien habe ich nun im head Bereich so eingebunden und es funktioniert auch:

Code: Select all

<link rel="stylesheet" type="text/css" href="{serendipity_getFile file="css/layout_2col_right_31.css"}" />
Hier erstmal der Link zur Seite: www.just-css.de

Nun habe ich ein paar Fragen:

1. Was bewirkt dieser Link?

Code: Select all

<link rel="stylesheet" type="text/css" href="{$head_link_stylesheet}" />
Holt er sich CSS Anweisungen aus der default style.css aus dem default Ordner?

2. Ich möchte eine eigene style.css erstellen. Binde ich die denn genauso auf die Art ein, so wie ich die Yaml CSS Dateien eingebunden habe? Also über get file?

3. Kann ich eigentlich aus anderen Template Ordner die entries.tpl oder überhaupt verschiedene tpl Dateien raussuchen und verwenden oder gibt das nur Murks? Wenn ja, würdet ihr mir unter die Arme greifen um diese anzupassen?

Greetz
Deacon
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Re: CSS Frage - Einbindung von Stylesheets

Post by yellowled »

deacon wrote:1. Was bewirkt dieser Link?

Code: Select all

<link rel="stylesheet" type="text/css" href="{$head_link_stylesheet}" />
Holt er sich CSS Anweisungen aus der default style.css aus dem default Ordner?
Auch, ja. {$head_link_stylesheet} ist - soweit ich das durchblicke, man (also: Garvin :)) möge mich ggf. korrigieren - die von s9y generierte Datei serendipity.css, welche quasi eine Verbindung aus der style.css und ggf. den CSS-Dateien irgendwelcher Plugins ist.
deacon wrote:2. Ich möchte eine eigene style.css erstellen. Binde ich die denn genauso auf die Art ein, so wie ich die Yaml CSS Dateien eingebunden habe? Also über get file?
Wenn die Datei im Templateordner liegt und style.css heißt, wird sie bereits über obige <link>-Anweisung eingebunden. serendipity_getFile benutzt man z.B. für zusätzliche Stylesheets, etwa, wenn man wie wir in Bulletproof die CSS-Anweisungen der Übersichtlichkeit halber in mehrere CSS-Dateien aufteilen möchte. YAML macht das ja ähnlich, nur eben über @import-Anweisungen.

Es kann übrigens sein, dass genau dieses Einbinden der CSS-"Module" in YAML über @import in s9y Zicken macht - es ist schon ein Weilchen her, dass ich mich zuletzt mit YAML befasst habe, aber ich hatte damit mal Schwierigkeiten. (Übrigens findest Du auf http://yellowled.de/templates.html einen schwer veralteten YAML-Port, den ich mal erstellt habe, vielleicht hilft das zum Einstieg.
deacon wrote:3. Kann ich eigentlich aus anderen Template Ordner die entries.tpl oder überhaupt verschiedene tpl Dateien raussuchen und verwenden oder gibt das nur Murks? Wenn ja, würdet ihr mir unter die Arme greifen um diese anzupassen?
Natürlich kannst Du das - ob es Murks gibt, bleibt abzuwarten :wink:

Generell ist es emfehlenswert, dazu die Dateien (soweit dort vorhanden) aus /templates/default zu nehmen und diese den eigenen Wünschen entsprechend zu modifzieren. Im Übrigen kannst Du auch bei den Plugins, welche bereits Template-Dateien mitbringen (z.B. Static Pages), diese in den Ordner Deines Templates kopieren und sie modifizieren - das Plugin verwendet dann automagisch die .tpl-Datei des Templates, nicht mehr die standardmäßige, mit dem Plugin ausgelieferte.

Und immer fragen, bloß keine Scheu :)

YL
deacon
Regular
Posts: 75
Joined: Wed Sep 26, 2007 11:31 pm
Location: bei Hamburg
Contact:

Post by deacon »

Hi Yellowled,

also zur style.css. Ich habe mal lokal eine leere Datei erstellt und es geht. Es wird nichts mehr überschrieben von der default style.css.

Zu dem Yaml @import. Ich probiere es erstmal so. Bis jetzt klappt es gut.

Leider habe ich von smarty echt keinen Plan. Somit stehe ich ohne Hilfe bei den tpl Files zum ändern auf dem Schlauch. Aber mal schauen wie weit ich komme :-) Ansonsten komme ich gerne auf eure Hilfe zurück.

Aber danke erstmal für die schnelle Antwort.

Greetz
Deacon
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Post by yellowled »

deacon wrote:Ich habe mal lokal eine leere Datei erstellt und es geht. Es wird nichts mehr überschrieben von der default style.css.
Natürlich nicht :) In dem Moment, wo in /templates/<DEINTEMPLATE> eine der Dateien aus /templates/default existiert, verwendet s9y diese und nicht mehr die aus /templates/default, selbst wenn die Datei leer ist.
deacon wrote:Leider habe ich von smarty echt keinen Plan. Somit stehe ich ohne Hilfe bei den tpl Files zum ändern auf dem Schlauch.
Es gibt einiges an Dokumentation dazu auf http://www.s9y.org, zudem auf http://smarty.php.net. Aber im wesentlichen geht es ohnehin immer nur darum, die existierenden Template-Dateien mehr oder weniger leicht zu modifizieren. Haarig wird Smarty eigentlich erst bei komplexeren Templates wie Hemingway oder Mimbo :)

YL
deacon
Regular
Posts: 75
Joined: Wed Sep 26, 2007 11:31 pm
Location: bei Hamburg
Contact:

Post by deacon »

Natürlich nicht Smile In dem Moment, wo in /templates/<DEINTEMPLATE> eine der Dateien aus /templates/default existiert, verwendet s9y diese und nicht mehr die aus /templates/default, selbst wenn die Datei leer ist.
Da bin ich nach einigen Bierchen nun auch langsam hintergekommen :roll:
Es gibt einiges an Dokumentation dazu auf http://www.s9y.org, zudem auf http://smarty.php.net. Aber im wesentlichen geht es ohnehin immer nur darum, die existierenden Template-Dateien mehr oder weniger leicht zu modifizieren. Haarig wird Smarty eigentlich erst bei komplexeren Templates wie Hemingway oder Mimbo Smile
So, nun wirds ein wenig länger :lol:

Ja klar gibt es zig Dokus darüber. Aber was nutzen mir die wenn ich es einfach nicht begreife? Da muss ich wirklich sagen, dass es eine Art logisches Denken ist, die mir wirklich fehlt. Ich will ja nun nicht sagen das ich zu doof dazu bin.
Schau mal, ich bin CNC-Dreher (comuptergesteuerte Zerspanung). Da kann ich Dir die kompliziertesten Programme schreiben. Die lese ich wie Bücher. Ich habe mir XHTML, CSS und ein bischen Photoshop durch lesen, lesen und nochmals lesen und vor allen Dingen üben beigebracht. Ich will nun nicht sagen das ich da top bin, aber ich komm gut alleine voran. Aber was richtige Programmiersprachen oder wie man es auch nennen mag; wie PHP, Smarty, Ruby etc.., tut mir leid. Ich kann mich da einfach nicht reinfuchsen.
Es fängt doch schon an, wenn man z.B. bei PHP mal irgendwo ein Zeichen vergisst zu setzen wie z.B. = } oder sonstiges. Da hagelt es gleich Fehlermeldungen ohne Ende. Wenn ich beispielsweise mal im HTML ein <b> anstatt ein < /b> verkehrt setze, das verzeiht der Browser. Ok, der Validator nicht. Aber die Seite wird trotzdem korrekt dargestellt.

Mit dem Yaml Framework habe ich jetzt meine zweite Arbeit gemacht. Die erste war für unseren Clan im Zusammenspiel mit Clansphere. Das hat mich einiges an Stunden gekostet um mich darein zufuchsen. Ok, die meiste Arbeit was grafische. Aber kein Thema.

Nun habe ich mir gestern das Blog nochmal neu aufgesetzt, weil da auch was zerschossen war. So, denke ich mir, probier das mal mit Yaml. Ging astrein. Index.tpl erstellt, die paar Platzhalter rein und der Drops war gelutscht. Denn habe ich mir von WP Connections ein paar Templates genommen und die nach meinen Gusto mit CSS gestylt. Bin ich soweit zufrieden. Ist zwar noch nicht ganz fertig, weil ich jetzt erst den grafischen Teil mache. Aber ich komme damit ohne Probleme zum Ende.

Denn habe ich mir mal die Templates unf CSS Files vom Bulltetproof mal angeschaut. Das waren alles Böhmische Dörfer für mich. Smarty bis das Auge reicht :D
Ich mein, ihr habt damit ein sehr geiles und vor allen Dingen ein sehr flexibles Framework geschaffen. Hut ab.

Was ich jetzt damit sagen möchte; wenn ich jetzt z.B mal in "meiner" index.tpl mal irgendwo noch ein Div ergänzen möchte oder dergleichen, denn habe ich für mein Empfinden eine wesentlich bessere Übersicht, weil nicht alles mit Smarty vollgepflastert ist. Da weiss ich, ahhhh da fängt die Spalte an, da hört der und der Content auf. Beim Bulletproof weiss ich das z.B nicht. Ich blicke durch die Anordnung der Divs überhaupt nicht durch.

Aber vielleicht werde ich mir auch nochmal einen Style mit dem Bulletproof erstellen. Das Ding ist schon genial.

So, nun ist aber auch genug geschrieben. Ich werde mich jetzt mal an meine Grafiken ransetzen und mich von Paddings und Margins quälen lassen. In diesem Sinne...einen schönen Sonntag noch.

Greetz
Deacon
deacon
Regular
Posts: 75
Joined: Wed Sep 26, 2007 11:31 pm
Location: bei Hamburg
Contact:

Post by deacon »

Ach Yellow, ich seh grad das Du auch ein Nordlicht bist. Gruss aus Wedel bei Hamburg :lol:
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Post by yellowled »

deacon wrote:Ja klar gibt es zig Dokus darüber. Aber was nutzen mir die wenn ich es einfach nicht begreife? Da muss ich wirklich sagen, dass es eine Art logisches Denken ist, die mir wirklich fehlt.
So herum kann es ja auch gar nicht funktionieren - wenn ich ein Werkstück drehen will und Du mir sagst "Da liegt das Handbuch für die Maschine", na Mahlzeit. Schon richtig :)
deacon wrote:Ich habe mir XHTML, CSS und ein bischen Photoshop durch lesen, lesen und nochmals lesen und vor allen Dingen üben beigebracht.
Ich fürchte, bei Smarty geht es nicht viel anders. Ich bin ja auch nicht eines schönen Tages aufgewacht und habe mal eben Mimbo runtergehackt :wink: Davor hatte der Herr (nicht der Herr Hicking, der andere Herr) Stunden, Tage, Wochen von Studium gesetzt: Studium anderer Templates, Studium von Codeschnipseln hier im Forum, Studium der kompetenten Antworten zu meinen dämlichen Fragen ebenfalls hier im Forum und ja, auch Studium der Doku.

Ich kann ebenfalls kein PHP - ein ganz klein wenig höchstens. Ich vergleiche es immer so: Ich spreche etwa so gut PHP wie ein 1jähriger Deutsch spricht. Baby-PHP also. Und jedesmal wieder, wenn ich mir vornehme, es doch mal zu lernen, lege ich das Buch frustriert weg, weil ich denke, mir fehlt eine Hirnwindung dazu.

Das schöne an Smarty ist aber: Es ist eigentlich gar keine Programmiersprache, es tut nur so. Und die meisten Smarty-Anweisungen kann man mit ein wenig Übung kinderleicht in Klartext übersetzen.

Beispiel:

Code: Select all

{if $template_option.counter_code_toggle == 'true'}
                <div class="counter_code">{$template_option.counter_code}</div>
            {/if}
Das heißt »Wenn die Templateoption 'counter' wahr ist, füge an dieser Stelle den folgenden Code ein.«. Fertig ist der Lack. (Zugegeben, ein recht simples Beispiel.)
deacon wrote:Es fängt doch schon an, wenn man z.B. bei PHP mal irgendwo ein Zeichen vergisst zu setzen wie z.B. = } oder sonstiges. Da hagelt es gleich Fehlermeldungen ohne Ende.
Dafür verwendet man einen geeigneten Texteditor, der idealerweise Syntaxhighlighting für Smarty und evtl. noch Codeprüfung kann - GNU Emacs mit zusätzlichem Smarty-Mode beispielsweise. (Ja, den gibt es auch für Windows.) Zudem ist PHP ja relativ gesprächig, was und wo im Code flashc ist.
deacon wrote:Wenn ich beispielsweise mal im HTML ein <b> anstatt ein < /b> verkehrt setze, das verzeiht der Browser. Ok, der Validator nicht. Aber die Seite wird trotzdem korrekt dargestellt.
Das, entschuldige bitte, ist ein blödes Beispiel. Vergesse ich ein schließendes </div>, reißt mir das ggf. komplette Layouts auseinander, und die Suche nach dem Fehler ist genauso umständlich wie bei Smarty.
deacon wrote:Denn habe ich mir mal die Templates unf CSS Files vom Bulltetproof mal angeschaut. Das waren alles Böhmische Dörfer für mich. Smarty bis das Auge reicht :D
Nö. Eigentlich hält sich BP da noch zurück ... :wink: Ganz ernsthaft gibt es mittlerweile erheblich komplizierteren Smarty-Code in Templates als dort.
deacon wrote:wenn ich jetzt z.B mal in "meiner" index.tpl mal irgendwo noch ein Div ergänzen möchte oder dergleichen, denn habe ich für mein Empfinden eine wesentlich bessere Übersicht, weil nicht alles mit Smarty vollgepflastert ist.
Deine index.tpl soll auch nur in Deinem Blog laufen, vermutlich nur ein Layout ausgeben - die von Bulletproof generiert neun mehr oder minder verschiedene Layouts, die noch dazu bis in die Haarspitzen konfiguriert werden können sollen. Vergleiche die index.tpl mal mit der aus /default - die ist gar nicht so wild.
deacon wrote:Ich werde mich jetzt mal an meine Grafiken ransetzen und mich von Paddings und Margins quälen lassen.
Immer schön an den double floated margin Bug im IE denken! :-P

YL
deacon
Regular
Posts: 75
Joined: Wed Sep 26, 2007 11:31 pm
Location: bei Hamburg
Contact:

Post by deacon »

So herum kann es ja auch gar nicht funktionieren - wenn ich ein Werkstück drehen will und Du mir sagst "Da liegt das Handbuch für die Maschine", na Mahlzeit. Schon richtig Smile
Ne denn hast du vielleicht nicht richtig verstanden wie ich das meine. Hmmm, weiss nicht genau wie ich dir das verklickern soll. Aber ich versuch es mal. Nehmen wir mal wieder das Beispiel CNC-Drehen.

Gelernt habe ich Maschinenbau. Da hat man mal so ein bischen in der Lehre gedreht. Aber es hat mich so gesehen schon immer interessiert. Denn kam bei uns die erste CNC Bank. Und es wurde gefragt wer das machen will. Ich mich denn auch gleich gemeldet. Ich hatte es nur mal bischen in der Berufsschule gelernt. Also CNC Programmierung. Ich mir die Programmier Software samt Dongle geschnappt und zu Hause programmieren geübt. Ich muss dazu sagen dass es auch wirklich nicht schwer ist. Kompliziert wird es erst wenn komplizierte Formen zu drehen sind. Aber das ist reine Geometrie und ein wenig Mathe. Wenn ich das nicht könnte, na denn habe ich meinen Beruf verfehlt.

Kommen wir nun mal zu PHP und anderen Kappes :)
Wie ich schon geschrieben habe, gibt es ja wirklich zig gute bis sehr gute Tutorials. Und so ein "Hello World" Programm sollte man ja eigentlich auch schon verstehen. Aber denn hört es auch schon bald auf. Es fängt an bei der ganzen Zeichensetzung, das Zusammenspiel mit MYSQL, was ja schon ein Kapitel für sich ist. Denn die Sicherheitsaspekte und und und. Und wie ich oben schon schrieb, das ist der Logik zu folgen wie solch ein Programm aufgebaut sein muss/sollte. Ich mein nicht das ich nicht logisch denken kann. Es ist doch richtig wenn ich sage: Ich stelle eine Bedingung an das Programm ---> kann ich das erfüllen? Ja, denn weiter im Programm und führe diese Bedingung aus. Fehlt was zum Ausführen der Bedingung, denn frage diese Bedingung neu ab bis sie erfüllt ist. Kommt das nicht breche das Programm ab.
Also so gesehen ist das eine Schleife. Richtig? Aber das alleine ist ja nicht alles. Die ganzen Bezeichnungen, die ganzen Variablen. Ich raff das echt nicht wie das alles zusammenhängt. Aber ist klar, wie du auch schon gesagt hast, dass es eine Arbeit ist von Monaten bis Jahren bis man sowas kann. denn kommt bei mir noch dazu, dass ich immo überhaupt nicht die Zeit dazu habe mir das alles anzueignen. Leider
Das, entschuldige bitte, ist ein blödes Beispiel. Vergesse ich ein schließendes </div>, reißt mir das ggf. komplette Layouts auseinander, und die Suche nach dem Fehler ist genauso umständlich wie bei Smarty.
Gut war vielleicht bischen doof das Beispiel. Ich hatte das Beispiel nur genommen <b> anstatt ein < /b>, weil der Brwoser das denn trotzdem noch richtig interpretiert. Wenn ich das den Slash bei einem Div vergessen, brauchen wir nicht weiter drüben reden was denn passiert. :)
Immer schön an den double floated margin Bug im IE denken! Razz
Naja, im Normalfall sollten alle IE Hacks vorhanden sein. Mir ist bis dato noch nix aufgefallen. Bin aber auch noch nicht 100% fertig mit dem Design. Schrift und Links will ich noch anders formatieren (Farben und Größen). Und denn muss ich die ganzen Kommentar Sachen per CSS stylen. Aber ich komme vorran. Am WE sollte es so gut wie fertig sein.

Ist es möglich, denn wenn ich damit fertg bin, mir mal einer beim Funktionen überprüfen helfen kann, was so Pingbacks angeht und was man noch so alles prüfen kann, behilflich sein kann? Wäre ne feine Sache.

Greetz
Deacon
Image
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Post by yellowled »

deacon wrote:Ist es möglich, denn wenn ich damit fertg bin, mir mal einer beim Funktionen überprüfen helfen kann, was so Pingbacks angeht und was man noch so alles prüfen kann, behilflich sein kann?
Klar. Pack das fertige Template in ein Zip-Archiv, stell es irgendwo[tm] online. Für die meisten Dinge muss man einfach in den Code gucken - und den komplett hier zu posten ist nicht das Wahre :)

YL
hagenroewer
Regular
Posts: 181
Joined: Mon Aug 14, 2006 12:41 am
Contact:

Re: CSS Frage - Einbindung von Stylesheets

Post by hagenroewer »

Moin YL,
yellowled wrote: Es kann übrigens sein, dass genau dieses Einbinden der CSS-"Module" in YAML über @import in s9y Zicken macht - es ist schon ein Weilchen her, dass ich mich zuletzt mit YAML befasst habe, aber ich hatte damit mal Schwierigkeiten. (Übrigens findest Du auf http://yellowled.de/templates.html einen schwer veralteten YAML-Port, den ich mal erstellt habe, vielleicht hilft das zum Einstieg.
Hast Du Deinen YAML-Port wieder von deiner Website wieder entfernt?
Ich habe den bei Dir nicht mehr wieder gefunden.

Gruß aus Essen,

Hagen
Gruß von der Ruhr
Hagen Röwer Dienstlich | XING | LinkedIn
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Re: CSS Frage - Einbindung von Stylesheets

Post by yellowled »

hagenroewer wrote:Hast Du Deinen YAML-Port wieder von deiner Website wieder entfernt?
Äh, stimmt, sorry. Ich hatte ihn bei der Neustrukturierung weggelassen, weil er schlich hoffnungslos veraltet war. Das hatte ich selbst zwischenzeitlich schon wieder verdrängt :roll:

YL
deacon
Regular
Posts: 75
Joined: Wed Sep 26, 2007 11:31 pm
Location: bei Hamburg
Contact:

Post by deacon »

Wenn du Bock hast kann ich den stellen. Ist mit dem neusten YAML und neusten Serendipity. Wollte eh noch ein Tutorial dazu schreiben.
Image
hagenroewer
Regular
Posts: 181
Joined: Mon Aug 14, 2006 12:41 am
Contact:

Post by hagenroewer »

Moin Deacon,

etwas verspätet:
deacon wrote:Wenn du Bock hast kann ich den stellen. Ist mit dem neusten YAML und neusten Serendipity. Wollte eh noch ein Tutorial dazu schreiben.
Mich würde gerne das Template mit der neuesten YAML-Version interessieren.
Gruß von der Ruhr
Hagen Röwer Dienstlich | XING | LinkedIn
Post Reply