Icons vor Header der Sidebar

  • Hallo,
    ich habe mich jetzt schon ein bißchen durch das Forum gewühlt, aber nicht das gefunden, was ich brauche...

    Ich benutze WordPress 2.2, wenn ich das richtig sehe und verwende die von mir angepasste WordPress Standard DE-Edition 1.6. Der Link zu dem Blog ist folgender: Maskil

    Ich würde gerne, dass vor den Headern der Sidebar jeweils ein Icon erscheint. Bei Archiv und Beta ist das auch kein Problem, bei Kategorien und Blogroll bekomme ich es einfach nicht hin.

    Diese Menüelemente scheinen von außerhalb generiert zu werden, so dass ich es nur hinbekomme, den Stern (mein Icon) davor zu setzen, was aber zur Folge hat, dass die Überschrift erst eine Zeile unten drunter angezeigt wird.

    Ich habe es auch schon probiert, den Grafik-Tag zwischen den h2 Container zu setzen, das funzt aber gar nicht, weil da ein Error angezeigt wird und bei Blogroll bin ich gänzlich ratlos...

    Ich habe die Anpassungen in der sidebar.php vorgenommen und der Grafiktag wäre folgender:

    Zitat

    <img src="<?php bloginfo('stylesheet_directory'); ?>/images/blog_stern.gif" width="21" height="16" border="0"/>

    Wer kann mir helfen? Es würde mir sehr helfen, vielen Dank!

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Das kann man bestimmt elegant mit css schreiben, kann ich aber nicht.

    Versuche mal die dumme Lösung

    HTML
    <img src="<?php bloginfo('stylesheet_directory'); ?>/images/blog_stern.gif" width="21" height="16" border="0" align="left" style="margin-right: 5px;" />


    Das eine sagt aus, bild nach links, das andere rechts der Text mit 5px Abstand. Ich weißt aber nicht, ob das da funktioniert. So würde ich es versuchen, so anfangen ;) Kann aber gut sein, das das dann mit <div> eingebunden werden muß, oder <p> , wie gesagt ausprobieren. Schicker ist es ja mit der css-Klasse zu definiern. *schaut ob Olaf kommt*

    Das Leben besteht nur aus Momenten.
    Vergiss nicht das Jetzt.

  • Danke

    Hallo S.i.T.,
    danke, dein Tipp hat genau so funktioniert, wie du es gesagt hast.
    Konnte ich direkt so anwenden ohne groß weiter rumzuprobieren.

    Vielen Dank also!

    Jocky

  • Uuuuppps, scheinbar ging hier meine letzte Antwort verloren.

    Es gibt nämlich doch noch ein Problem. Im Firefox funzt das tadellos, im Internet Explorer besteht das Problem weiterhin. Also das Icon erscheint, dann Leerraum und der Header erscheint erst in der nächsten Zeile (bei Kategorien und Blogroll). Das sieht natürlich sehr unschön aus.

    Also kann mir jemand mit einer anderen Lösung helfen.

    Denn das <h2> der Kategorien ist in einen php-Befehl eingebettet. Ich habe schon versucht den IMG Tag direkt vor das Wort Kategorien reinzukopieren. Aber dann kam eine Fehlermeldung... Irgendwie habe ich es nicht geschafft den PHP Tag im IMG Befehl richtig anzupassen.

    So sieht der Tag jetzt im Original aus:

    PHP
    <?php wp_list_categories('show_count=1&title_li=<h2>
                Kategorien</h2>'); ?>

    Und bei Blogroll ist es nicht viel anders. Das wird ja scheinbar außerhalb definiert. Ich habe aber nirgends was gefunden, wo das passiert.

    Oder gibt es eine ganz andere Möglichkeit. Hilfe!

    Vielen Dank für eure Anregungen und Tipps!

    Jocky

  • Hi, versuche es doch mal folgenderweise in der CSS deines Theme:

    Code
    #sidebar ul li h2 {
    background: transparent url('images/blog_stern.gif') top left no-repeat;[COLOR=#800080]
    padding-left: 22px;
    }[/COLOR]

    oder

    Code
    #sidebar h2 {
    background: transparent url('images/blog_stern.gif') top left no-repeat;[COLOR=#800080]
    padding-left: 22px;
    }[/COLOR]

    Gruß

  • Super! Die erste Variante hat funktioniert. Habe es auch gleich in allen Browsern getestet, die mir zur Verfügung stehen...

    Die zweite Variante hat zwar das Bild in die gleiche Zeile gesetzt, dafür lagen aber die Header direkt über dem Bild, hatten also keinen Abstand.

    Vielen Dank!

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!