Mistylook – Design und Schriften der Widgets anpassen?

  • Avatar von Unbekannt

    Hallo,

    ich bin gerade dabei mein Blog auf WordPress.com umzuziehen, daher ist es auch leider noch nicht öffentlich zugänglich.
    Meine Frage ist aber auch sicher ohne Ansicht des Blogs zu beantworten.

    Ich habe mich für das Theme Mistylook entschieden, weil es mir vom Layout am Besten gefällt. Die Farben habe ich schon weitgehend (css-Upgrade) an meine Vorstellung angepasst.
    Was ich aber gar nicht hinbekomme, weil ich nicht weiß wo, ist es, bei den Widgets Schriftfarbe und -attribut (small-caps) und die Hintergrundfarbe der Widgets zu ändern. Ebenso finde ich nicht die richtige Stelle, um in den einzelnen Beiträgen die Überschriften wie z.B. ‚Einen Kommentar hinterlassen‘ in Farbe und Schrift anzupassen.

    Ist das überhaupt möglich?

    Vielen Dank

    Der Blog bei dem ich Hilfe benötige heißt (nur für angemeldete Benutzer sichtbar).

  • Avatar von Unbekannt

    Habe den Blog jetzt doch freigegeben:
    Die Adresse lautet: http://chaosqueenskitchen.wordpress.com

  • Avatar von Unbekannt

    Widgets Schriftfarbe und -attribut (small-caps)

    In diesem Themes ist das für den Titel der Widgets „li.sidebox h2“.

    Hintergrundfarbe der Widgets

    Das ist etwas komplizierter. Der Selektor heißt in diesem Fall „li.sidebox“ und enthält die Hintergrundfarbe und ein Bild, welches für die abgerundeten Ecken zuständig ist. das müsste man entweder austauschen oder wegnehmen.

    Beiträgen die Überschriften wie z.B. ‚Einen Kommentar hinterlassen‘ in Farbe und Schrift anzupassen.

    Für den besagten Satz hilft der Selektor „#respond h3“.

    Um die entsprechenden CSS-Selektoren herauszufinden helfen die Plugins „Web Developer Toolbar“ oder „Firebug“ für den Browser Firefox:
    https://addons.mozilla.org/de/firefox/addon/60
    https://addons.mozilla.org/de/firefox/addon/1843

    Gruß, Torsten

  • Avatar von Unbekannt

    Hallo Thorsten,

    vielen Dank für Deine Antwort. Sie hat mir sehr weitergeholfen, aber das Formatierungs-Problem mit den Widgets bekomme ich nicht hin.
    Ich stehe da irgendwie wohl auf der Leitung…

    Ich habe jetzt Folgendes eingefügt, leider ohne Effekt:

    **********
    #li.sidebox {
    margin-bottom:10px;
    padding:10px;
    }

    #html li.sidebox {
    padding-bottom:10px;
    }

    #li.sidebox h2 {
    font-weight:normal;
    font-variant:normal;
    font-size:1.6em;
    text-align:left;
    color:#000000;
    }
    **********

    Das mit dem ‚Satz‘ hat geklaptt!

    Die Änderung der Hintergrundfarbe hebe ich mir für später auf. ;-)

  • Avatar von Unbekannt

    Die Raute steht für eine eindeutige „id“. Die ist aber nur bei „respond“ gegeben. In den anderen Fällen handelt es sich um HTML-Befehle (li=list item=Listenelement) bzw. Klassen.

    <a class="neu">Link</a>

    wird so per CSS angesprochen:

    .neu {CSS-Defntionen}

    li.sidebox h2 ist also der HTML-Befehl „li“ mit der Klasse „sidebox“ und darin der HTML-Befehl h2 (Headline 2=Überschrift 2ter Ordnung)

    <div id="header">Kopfzeile</div>

    wird so per CSS angesprochen:

    #header {CSS-Defntionen}

    In deinem Fall also einfach die „#“ weglassen und schon sollte es klappen!

    Gruß, Torsten

  • Avatar von Unbekannt

    Hallo Torsten,

    so ganz langsam komme ich zu einem besseren Verständnis von CSS.

    Ohne das „#“ klappt es super. Vielen Dank für den Hinweis.

    Jetzt habe ich wieder ein (und hoffentlich bald das letzte) Problem.
    Die Farbe des Textes „n Antworten“ hat noch die falsche Farbe.

    Im Quelltext finde ich dazu die Zeile: <h3 id=“comments“>2 Antworten</h3>

    Sie widersetzt sich erfolgreich davor, von mir in einer anderen Farbe formatiert zu werden. Der Aufbau ist auch wieder ein anderer als der von „respond“.
    Was muss ich denn da im CSS definieren?

    Nochmals vielen Dank für Deine Geduld und Deine tollen Erklärungen.

  • Avatar von Unbekannt

    Das ist etwas verwirrend, denn eigentlich müsste bei:

    <h3 id="comments">2 Antworten</h3>

    das CSS so funktionieren

    h3 #comments {CSS-Defintionen}

    Aber ich nehmen an, da überschreibt eine andere CSS-Definition die erste Einstellung. Aber bekanntlich führen viele Wege nach Rom. Das ist bei CSS nicht anders. Mit folgendem Code sollte es klappen:

    #content h3 {CSS-Defintionen}

    Content ist das DIV für den gesamten Inhaltsbereich und die Überschrift ist eine Headline 3. Ordnung (h3) darin. Daher klappt es in diesem Theme auch so.

    Gruß, Torsten

  • Avatar von Unbekannt

    Hallo Torsten,

    Du bist mein Held! ;-)

    Ich bin begeistert, jetzt habe ich fast alles so wie ich es haben möchte und muss wohl hoffentlich keine nervenden Fragen stellen.
    Jetzt beginnt wohl die langwierige und stupide Arbeit der Datenübernahme.

    Vielen Dank für Deine prompte Hilfe

  • Avatar von Unbekannt

    Also erst einmal: die Fragen nerven nicht! Dafür ist ja genau dieses Forum da.

    Und dann viel Spaß beim Bloggen!

    Wenn Du mal wieder Fragen hast, dann gerne hier im Forum fragen.

    Gruß, Torsten

  • Das Thema ‘Mistylook – Design und Schriften der Widgets anpassen?’ ist für neue Antworten geschlossen.