Design nur durch CSS anpassen

Dr. Evil

Hallo,

mein Ziel ist es, das Design einer bereits existierenden Seite in Zope/Plone nachzubilden. In dem Buch "Plone" von Andy McKay habe ich gelesen, dass man sich mit Page Templates (TAL/METAL) auskennen muss, um eine eigene Skin zu erstellen. Reichen CSS-Sheets nicht aus, um einer Plone-Seite ein eigenes Aussehen zu geben? Falls man aber dafür mit CSS alleine auskommt, wie funktioniert das? Im ZMI kann man ja unter /Plone/portal_skins/ einiges finden. Aber wo finde ich die CSS-Dateien, die für das Aussehen der Seite sorgen (also gesamte Seite, Navigationsportlets, usw.) und wie lauten die Namen der CSS-Klassen für die einzelnen HTML-Elemente (z.B. für den <body>-Tag)? Tut mir Leid, dass es so viele Fragen auf einmal sind, aber Plone ist für mich immer noch ein Buch mit sieben Siegeln!

Falls das einem hilft.. Hier ist die Seite, die ich nachbilden möchte: http://www.lfe.mw.tum.de/

Es wäre sehr sehr nett, wenn mir da jemand weiterhelfen könnte!

Schöner Gruß,
Dr. Evil (ist nur ein Name )

Torty

Klar kannst du Plone per CSS anpassen.
Dazu gehst du unter portal_skins/plone_styles und suchst die die entsprechenden Styles raus. Ok - ist sicher etwas mühselig, aber möglich.
TIP: Um die passenden Styles zu finden würde ich unter portal_css ganz oben den Debug-Hacken setzen. Damit wird jedes Stylesheet einzeln geladen und lässt sich mit der WebDevBar für FF besser suchen und finden.

Jedes Layout ann man damit natürlich nicht umsetzen. Wie sonst auch gibte es bestimmte Abhängigkeiten und Bedingungen um das eine oder andere Layout zu realisieren. Ich nenne hier nur mal zusätzliche Container die man einsetzen muss um gefloatete Bereiche eingrenzen zu können.
Und wenn die DIV, SPAN und P im Plone-Standard-Skin nicht ausreichen, muss man halt eigene Templates schreiben bzw. die bestehenden anpassen. An diesem Punkt kommt man dann mit TAL in Berührung.
TIP: Lernt TAL, denn es ist nicht schwer und man erhält dadurch wieder mehr Freiheiten.

Torty

Dr. Evil

Danke für deine Hilfe, Torty! Hab ein bisschen damit herumprobiert und glaube jetzt, dass CSS alleine nicht mehr für die Lösung meines Problems ausreicht. Die Seite die ich nachbauen will, besteht nämlich aus Frames. Und zwar in einer ziemlich typischen Zusammensetzung: ein Titelframe über die ganze Bildschirmbreite und ein darunter liegender Frame, welcher wiederum in ein Navigations- und ein Inhaltsframe unterteilt ist. Titel- und Navigationsrahmen sollen wie auf der "Vorbildseite" blau (vielleicht sogar mit den Rundungen) werden. Im Navigationsrahmen soll auch noch eine Grafik (auf der Originalseite die zeigende Figur) platziert werden, die sich dem angeklickten Link anpasst ("Figur zeigt auf den Link"). Liege ich da mit meiner Vermutung richtig, dass da ein neues, eigenes Template (= "Frameset-Imitat") geschrieben werden muss? Wäre ja dann das "Haupt_Template", das beim Aufrufen der Seite geladen wird. Wo müsste man das anlegen und wie müsste man es dann nennen?

Gruß,
Dr. Evil

Torty

1.) Da du den Skin/Template nun sowieso neu erstellst und dein altes nur als Vorlage nimmst, so schmeiße auch gleich die Frames über board. Gerade in Bezug auf Barrierefreiheit sind Frames Müll + Gift.

