Demo

Probiere ClanSphere aus und teste daran herum. Demo

Themes
Verfasst von duRiel ClanSphere Team am 06.12.2006 um 18:46 Uhr 1

Themes / Subtemplates

Schwierigkeit: Anfänger

Stand: Clansphere 2007 RC3

Allgemein
Themes sind dazu da, um das Layout einer bestimmten Unterseite als Benutzer möglichst leicht nach eigenen Wünschen anzupassen. Die Dateiendung ist .tpl, jedoch befindet sich darin HTML, das von Dreamweaver und anderen HTML Editoren angezeigt werden kann.

Infos zu den Themes bei Clansphere
Die Themes wurden bei Clansphere 2007 RC1 eingeführt. Davor wurden schwieriger anpassbare PHP-Funktionen verwendet.

Benutzung der Subtemplates bei Clansphere 2006
Die Subtemplates jedes Moduls befinden sich derzeit im Verzeichnis
themes/[theme]/[modul]/[datei].tpl
Theme ist das Themes-Set. Von Haus aus ist nur das Theme 'base' dabei.

Nehmen wir also als Beispiel die shoutbox navlist datei. Die PHP-Datei, die dazu gehört, ist mods/shoutbox/navlist.php. Die Subtemplate-Datei ist also themes/base/shoutbox/navlist.tpl
Dort ist der gewöhnte Aufbau der Shoutbox zu erkennen, nur, dass nur ein "Eintrag" sichtbar ist, der von {loop:shoutbox} sowie {stop:shoutbox} umschlossen ist. "loop" ist englisch und bedeutet "Schleife". Diese wird für jeden Kommentar ausgeführt und die Platzhalter ersetzt. So wird also aus {shoutbox:shoutbox_name} der Nickname dessen, der den Eintrag verfasst hat, {shoutbox:shoutbox_text} zum Text des Eintrages. Ausserdem stehen noch mehr Variablen wie zum Beispiel {shoutbox:shoutbox_date} zur Verfügung.

Diese Befehle sind nur in der Schleife erreichbar. Innerhalb dieser können Sie beliebig angepasst und überall eingebaut sein. Das selbe gilt für die Befehle ausserhalb der Schleife. Der HTML-Code kann beliebig verändert werden. So kann man zum Beispiel jeden Shoutbox-Eintrag in eine Tabelle packen und mehr, der Fantasie sind keine Grenzen gesetzt

Global gibt es folgende Platzhalter:
{page:width} - Enthält die Tabellenbreite (unter System - Optionen - Clansphere einzustellen)
{page:self} - Enthält die Datei, von der aus Clansphere zu dem Zeitpunkt ausgeführt wird
{icon:xxx} - Zeigt das Bild "symbols/crystal_clear/xxx.png" mit 16*16px an.

Generell wird so unterschieden:
{icon:xxx} - 16*16px Icon
{lang:xxx} - Eine von der Sprache abhängige Zeichenkette
{loop:xxx} & {stop:xxx} - Eine Schleife, die bei {loop:xxx} startet und bis {stop:xxx} durchläuft

Hier nochmal anhand eines Beispiels das Ganze erklärt:

Zu erkennen ist als erstes der Bereich, der von einer gestrichelten Linie umrandet ist. Dieser ist ein DIV-Element. In diesem Fall dient dieser dazu, dass das Layout nicht von einem zu langem Text gesprengt werden kann, statt dessen wird eine Scrollbar in der Shoutbox erscheinen.
In dieser ist eingegrenzt: {loop:shoutbox} sowie {stop:shoutbox}. Alles, was dazwischen steht, wird für jeden Shoutbox-Eintrag, der dargestellt wird, ausgeführt. Das ist in diesem Fall {shoutbox:shoutbox_name} sowie {shoutbox:shoutbox_text}, was diese Platzhalter bedeuten dürfte klar sein.

Unterhalb der Schleife ist das Formular erkennen, durch das man einen Eintrag erstellen kann.

Für Programmierer (Fortgeschritten)
Die Variablen des Templates müssen logischerweise auch irgendwoher stammen.
Allgemein gilt:

{irgendwas1:irgendwas2} -> $data['irgendwas1']['irgendwas2']

Für Sprache und Icons haben wir 2 Kurzformen, damit man vom Template aus direkt auch auf die Sprache und die Icons zugreifen kann ohne diese erst in der PHP-Datei definieren zu müssen:

