Tutorials: Einspaltiges “Dark”-Theme


Warning: filesize() [function.filesize]: stat failed for /mnt/web6/52/32/51120132/htdocs/ge/downloads/dark_one_column.zip in /mnt/weba/63/32/51120132/htdocs/ge/wp-content/plugins/wsdl_manager/functions.php on line 115

Nachdem ich nun schon einige Male gefragt wurde, wie man denn die 2 Spalten zu einer macht, hier ein kleines Tutorial.

Ändern der sidebar.php

Da wir nur eine Spalte brauchen, können wir den div-Container mit der ID “sidebar2″ getrost löschen.

Zeile 21: <div id=”sidebar2″>
Zeile 53: </div>

Als nächstes packen wir den div-Container mit der Klasse “sb2″ in den Container mit der Klasse “sb1″

Zeile 22: <div class=”sb2″>
[…]
Zeile 52: </div>

Zeile  6: <div class=”sb1″>
[…]
Zeile 18: </div>

und die style.css

Dann werden nur noch folgende IDs im StyleSheet geändert

#content {
float: left;
width: 75%;
min-width: 750px;
height: 100%;
overflow: hidden;
}
#sidebar {
float: left;
width: 25%;
min-width: 200px;
height: 100%;
padding: 0 0 30px 0;
}
#sidebar1 {
float: left;
width: 100%;
height: 100%;
overflow: hidden;
}

Zum Schluss noch die IDs “sidebar2″ in “sidebar1″ umbenennen.

Zeile 446: #sidebar1 .sb2 {
Zeile 447: margin: 0 20px 0 0;
Zeile 448: }
Zeile 449: #sidebar1 .sb2 a {
Zeile 450: color: #5b9cff;
Zeile 451: }
Zeile 452:
Zeile 453: #sidebar1 .sb2 ul ul li {
Zeile 454: background: transparent url(images/icon_list.gif) no-repeat 0 6px;
Zeile 455: padding: 0 0 0 20px;
Zeile 456: }

Zu beachten ist, daß nach der Umgestaltung einige IDs im Stylesheet unwirksam werden und somit gelöscht werden können.
Es gibt sicherlich auch schönere und bessere Methoden als diese, doch das ist die schnellste. Setzt Euch mit CSS auseinander, probiert ein wenig rum und findet für Euch die beste Lösung.

Hier noch die geänderten Dateien als Download

Download Files for the One-Column Dark-Theme Name: Files for the One-Column Dark-Theme
Größe: 0,00 kBytes
DateiTyp: .zip-Datei
Bearbeitet am 08. Jun 2007 - 19:21 Uhr
Downloads: 197

Teile und genieße Diese Icons verzweigen auf soziale Netzwerke bei denen Nutzer neue Inhalte finden und mit anderen teilen können.
  • Digg
  • del.icio.us
  • Netvouz
  • DZone
  • ThisNext
  • MisterWong
  • Wists
  • YahooMyWeb
  • NewsVine
  • Technorati
  • Furl
  • De.lirio.us

Dieser Beitrag wurde geschrieben von Christopher Hartmann. Du kannst einen Kommentar hinterlassen oder den RSS-Feed der Kommentare abonnieren | Trackback URI

Einen Kommentar hinterlassen

Deine eMail wird niemals veröffentlicht