Thesis Style Codes – Custom 2

168 views

Wenden wir uns also dem Äußeren von Thesis zu, dem Erscheinungsbild. Ich gebe Ihnen einfach ein paar Codes, die Sie dementsprechend nur einbauen und vielleicht noch farblich anpassen müssen. Nicht schwer und eigentlich überhaupt nicht kompliziert.

 

Header

Als erstes der Header. Wollen Sie, dass die Navigationsbar nicht mehr über Ihrem Seitentitel steht?

In die custom.css Datei:

remove_action('thesis_hook_before_header', 'thesis_nav_menu'); add_action('thesis_hook_after_header', 'thesis_nav_menu');

Anstatt des Schriftzuges ein Logo? Ebenfalls in die CSS Datei. Denken Sie nur dran, die entsprechenden Änderungen durchzuführen, was den Ort Ihres Logos angeht, so wie die Höhe und Breite.

.custom #header #logo a { display: block; height: 180px; width: 800px; background: url('images/Ihr Bild') no-repeat; outline: none; }
.custom #header #logo, .custom #header #tagline { text-indent: -9999px; }
.custom #header #tagline { height: 0; }
.custom #header {border-bottom:none; padding:0}
.custom #header { padding: 0; }

Die Nervige Überschrift in der Kategorieansicht entfernen?

#archive_info {display:none;}

Die Farben

Sidebar: (CSS):

.custom #content_box {background-color:#EEEEEE;}

Textfläche: (CSS):

.custom #content {background-color:#fff;}

Effekte, beim drüberfahren mit der Maus?
Sidebar: (CSS):

li.widget ul li { border-bottom:1px solid #DDDDDD; display:block; margin:0; padding:0.5em; }
li.widget ul li:hover { background:#DDDDDD; display:block; margin:0; padding:0.5em; }
.custom li.widget { margin-bottom: 0.5em; line-height: 1.2em; }
.custom li.widget a:hover { color:#222222; background: none; }

Links: (CSS):

?View Code LANGUAGE
.custom a:hover { color: #FFFFFF; background: #000000; }
#footer a:hover { color: #FFFFFF; background: #000000; }
dl#trackback_list dt a:hover { color: #FFFFFF; background: #000000; }

Denken Sie dran, sich überall die individuellen Farben einzustellen, damit Sie den Look herausbekommen, den nur Sie haben wollen und im Endeffekt natürlich auch zum Teil Ihre Persönlichkeit widerspiegelt.

Kommentare

Kommentar Feld des Autors modifizieren:
CSS:

?View Code LANGUAGE
.custom dl#comment_list dt.bypostauthor, .custom dl#comment_list dd.bypostauthor>div {background: #E7F8FB none repeat scroll 0 0; padding-top:20px;}

So, da haben Sie schon mal was zum Ausprobieren und testen. Viel Spass damit und bis zu den nächsten Codes.

 

Previous post:

Next post:

Impressum

Blogverzeichnis - Bloggerei.deBlogverzeichnis TopBlogs.de das Original - Blogverzeichnis | Blog Top Liste BlogPingR.de - Blog Ping-Dienst, Blogmonitor www.rssmax.de BlogTraffic