[FAQ] Elementares Grundwissen zu den Skins (Themen)

[andrea]

Basis-Informationen zu den "Themen" (Skins) (englisch):
Creating and understanding themes


Wer Zeit hat, ist herzlich willkommen, als Antwort die deutsche Übersetzung zu posten! 

[noex]

Was ist ein Theme?
Ein Theme ist das "Look and Feel" des Forums. Es können verschiedene Themes angelegt werden, und die Benutzer können zwischen diesen Themes wechseln. Jedes Theme hat im Normalfall sein eigenes HTLM, CSS, JavaScript, Bilder, usw...
Themes steuern also das Layout der Seite und können so individuell an Ihre Anforderungen angepasst werden.

Was ist das "default Theme"? Und für was ist es überhaupt?
Das "default Theme" ist der Standard für SMF welches alle Templates beinhaltet um SMF "korrekt" darzustellen. Dieses Theme dient auch als eine Art "Sicherung" (Fallback) und wird verwendet wenn in einem anderen Theme Templates fehlen.

Dies ist ähnlich wie bei Links: Wenn Sie keinen Domainnamen definieren (z.B.: /style.css) dann wandelt der Server dies in z.B.: http://www.simplemachines.org/style.css um. Dieses Beispiel ist zwar nicht genau so wie es tatsächlich funktioniert, aber ist vom Prinzip her das gleiche.

Ich mag oder will das "default Theme" nicht – kann ich es ändern?
Natürlich, Sie können tun was immer Sie wollen aber es wird aus zwei Gründen nicht empfohlen:

• Es könnte irgendein anderes Theme das "default Theme" erfordern (voraussetzten)
  
• Wenn Sie einzig das "default Theme" verwenden, macht dies das Updaten leichter

Aber keine Angst, Sie können das "default Theme" von der Auswahl entfernen, somit können die User dieses Theme nicht wählen.

Was ist das alles mit dieses "Templates"?
Ein "Template" ist eine Sammlung von in Verbindung stehenden "Sub Templates".
Templates können aus den Themes weggelassen werden (fehlende Vorlagen werden dann von dem "default Theme" ergänzt bzw. verwendet).
Subtemplates dürfen nicht fehlen!
Jetzt kommt natürlich die berechtigte Frage: Was sind Sub Templates?

Nun gut, was also sind "Sub Templates"?
Ich bin froh dass Sie danach fragen. Ein "Sub Template" ist jenes welches den eigentlichen HTML Code beinhaltet. Sie können zum Beispiel das admin_login Sub Template bearbeiten um das Kennwortfeld für den Administrator Login anders zu gestallten, oder Sie können das error Sub Template bearbeiten um Fehlermeldungen anders darzustellen.

Wichtig ist, dass Sie darauf achten das "Sub Templates" innerhalb der "Templates" gruppiert werden. Zum verdeutlichen ein kleines Beispiel: Das error "Sub Template" finden Sie im Template "Errors".

Wie gelange ich an diese "Templates" und "Sub Templates"?
Alle Themen werden Standardmäßig im Ordner "Themes" (diesen finden Sie innerhalb Ihres Forums-Ordners) gespeichert. In diesem Ordner ("Themes") befinden sich weitere Unterordner, jeder dieser Unterordner stellt ein Theme dar. Innerhalb dieser Ordner finden Sie eine Liste der Templates dieses Themes. Zum Beispiel: Error.Template.php
Wenn Sie diese Datei öffnen sehen sie darin sämtliche Sub Templates.

Wie kann ich das Aussehen von "Dingen" ändern?
Weiter unten gibt es eine Liste, aber im Normalfall müssen Sie nur die Hauptansicht (main) ändern. Es gibt zwei Layer die einmal vor und nach dem Sub Template angewandt werden.
Diese beiden Layer heißen: main_above und main_below (Also bevor und nach dem Sub Template). Diese main Layer befinden sich in der index.template.php

