Master Template entwickeln?

  • Hallo,

    ich würde gerne mal so ein Master Template entwickeln, weil ich ja jetzt doch schon ein paar Seiten erstellt habe, allerdings habe ich keine davon veröffentlicht. Diese waren halt nur erst einmal dazu gedacht, sich ein wenig mit HTML, CSS, JS (jQuery, Ajax etc.) und PHP anzufreunden. Allerdings habe ich für diese Seiten immer ein extra .css Datei oder eine extra .html oder .tpl erstellt und demnach war auch mit Sicherheit vieles dabei, was sehr repetitiv war.

    Wie kann man also Aspekte der Seite in einem Master Template vereinen. (so heißt das doch?)
    In diesem Master Template dürften dann ja eigentlich nur Sachen vorkommen, wie ein Menü, ein Footer oder der Inhaltsbereich. (je nachdem ob dieser sich ändert oder nicht?)

    Würde man dann aber wirklich für eine Seite auch nur ein Master Template machen? Was wäre denn bspw. wenn ich einen Frontend Bereich habe und einen Backend Bereich, für einen Blog oder sowas z.B? Diese zwei Bereiche würden sich in meiner Vorstellung dann natürlich sehr unterscheiden. Würde man dann versuchen, trotzdem irgendwie die Gemeinsamkeiten zu vereinen oder für diesen Backend Bereich dann auch ein extra Master Template erstellen? Diese dann ja natürlich auch mit einer .css Datei die dann das Design bestimmt?

    Wenn ich dann eine extra Seite hätte, wie z.B eine Gallerie, die dann das Master Template des Frontends benutzt, wie würde ich aber dann bspw. was in den Inhaltsbereich, der Einfachheit halber jetzt mal "content" genannt, ;) reinladen? Müsste man das dann nicht schon mit js machen? Über diesen content div würden sich ja dann noch der menü Bereich usw. befinden, also wie regelt man das dann?
    Die HTML Dateien kann man dann ja ganz normal in die .php Dateien inkludieren aber wie man das o.g regelt, das wüsste ich nicht.

    Wenn man das ganze mit js regeln würde, dann würde ja aber auch die Seite nicht mehr laufen, wenn jemand js abgeschaltet hat.
    Es kann sein, dass das ganze irgendwie ein bisschen komisch geschrieben ist, dafür entschuldige ich mich aber ich wusste teilweise echt nicht, wie ich das schreiben soll. :confused:

    Danke schon einmal an alle, die sich hier beteiligen bzw. mir helfen.

    3 Mal editiert, zuletzt von Crushed (20. März 2015 um 04:58)

  • Na mach dir halt Gedanken zu deinen designs, zieh das gemeinsame raus und dann haste den master.
    Meine erfahrung zeigt, dass frameworks sinnvollersind, als mastertemplates. Die templates bringen erst was, wenn man viele wiederverwendbare dinge hat.
    Jedoch würde ich da eher auf objekt-ebene gehen, statt auf seitenebene ;)

  • Ja, das design habe ich auch schon gut wie möglich sepereiert aber wie würde man das ganze denn machen, wenn ich bspw. in einem Template nur ein wenig Code an Stelle x einfügen möchte, also bspw. ein extra Menü oder extra Inhalt, was weiß ich? Macht man das dann einfach per include?

    Ich habe bisjetzt schon einiges an wiederverwendbaren Dingen, ich denke scdhon, das sich das lohnen würde. Zurzeit habe ich eigentlich auch viele Dateien, wo wie gesagt eigentlich fast das gleiche vom HTML Aufbau drin steht aber halt mit unterschiedlichem Inhalt.

    Könntest du das mit den Frameworks noch mal ein wenig weiter erläutern, was für Frameworks? Und was meinstdu mit der objekt-ebene, könntest du da auch noch ein wenig ins Detail gehen? Ich haeb sowas noch nie gemacht. ;)

  • also zuerst mal langsam angefangen.... ich werde das jetzt nur anhand von einer navi erläutern, wenns ok is ;)

    die objekt-ebene:
    ein menü ist eine liste von links also ne ul mit li und darin a mit nem span für den text.
    das ganze kann man der semantik halber noch in html5 in einem nav-element wrappen.
    einige werden jetzt sagen bei nav braucht es keine ul und li mehr, ich bin da eher etwas oldschool angehaucht und hab kein problem, wenn hier oder da mal nen wrapper für die semantik auftaucht :)
    jetzt zu deinem master-template, wenn du nun bausteinmässig auf objekt-ebene gehen möchtest, solltest du dir darüber im klaren sein, wie so ne navi aussehen soll und was damit verbunden ist. in der programmierung führen bekanntlich viele wege nach rom. du kannst ne funktion schreiben, die das alles für dich aufbaut oder dir eben ne template-datei erstellen. du das solltest das ganze rekursiv durchlaufen, damit du die ganzen elemente aufbauen kannst, ohne die eltern-kind-beziehungen kaputt zu machen. wenn du html und php so weit wie möglich trennen willst, ist die wahl eine datei zu erstellen und damit dann über eine funktion selbe datei rekursiv zu laden.

    angenommen du hast nen mehrdimensionales array, welches deine navi abbildet, dann schreibste dir ne render-function und übergibst ihr ein array als parameter.
    outputbuffer starten, datei includen, outputbuffer in return schreiben und den buffer clearen.
    so ungefähr:

    PHP
    function render($path, $args){
            ob_start();
            include_once $path;
            $ret = ob_get_contents();
            ob_end_clean();
            return $ret;
        }


    jetzt ist in der template-datei, die du includen willst $args bekannt und kann genutzt werden. da args ja nen array is, kannste dann entsprechend ne funktionalität in dein template bauen, wo du prüfst, ob kind-elemente vorhanden sind und wenn ja, rufste an der stelle wieder mit nem

    PHP
    echo render($templatedatei, $kindarray)

    die funktion rekursiv auf.

    am ende hast du deine template-datei und baust dir darüber die menüs alle mit dem gleichen html auf.
    du kannst anhand von steuer-einträgen im array noch weitere elemente in der tpl hinzufügen (bilder und so zeugs halt)
    wenn du in $args jetzt noch dazuschreibst, welche layoutinfos du hast (vertikales menü, horizontales menü, wrapper-name, etc)
    kannst du darüber klassen setzen oder auch IDs und darüber wiederum im css das aussehen steuern.
    bei master-templates empfehle ich dass du die farben separat steuerst über allgemeine klassen.
    zB farbe_1, hintergundfarbe_1 usw
    denn so kannst du für nen nuees colorset einfach die farben ändern ohne im html nochmal was anpassen zu müssen, einfach durch tauschen der css-datei
    mit techniken wie sass und compass oder less wird das ganze dann noch ne ecke einfacher, weil man dann im css sogar variablen nutzen kann :D


    mit frameworks sind dann so teile gemeint wie YAML (ganz altes css-dings), bootstrap und boilerplate und so. halt ansammlungen von immer wieder benutzten css-anweisungen, zusammengefasst zu einem framework. (is dann wie jquery beim javascript^^)

    wenn du dir mit php dann noch was baust, was deine bausteine und ihre bau-anleitung vorhalten kann (stichwort: factory-pattern),
    kannste dir ganz einfach ne website mit wenigen befehlen zusammenschustern. is eigentlich ganz cool, wenn man was lernen möchte, aber der weg zu nem eigenen cms - und nur darauf läuft es irgendwann hinaus - ist steinig und schwer, man muss sich viele gedanken machen, bevor die erste zeile code geschrieben wird.

    aber stell dir ne klasse vor der sagste nur noch $site->buildNavi($arrMenu) und damit hauste direkt dann nen ganzen schwung an funktionalität in bewegung.. :)
    oder site->buildHeader($arrHeaderInfos). die arrays bauste dir natürlich auch entsprechend zusammen, indem du dir in dieser klasse die benötigten datenbank-abfragen vorhälst :)

    dann musste nur noch das ganze aufbauen der seite aufsplitten in zB layout, template, content, elements und schon haste ne granulare vorgehensweise und volle kontrolle, mit anständig getrenntem code und nem ordentlichen MVC-Modell (model view controller)
    model ist das datenmodell, der view dein template und dein controller holst sich das model und gibt des an den view mit der info "mach es so und so"

    hoffe das war jetzt aussagekräftig genug und wie immer: wenn was falsch sein sollte, bitte ich höflichst um korrektur ;)