Eigener Theme

Hallo,

ich habe vor kurzem angefangen ein elgg 1.10 einzurichten, hatte leider vorher noch nicht so viel Ahnung von ähnlichen Systemen. Das Einrichten hat aber geklappt es läuft und ich konnte schon ein paar Plugins testen.

Ich habe mir auch die Themes angesehen, da ich das Layout doch eher Grundlegend ändern möchte. Dafür habe ich mir zum einen die Tutorials angesehen, als auch den Theme-Bereich in der Doku. Allerdings fehlt mir noch irgendwie ein Punkt wo ich Anfangen kann, wenn ich selbst ein Theme-Plugin erstellen möchte. Mir ist klar, dass ich mit entsprechender Namensgebung an bestimmten Orten die Views des Standardlayouts anpassen kann. Nur habe ich es bisher nicht geschafft, dass sich was ändert. Ein alles ist schwarz oder so würde mir ja schon helfen, da ich dann weiß ich werkel an der richtigen Stelle aber irgendwie haben alle Änderungen auch im css/core keine Auswirkungen oder ich sehe einfach die falschen Bereiche.

Um dem Chaos oben mal ein wenig Struktur zu geben:

1:Welche Seite sehe ich bevor ich mich eingeloggt habe im Standardmodus? Bzw. welche Skripte haben darauf Einfluss?

2:Wie sollte ich Anfangen, wenn ich eine Landingpage machen will. ( Also eine Seite die ich als erste bekomme und die ich gerne frei gestalten können würde)

3:Macht es Sinn andere Grundlagen erstmal zu verstehen bevor ich mich mit Themes beschäftige?

Naja soweit erstmal, hoffe auf ein paar Ratschläge :)

gruß David

  • Für das Testen solltest Du auf jeden Fall das Caching in den erweiterten Seiteneinstellungen Deiner Elgg-Seite abschalten, damit Du unmittelbar die Auswirkung einer Änderung sehen kannst. Anderenfalls wirst Du erst nach dem Zurücksetzen des Caches die Änderungen sehen können. Und das ist vor allem zu Beginn, wenn Du noch viel experimentieren musst, eher schlecht, da Du dann vielleicht zu spät feststellst, dass irgendeine der letzten 20 Änderungen nicht das Ergebnis zeigt, dass Du gewünscht hast. Aber dann ist es schon zeitaufwändig, wieder herauszufinden, welche Änderung genau die falsche war.

    Ich würde DIr empfehlen, ein existierendes Theme als Basis zu nehmen und damit herumzuspielen, damit Du ein Gefühl bekommst, wie eine Theme-Plugin grundsätzlich aufgebaut ist und in welchen Dateien Du Änderungen vornehmen mußt. um das gewünschte Ergebnis zu erzielen. Das Aalborg-Theme ist als Startpunkt nicht schlecht. Oder vielleicht gibt es ein anderes Theme, das schon näher an das herankommt, was Du als Endergebnis erzielen willst. Am Ende solltest Du nicht die Dateien des Aalborg-Themes selbst modifizieren sondern eher ein Klon dieses Themes erstellen (Umbennen von Datei- und Funktionsnamen ist dann notwendig). Mit solch einem Klon des Themes tust Du Dir beim Updaten Deiner Seite leichter, da Du nicht Dein angepasstes Theme selbst überschreibst, wenn Du Elgg selbst updatest. Für den Anfang kannst Du aber trotzdem einfach mal die Dateien beispielsweise des Aalborg-Themes selbst verändern. Vergesse aber regelmäßige Backups Deiner Arbeit nicht.

    Gezieltes Ändern von CSS-Dateien und was sonst noch geändert werden muss, um das Aussehen der Seite Deinen Vorstellungen anzupassen, ist zu Beginn sicher ein wenig schwierig. Am besten solltest Du ausgiebig mit den von eigentlich jedem Browser angebotenen Dev-Tools arbeiten (z.B. "Element untersuchen" im Kontextmenu oder den Seitenquelltext anschauen). Du kannst im Browser sogar Änderungen in den CSS-Parametern machen (z.B. einfach mal die Farbe ändern), um zu sehen, was sich innerhalb der Seite ändert, wenn Du diese Anpassung vornimmst. Dann musst Du eben in den CSS-Dateien nach eben diesen Klassen bzw. Identifiern suchen, bei denen die Änderungen notwendig sind. Das Aalborg-Theme enthält auch nicht alle CSS-Dateien, die in Elgg enthalten sind, sondern nur diejenigen, in denen gegenüber dem Default von Elgg Änderungen gemacht wurden. Weitere CSS-Dateien gibt es im views/default/elgg-Ordner und auch manche Plugins haben eigene CSS-Dateien.

    Wenn eine Änderung in einer Datei notwendig wird, die noch nicht im Aalborg-Theme drin ist, kannst Du diese Datei einfach in Deinen Theme-Plugin-Ordner reinkopieren und dann dort die Änderung machen. Deine geänderte Datei wird dann die ursprüngliche Datei ausser Kraft setzen ("Override"), sofern sie innerhalb der Verzeichnisstruktur Deines Plugins an der gleichen Position ist wie die ursprüngliche Datei an ihrem Platz. "Overriding" und "Extending" von Views sollte in der Elgg-Dokumentation zumindest kurz beschrieben sein.

    Die Landing-Page / Loginseite von Elgg wird durch das custom_index-Plugin erzeugt. Es gibt da auch keine separate Indexseite für angemeldete bzw. nicht-angemeldete User. Wenn Du nur das Aussehen ändern willst, kannst Du die CSS-Datei des custom_index-Plugins noch mit in Dein Theme mit aufnehmen. Es ist auch möglich, separate Seiten zu erstellen (Landing-Page einerseits und Indexseite für angemeldete User andererseits). Das geht aber ein wenig über ein reines Theme-Plugin hinaus. Es gibt ein Tutorial zur Erstellung einer eigenen Indexseite (http://elgg.readthedocs.org/en/1.11/tutorials/indexpage.html). Den entsprechenden Code könntest Du auch letztendlich zu Deinem Theme-Plugin hinzunehmen. Mit einer kleinen Modifizierung

    function new_index() {
        if (!elgg_is_logged_in()) {
            return !include_once(dirname(__FILE__) . "/pages/index.php");
        } else {
            return false;
        }
    }

    kannst Du Deine eigene Indexseite für nicht-angemeldete User anzeigen lassen und ansonsten weiterhin die custom_index-Homepage verwenden

German Support Group

German Support Group

The German support group within the Elgg community.