Deutsche Übersetzung von noex

[noex]

Teil2:

All das ist verwirrend... Ich möchte nur "kleine" Dinge ändern
Die meisten "Sub Templates" bestehen aus reinem HTML. Das einzige aus was Sie achten müssen ist das Sie bei Anführungszeichen ein "Backslash" \ davor setzen müssen. Wenn Sie also "Hab's" schreiben möchten, müssen dies so schreiben: "Hab\'s".

Es ist also gar nicht so schwer wie Sie vielleicht gedacht haben. Die großen Ängste sind also genommen, um einfache "Sub Templates" zu erstellen benötigen Sie nur grundlegende Kenntnis von PHP. Um eine Grundkenntnis von PHP zu erlangen finden Sie hier http://www.simplemachines.org/community/index.php?board=41 eine Vielzahl von PHP Tutorials.

Okay, ich bin nun in der Lage Dinge zu ändern... aber es sind so viele Dateien!!
Im Normalfall müssen Sie nur die index.template.php Datei bearbeiten um Grundlegende Änderungen am Design durchzuführen. Sie können in der Administration unter "Theme und Layout" ein neues Theme installieren bzw. erstellen. Unter der Überschrift "Installiert ein neues Theme" den Namen des neuen Theme eingeben ("Von einer Datei" leer lassen) und auf Installieren klicken. Nun wurde ein neues (leeres) Theme angelegt. Klicken Sie nun rechts in der Liste der Themes auf Ihr neu installiertes um dessen Einstellungen zu bearbeiten. Dort finden Sie auch den Punkt "Editiere das Index Template. (das Haupt-Template)" darin können Sie das Layout Ihrer Seite wie oben beschrieben ändern.
Kommentar: Übersetzung wurde an die SMF Version 1.0.5 angepasst.

Wo finde ich bereits fertige Themes?
Sie können auch bereits für SMF erstellte Themes ganze einfach über die Administration installieren. Eine aktuelle Liste aller verfügbaren Themes finden Sie hier: http://www.simplemachines.org/community/index.php?board=96.0
Laden Sie sich die Datei (.zip oder .tar.gz) herunter und gehen Sie im "Admin Center" auf "Theme und Layout", dort laden Sie unter dem Punkt "Installiert ein neues Theme" (Button durchsuchen) die Datei des Themes auf den Server. Das Theme wird nun installiert und Sie können nach einer erfolgreichen Installation die Einstellungen für dieses Theme anpassen. Sie können das neu Installierte Theme nun verwenden.

Gibt es eine Liste der Themes?
*nicht mehr aktuell*
BoardIndex – Der Index (Übersicht) des Boards. Das ist die Hauptseite des Forums.
   Sub templates: main
Calendar – Der Kalender.
   Sub templates: main, post, edit, link
Display – Zeigt die Beiträge an.
   Sub templates: main
Errors – Fehlermeldungen...
   Sub templates: error
Help – Die Hilfe Seiten. (Der "Hilfe" Button.)
   Sub templates: help_above, help_below, main
index – Das sind die Inhalte die jeweils vor und nach der Sub Templates angezeigt werden.
   Sub templates: main_above, main_below, menu, init
InstantMessage – Private Mitteilungen, Senden, Löschen, usw...
   Sub templates: folder, send, ask_delete
Login – Standard Login, und natürlich der Login für den Wartungsmodus.
   Sub templates: login, kick_guest, maintenance, admin_login
Memberlist – Die Mitgliederliste die angesehen und durchsucht werden kann.
   Sub templates: main, search
MessageIndex – Die Boards selbst.
   Sub templates: main
MoveTopic – Einen Beitrag verschieben.
   Sub templates: main
Notify – Benachrichtigungen (Ein-/Ausschalten).
   Sub templates: main, notify_board
Poll - Umfragen
   Sub templates: main
Post – Einen neuen Beitrag schreiben, auf einen Antworten, usw.
   Sub templates: main, spellcheck