2.) Ja - es kann durchaus sein, dass du mehr als 1 Template/Macro an deine Bedürfnisse anpassen musst. Befasse dich hier mal mit dem Thema: "Erstellung eines Skin im Filesystem". (also nicht in /custom)

Die Templates sind dabei (rein vom Namen her) die selben die auch Plone verwendet. Also als Haupttemplate käme das main_template.pt zum Einsatz und für den Header ist dann das header.pt zuständig usw.

Lies dich erstmal ein und dann diskutieren wir weiter ...

Torty

Dr. Evil

Du meinst also, dass ich die entsprechenden Templates nicht customizieren soll, sondern direkt in den "Verzeichnissen", wo sie normalerweise liegen verändern? Ist das nicht gefährlich, z.B. wenn man die Ausgangssituation wiederherstellen möchte?
Einlesen tue ich mich ja schon. Hab schon einiges über TAL und METAL und das Anlegen von Templates gelesen und Code-Schnipsel erfolgreich ausprobiert, aber ich habe noch keinen Überblick darüber, wo welches Objekt liegt und wie man anfängt!

Torty

Hehe - ja so gings uns (fast) allen.

Und ich meine *nicht* dass du die Orignalfiles ändern sollst. Aber das wird dir mit der Lektüre zu den Skins schon klar.

Ich kann mal einen very simple Skin hier als ZIP posten, dann habt ihr eine Grundlage für eigene Skins. Das braucht jedoch etwas Zeit und ich schau mal ob ich die in den nächsten Tagen finde.

Stay tuned.

Torty

Dr. Evil

Das wäre ja echt super!!! Werd bis dahin mal weiter im Buch lesen. Schwierig ist der Umstieg auf Plone, wenn man davor nur PHP gewöhnt ist. Aber das wird schon mit der Zeit!

Danke an Torty schon mal im voraus!

Torty

Oh man - das hat echt länger gedauert als erwartet...

Ok anbei also das SimpleSkin-ZIP.
Ihr müsste es in euer Products-Verzeichnis entpacken und den Zope-Server neu starten. Danach legt am besten eine neue leere Plonesite an.
Dann findet ihr unter portal_quickinstaller das Produkt SimpleSkin. Installiert das und geht auf die Startseite der neuen Plonesite. Die Schrift müsste nun deutlich größer als normal sein. Das nur als Hinweis.

Wechselt hier nun ins ZMI - setzt dafür an die URL oben ans Ende /manage.
Legt nun ein neues PageTemplate an und vergebt dafür die ID index_html und klickt auf Edit. Ladet den Inhalt der Datei frontpage.pt aus dem SimpleSkin-Verz. /ZMI hoch und klickt auf speichern.

Geht nun wieder zurück auf die normale Plonesite und ihr seht dass nun die neue index_html ausgegeben wird.

Ich hab nun ehrlich gesagt keine Lust alle Details hier reinzutippern und überlasse es euch den SimpleSkin zu erforschen. Wenn ihr Fragen habt dann postet sie natürlich wieder hier oder besser macht einen SimpleSkin-Thread auf.

Ok - ich bin raus

PS: Lasst den Zope-Server im Debug-Mode laufen!!!

Torty

Torty

Ja ja - war'n langer Tag ... hab glatt das ZIP vergessen...

Torty

Kleiner Nachtrag:
Der von mir gezeigte Weg ist so zu sagen der tradionelle Welche. Seit Plone 2.5 gibts es zudem die Möglichkeit des GenericSetup. Und damit gibt es eine neue Variante für einen Skin.
Wie das geht? Schaut mal bei V. Schiele's PloneProductFramework vorbei:
http://www.veit-schiele.de/produkte/plone-product-framework

Torty

Dr. Evil