{lang:irgendwas} -> $cs_lang['irgendwas']
{icon:irgendwas} -> cs_icon('irgendwas')

Bei Schleifen sieht das ganze wieder etwas komplizierter aus:
 
1.
2.
3.
1. / 2. / ... 
 {loop:loopname}
{
loopname:irgendwas}
{
stop:loopname}

Das Array müsste dabei so aussehen:
$data['loopname'][$run]['irgendwas'] = 'var';
$run ist dabei ein beliebiger durchlauf. $run muss bei 0 anfangen, sonst wird die Schleife nicht erkannt!

Es ist auch möglich, mehrere / beliebig viele Schleifen ineinander zu verschachteln, wie es zum beispiel bei den Mitgliedern üblich ist (Squads-Schleife -> Mitglieder-Schleife).

Hier würde das im Template wieder ähnlich aussehen:
 
1.
2.
3.
4.
5.
6.
1. / 2. / ... 
 {loop:squads}
{
squads:squads_name}
{
loop:members}
{
members:users_nick}
{
stop:members}
{
stop:squads}

Das Array sieht hier wie folgt aus:

$data['squads'][$squad_run]['members'][$members_run]['users_nick'] = 'var';

Auch hier müssen $squad_run sowie $members_run bei 0 anfangen, da die Schleife sonst nicht erkannt wird.


Inzwischen gibt es auch Bedinungen in den Themes. In den Templatedateien sehen diese zum Beispiel so aus:

{if:access}
Zeig was
{stop:access}

"Zeig was" wird nur angezeigt, falls die Berechtigung in der PHP_datei gesetzt ist. Konkret sieht das so aus:
 
1.
2.
3.
4.
5.
6.
7.
8.
9.
1. / 2. / ... 
<?php

$data
['if']['access'] = true;

// bzw

$data['if']['access'] = false;

?>

Bei true wird "Zeig was" angezeigt, bei false nicht.

Zusatz, 7.4.2007:
Ab sofort ist es auch möglich, {url :mod_action} in der Theme-Datei zu schreiben, ohne daraufhin seperat in der PHP-Datei nochmals cs_url() aufzurufen, das passiert jetzt automatisch.

Kommentare gerne hier

Seiten: -

Kommentare: 6
Seite [1]
SCHIRI ClanSphere Team

--

Ort: Hamburg
Beiträge: 5437
# 1 - 06.12.2006 um 19:41 Uhr

schön erklärt
jgN__

22.04.2010

Ort: Linz
Beiträge: 363
# 2 - 07.12.2006 um 09:24 Uhr

gefällt mir.
würde nur bei gelegenheit noch veranschaulichen.

dh. vielleicht pics von dem beispiel der shoutbox
(visualisieren --> damit ist es für viele leichter zu verstehen bzw. zu merken)
hajo ClanSphere Team

--

Ort: Barsbüttel
Beiträge: 10036
# 3 - 07.12.2006 um 10:44 Uhr

hast die beiden globalen platzhalter vergessen:

{page:width} = enthält $bx_main['def_width'] (Contentbreite)
{page:self} = enthält $_SERVER['PHP_SELF'] (Hauptdatei)

zudem sollte man erwähnen evtl. das wir icon, lang, etc. trennen

beispiele wären auch nicht schlecht ^^


Zuletzt editiert von hajo ClanSphere Team, am 07.12.2006 um 10:44 Uhr (1x Editiert)
duRiel ClanSphere Team

25.10.2015

Ort: Cambridge
Beiträge: 7806
# 4 - 07.12.2006 um 22:43 Uhr

bilder mach ich rein sobald ich wieder nen html editor hab. @hajo: ist drin.

/edit: hab das tutorial jetzt erweitert, liegt jetzt ein teil für programmierer bei.


Zuletzt editiert von duRiel ClanSphere Team, am 18.01.2007 um 01:51 Uhr (2x Editiert)
Flexi

15.07.2011

Ort: -
Beiträge: 49
# 5 - 05.05.2007 um 14:48 Uhr

Sehr gut erklärt, danke!
scennative

10.06.2020

Ort: -
Beiträge: 727
# 6 - 17.04.2009 um 16:59 Uhr

Das bild ist immer noch nicht dabei sonst aber top

Bitte Login benutzen, um Kommentare zu schreiben.