Printpage – Thema ausdrucken.
   Sub templates: print_above, print_below, main
Profile – Das Profil der User, Profile bearbeiten, etc..
   Sub templates: profile_above, profile_below, summary, showPosts, trackUser, trackIP, account, personal, forumProfile, theme, notification, imprefs, deleteAccount, profile_save
Recent – ungelesene Beiträge, ungelesene Antworten, neueste Beiträge.
   Sub templates: main, unread, replies
Register – User Registrierung
   Sub templates: before, after
Reminder – Passwort vergessen?
   Sub templates: main, sent, set_password, ask
ReportToModerator – Den Moderator informieren?
   Sub templates: main
Search – Die Suche selbst.
   Sub templates: main, results
SendTopic – Einen Beitrag per E-Mail senden?
   Sub templates: main
Settings – Einstellungen und Optionen.
   Sub templates: settings, options
SplitTopics – Themen teilen und zusammenführen.
   Sub templates: ask, main, select, merge, merge_done, merge_extra_options
Stats – Statistiken des Forums.
   Sub templates: main
Who – Wer ist online, und was machen diese User gerade?
   Sub templates: main
Wireless -  Zugriff über WAP, WAP 2, oder i-mode.
   Sub templates: wml_above, wml_below, wml_boardindex, wml_messageindex, wml_display, wml_error, imode_above, imode_below, imode_boardindex, imode_messageindex, imode_display, imode_error, imode_post, imode_login, wap2_above, wap2_below, wap2_boardindex, wap2_messageindex, wap2_display, wap2_error, wap2_post, wap2_login

Was ist "context"?
Context ist, nun ja, wörtlich übersetzt der Inhalt der Seite. Oder mit anderen Worten, es ändert den Inhalt der Seiten. Vielleicht gibt es mehr oder weniger Boards oder einen neuen Beitrag, dies sind alles Dinge die Ihnen die "Context" Variablen zurückgeben können. Aber nicht alle "Context" Variablen funktionieren überall! Eine Liste der aktuellen Board werden Sie in einem Profil nicht abfragen können, das wäre ja auch unlogisch. Die Context Variablen werden immer nach dem Schema $context['inhalt'] dargestellt.

Was ist der Unterschied zwischen Einstellungen und Optionen?
Einstellungen sind global und gelten für alle Benutzer, Optionen gelten im Gegensatz dazu nur für den jeweiligen Benutzer.

Die Einstellungen und Optionen haben auch bei dem "default Theme" wirkung, ist eine Einstellung im "default Theme" gesetzt hat dies auch auf die anderen Themes Wirkung bei denen diese Einstellung fehlt.

Deutsche Übersetzung von noex

[dieter4]

Wie verändere ich die Farbe von Links oder dem Hintergrund?

Im Template-Ordner des Themes liegt die Datei style.css. Dort sind alle Farben definiert. Um die Farbe des Hintergrundes zu ändern, suche nach

Code (style.css) Select Expand


body
{
background-color:

(kann je nach Theme etwas variieren, hautpsache es steht bei body) Dort fügst du hinter dem Doppelpunkt die Farbe in HTML ein. Alternativ kannst du auch ganze Namen von Farben auf Englisch eingeben, z.B. 'white' oder 'red'.

Die Farbe der Links zu ändern ist da schon etwas komplizierter. Suche nach a (als einzelnes "Wort" ). Überall, wo 'color:' seht, wird die Linkfarbe definiert (wieder HTML-Farben oder ganze Wörter)

In beiden Fällen muss die Zeile mit einem ; beendet werden. (thx an noex)

Achtung:
Es gibt Unterteilungen bei Links! 'visited' steht für schon besuchte Links; 'hover' für Links, über die mit der Maus gefahren wird; 'link' für die normale Farbe.
Außerdem gibt es mehrere dieser Linkangaben für die Tabellen.