Anleitung zur Durchführung des CSS-Updates

Sonntag, 26. Juni 2011

Der Updatevorgang auf die neue Version der CSS-Designs dauert in etwa 30 Minuten, sofern nur wenige Anpassungen an den Designs durchgeführt wurden. Sollten zu einem früheren Zeitpunkt Anpassungen (wie eigene Definitionen in CSS-Dateien bzw. eigene Grafiken im /grafiken/-Ordner des Webauftritts) durchgeführt worden sein, die von der Standardvorgabe abweichen, so führen Sie vor dem Update unbedingt ein Backup durch bzw. kopieren Sie die geänderten Daten in einen gesonderten Ordner, sodass Sie nach dem Update schnell darauf zurückgreifen können. In diesem Fall sind nach dem Update auch ggf. weitere Anpassungen nötig.

Es wird empfohlen, alle Dateien aus den Ordnern /grafiken/, /css/ und /ssi/ gesondert zu sichern, da diese nach dem Update ggf. noch benötigt werden.

Führen Sie im Anschluss folgende Schritte zur Aktualisierung durch:

http://www.vorlagen.uni-erlangen.de/downloads/designs.php aufrufen und „Paket aller CSS-Designs“ und „Paket aller Grafik-Dateien“ herunterladen
Dateien entpacken und in den Ordner /websource/ des Webauftritts kopieren (bestätigen Sie ggf. alle Meldungen zum Integrieren von Ordnern und zum Überschreiben von Dateien)
Ersetzen Sie den Inhalt der Datei /ssi/head.shtml mit folgendem Code:

[html]
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="Language" content="Deutsch" />
<meta name="generator" content="Web-Baukasten der Friedrich-Alexander-Universität (06/2011)" />
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0" />

<link rel="bookmark" href="http://www.uni-erlangen.de" title="Offizieller Webauftritt der Universität Erlangen-Nürnberg" />
<link rel="contents" href="/inhaltsuebersicht.shtml" title="Inhaltsübersicht" />
<link rel="copyright" href="/impressum.shtml" title="Impressum" />
<link rel="start" href="/" title="Startseite" />

<link rel="section" href="#content" media="handheld" title="Zum Inhalt" />
<link rel="section" href="#leftnavi" media="handheld" title="Zur Navigation" />
<link rel="section" href="#seitenanfang" media="handheld" title="Zum Seitenanfang" />

<link href="/css/d7/layout.css" type="text/css" rel="stylesheet" title="default" />
<link href="/css/tools.css" type="text/css" rel="stylesheet" title="default" />
<!--[if lte IE 7]>
    <link href="/css/d7/patches/patch.css" rel="stylesheet" type="text/css" />
<![endif]-->

<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
[/html]

Anmerkung: Sie können /css/d7/layout.css auch aus einem beliebigen anderen Design wählen. Ändern Sie hierfür d7 in d3, d4, d5, d6 oder flexi. Analog gehen Sie für /css/d7/patches/patch.css vor.

Laden Sie im Anschluss die Ordner /css/, /grafiken/ und /ssi/ auf Ihren Webserver hoch. Damit ist das Update für den Fall, dass keine Anpassungen am ursprünglichen Design durchgeführt wurden, abgeschlossen. Wahrscheinlich sind aber noch kleine Änderungen notwendig, damit Ihr Webauftritt optisch wieder der ursprünglichen Version gleicht. Gehen Sie wie folgt vor:

Erstellen Sie in dem Ordner /screen/ des Designs, das Sie verwenden (z.B. /css/d7/screen/) eine neue Datei: basemod_custom.css bzw. kopieren eine bestehende Datei und benennen diese entsprechend um (und leeren deren Inhalt). In der Datei /css/d7/layout.css fügen Sie an unterster Stelle folgende Code-Zeile ein:

@import url(screen/basemod_custom.css);

In der Datei basemod_custom.css können Sie nun alle angepassten und zusätzlichen CSS-Definitionen Ihres ursprünglichen Designs platzieren, diese werden umgehend vom Browser erkannt und eingelesen. So sollte es Ihnen gelingen, die Anpassungen an Ihrem ursprünglichen Design auch wieder nach dem Update integrieren. Alternativ können Sie auch bestehende Dateien des Designs editieren. Dies erschwert allerdings die Durchführung zukünftiger Updates, so sollten Sie zumindest den kompletten Ordner des Designs, in dem Sie tiefgreifende Änderungen durchführen wollen, kopieren und umbenennen (diese natürlich entsprechend in der head.shtml verlinken) und im Anschluss nur in der Kopie arbeiten.

Alternativ gibt es auch die Möglichkeit, das Update über ein Komplettpaket durchzuführen: http://www.vorlagen.uni-erlangen.de/downloads/komplettpakete.php. Dies empfiehlt sich vor allem dann, wenn Sie Dateien oder Ordner zu einem früheren Zeitpunkt gelöscht oder abgeändert haben, diese Änderungen aber rückgängig machen wollen. Das Komplettpaket enthält auch Musterseiten zur Verwendung sog. „Subtemplates“, die eine neue Funktion der aktuellen CSS-Design-Version darstellt. Zu den weiteren Neuerungen des Updates lohnt sich ein Blick in den Artikel: Neue CSS-Struktur & Funktionen der Designs des Webbaukastens.