Leider hat die Installation bei mir nicht hingehauen :(. Neben dem Produkt ist im ZMI ein Ausrufezeichen aufgetaucht, Fehler ist anscheinend:

Zitat

AssertionError: the external method called "extern_random" was not found.

Was bedeutet das?

Torty

Hmmm...also extern_random liegt in SimpleSkin/Extension und stellt eine externe Methode dar.
Kopiere diese 2 extern_* Dateien mal in den Ordner Extensions deiner Zope-Instanz. Und versuche es dann erneut.

Torty

Torty

Ein Problemchen kann es auch noch geben.
Nach dem Install existiert unter portal_skins/Properties ein weiter Skin mit Namen Simpleskin und dieser ist auch als Default-Skin ausgewählt. Hier kann es nun sein, dass in dem Layerfeld keine Einträge ala SimpleSkin_ecmascripts usw. existieren.
In diesem Fall schaut in dem Layerfeld darüber und kopiert die 3-4 SimpleSkin_-Einträge in das SimpleSkin-Layerfeld.

Bei Gelegenheit muss ich mir dieses Problem mal vornehmen.

Torty

Dr. Evil

Hab alles so vorgefunden, wie du es beschrieben hast. Leider kommt beim Aufrufen der Plone-Seite jetzt eine Fehlermeldung. Kann aber nicht sagen, warum.. Da steht eine lange Liste mit irgendwelchen Meldungen/Pfadangaben und darunter folgendes:

Zitat

Troubleshooting Suggestions

The URL may be incorrect.
The parameters passed to this resource may be incorrect.
A resource that this resource relies on may be encountering an error.

Woran kann das liegen?

Torty

Gehe bitte im ZMI auf error_log und gib mir mal den TraceBack des Fehlers.

Torty

Dr. Evil

Trotz Fehlers steht im ZMI unter error_log nur "No exceptions logged.". Könnte ich das Fehlerprotokoll sonst noch wo finden?

Torty

Zitat von Dr. Evil

Hab alles so vorgefunden, wie du es beschrieben hast. Leider kommt beim Aufrufen der Plone-Seite jetzt eine Fehlermeldung. Kann aber nicht sagen, warum.. Da steht eine lange Liste mit irgendwelchen Meldungen/Pfadangaben und darunter folgendes:

Woran kann das liegen?

Ok, dann gib nochmal den Screen von dem Fehler der dir ausgegeben wird.
Das muss doch zu ergründen sein, was da nicht passt.

Torty

Dr. Evil

Der Bildschirm gibt mir dann das hier aus:

Zitat

Site Error
An error was encountered while publishing this resource.

TypeError

Sorry, a site error occurred.

Traceback (innermost last):

Module ZPublisher.Publish, line 196, in publish_module_standard
Module Products.PlacelessTranslationService.PatchStringIO, line 34, in new_publish
Module ZPublisher.Publish, line 146, in publish
Module Zope2.App.startup, line 222, in zpublisher_exception_hook
Module ZPublisher.Publish, line 115, in publish
Module ZPublisher.mapply, line 88, in mapply
Module ZPublisher.Publish, line 41, in call_object
Module Shared.DC.Scripts.Bindings, line 311, in __call__
Module Shared.DC.Scripts.Bindings, line 348, in _bindAndExec
Module Products.CMFCore.FSPageTemplate, line 195, in _exec
Module Products.CMFCore.FSPageTemplate, line 134, in pt_render
Module Products.PageTemplates.PageTemplate, line 104, in pt_render
<FSPageTemplate at /Plone/document_view used for /Plone/front-page>
Module TAL.TALInterpreter, line 238, in __call__
Module TAL.TALInterpreter, line 281, in interpret
Module TAL.TALInterpreter, line 749, in do_useMacro
Module TAL.TALInterpreter, line 281, in interpret
Module TAL.TALInterpreter, line 457, in do_optTag_tal
Module TAL.TALInterpreter, line 442, in do_optTag
Module TAL.TALInterpreter, line 437, in no_tag
Module TAL.TALInterpreter, line 281, in interpret
Module TAL.TALInterpreter, line 749, in do_useMacro
Module TAL.TALInterpreter, line 281, in interpret
Module TAL.TALInterpreter, line 715, in do_condition
Module TAL.TALInterpreter, line 281, in interpret
Module TAL.TALInterpreter, line 457, in do_optTag_tal
Module TAL.TALInterpreter, line 442, in do_optTag
Module TAL.TALInterpreter, line 437, in no_tag
Module TAL.TALInterpreter, line 281, in interpret
Module TAL.TALInterpreter, line 715, in do_condition
Module TAL.TALInterpreter, line 281, in interpret
Module TAL.TALInterpreter, line 457, in do_optTag_tal
Module TAL.TALInterpreter, line 442, in do_optTag
Module TAL.TALInterpreter, line 437, in no_tag
Module TAL.TALInterpreter, line 281, in interpret
Module TAL.TALInterpreter, line 507, in do_setLocal_tal
Module Products.PageTemplates.TALES, line 221, in evaluate
URL: file:SimpleSkin/skins/SimpleSkin_templates/SimpleSkin_macros.pt
Line 44, Column 8
Expression: <PythonExpr container.extern_regexp('replace', 'SimpleSkin is bugy', '(bugy)', 'nice')>
Names:
{'container': <PloneSite at /Plone>,
'context': <ATDocument at /Plone/front-page>,
'default': <Products.PageTemplates.TALES.Default instance at 0x01561F58>,
'here': <ATDocument at /Plone/front-page>,
'loop': <Products.PageTemplates.TALES.SafeMapping object at 0x04C016E8>,
'modules': <Products.PageTemplates.ZRPythonExpr._SecureModuleImporter instance at 0x01554120>,
'nothing': None,
'options': {'args': ()},
'repeat': <Products.PageTemplates.TALES.SafeMapping object at 0x04C016E8>,
'request': <HTTPRequest, URL=http://localhost/front-page/document_view>,
'root': <Application at >,
'template': <FSPageTemplate at /Plone/document_view used for /Plone/front-page>,
'traverse_subpath': [],
'user': <SpecialUser 'Anonymous User'>}
Module Products.PageTemplates.ZRPythonExpr, line 47, in __call__
__traceback_info__: container.extern_regexp('replace', 'SimpleSkin is bugy', '(bugy)', 'nice')
Module Python expression "container.extern_regexp('replace', 'SimpleSkin is bugy', '(bugy)', 'nice')", line 1, in <expression>
Module Products.ExternalMethod.ExternalMethod, line 225, in __call__
__traceback_info__: (('replace', 'SimpleSkin is bugy', '(bugy)', 'nice'), {}, ('',))
Module C:\Programme\Plone 2\Data\Extensions\extern_regexp.py, line 41, in extern_regexp
TypeError: sub() takes at least 3 arguments (2 given) (Also, the following error occurred while attempting to render the standard error message, please see the event log for full details: sub() takes at least 3 arguments (2 given))

--------------------------------------------------------------------------------

Troubleshooting Suggestions

The URL may be incorrect.
The parameters passed to this resource may be incorrect.
A resource that this resource relies on may be encountering an error.
For more detailed information about the error, please refer to the error log.

If the error persists please contact the site maintainer. Thank you for your patience.

Alles anzeigen

Vielleicht hilfts dir weiter!

Torty

Ok - da haben wir ja unseren Traceback

Der Fehler lautet:
sub() takes at least 3 arguments (2 given)

aber das kann kaum sein denn die Methode sub() des Modul re ist so definiert:
sub( replacement, string[, count = 0])
also 2 Argumente + 1 optional

Ok: Welche Python-Version nutzt du mit welcher Zope+Plone-Version?

Torty

Dr. Evil

Momentan sind diese Versionen installiert:
Plone version: 2.5.2
Zope version: (Zope 2.9.6-final, python 2.4.3, win32)
Python version: 2.4.3 (#69, Mar 29 2006, 17:35:34) [MSC v.1310 32 bit (Intel)]

Design nur durch CSS anpassen

Tags

Benutzer online in diesem Thema